diff --git a/LabTemplatesCSS/LabTemplatesCSS/__init__.py b/LabTemplatesCSS/LabTemplatesCSS/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/LabTemplatesCSS/LabTemplatesCSS/asgi.py b/LabTemplatesCSS/LabTemplatesCSS/asgi.py
new file mode 100644
index 0000000..7a34927
--- /dev/null
+++ b/LabTemplatesCSS/LabTemplatesCSS/asgi.py
@@ -0,0 +1,16 @@
+"""
+ASGI config for LabTemplatesCSS project.
+
+It exposes the ASGI callable as a module-level variable named ``application``.
+
+For more information on this file, see
+https://docs.djangoproject.com/en/4.2/howto/deployment/asgi/
+"""
+
+import os
+
+from django.core.asgi import get_asgi_application
+
+os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'LabTemplatesCSS.settings')
+
+application = get_asgi_application()
diff --git a/LabTemplatesCSS/LabTemplatesCSS/settings.py b/LabTemplatesCSS/LabTemplatesCSS/settings.py
new file mode 100644
index 0000000..1091caa
--- /dev/null
+++ b/LabTemplatesCSS/LabTemplatesCSS/settings.py
@@ -0,0 +1,124 @@
+"""
+Django settings for LabTemplatesCSS project.
+
+Generated by 'django-admin startproject' using Django 4.2.16.
+
+For more information on this file, see
+https://docs.djangoproject.com/en/4.2/topics/settings/
+
+For the full list of settings and their values, see
+https://docs.djangoproject.com/en/4.2/ref/settings/
+"""
+
+from pathlib import Path
+
+# Build paths inside the project like this: BASE_DIR / 'subdir'.
+BASE_DIR = Path(__file__).resolve().parent.parent
+
+
+# Quick-start development settings - unsuitable for production
+# See https://docs.djangoproject.com/en/4.2/howto/deployment/checklist/
+
+# SECURITY WARNING: keep the secret key used in production secret!
+SECRET_KEY = 'django-insecure-4db+q+q1x7=#52cymqa9+@i(253(jaivqc@vll%sn#7a=1v2sn'
+
+# SECURITY WARNING: don't run with debug turned on in production!
+DEBUG = True
+
+ALLOWED_HOSTS = []
+
+
+# Application definition
+
+INSTALLED_APPS = [
+ 'django.contrib.admin',
+ 'django.contrib.auth',
+ 'django.contrib.contenttypes',
+ 'django.contrib.sessions',
+ 'django.contrib.messages',
+ 'django.contrib.staticfiles',
+ 'main',
+]
+
+MIDDLEWARE = [
+ 'django.middleware.security.SecurityMiddleware',
+ 'django.contrib.sessions.middleware.SessionMiddleware',
+ 'django.middleware.common.CommonMiddleware',
+ 'django.middleware.csrf.CsrfViewMiddleware',
+ 'django.contrib.auth.middleware.AuthenticationMiddleware',
+ 'django.contrib.messages.middleware.MessageMiddleware',
+ 'django.middleware.clickjacking.XFrameOptionsMiddleware',
+]
+
+ROOT_URLCONF = 'LabTemplatesCSS.urls'
+
+TEMPLATES = [
+ {
+ 'BACKEND': 'django.template.backends.django.DjangoTemplates',
+ 'DIRS': [],
+ 'APP_DIRS': True,
+ 'OPTIONS': {
+ 'context_processors': [
+ 'django.template.context_processors.debug',
+ 'django.template.context_processors.request',
+ 'django.contrib.auth.context_processors.auth',
+ 'django.contrib.messages.context_processors.messages',
+ ],
+ },
+ },
+]
+
+WSGI_APPLICATION = 'LabTemplatesCSS.wsgi.application'
+
+
+# Database
+# https://docs.djangoproject.com/en/4.2/ref/settings/#databases
+
+DATABASES = {
+ 'default': {
+ 'ENGINE': 'django.db.backends.sqlite3',
+ 'NAME': BASE_DIR / 'db.sqlite3',
+ }
+}
+
+
+# Password validation
+# https://docs.djangoproject.com/en/4.2/ref/settings/#auth-password-validators
+
+AUTH_PASSWORD_VALIDATORS = [
+ {
+ 'NAME': 'django.contrib.auth.password_validation.UserAttributeSimilarityValidator',
+ },
+ {
+ 'NAME': 'django.contrib.auth.password_validation.MinimumLengthValidator',
+ },
+ {
+ 'NAME': 'django.contrib.auth.password_validation.CommonPasswordValidator',
+ },
+ {
+ 'NAME': 'django.contrib.auth.password_validation.NumericPasswordValidator',
+ },
+]
+
+
+# Internationalization
+# https://docs.djangoproject.com/en/4.2/topics/i18n/
+
+LANGUAGE_CODE = 'en-us'
+
+TIME_ZONE = 'UTC'
+
+USE_I18N = True
+
+USE_TZ = True
+
+
+# Static files (CSS, JavaScript, Images)
+# https://docs.djangoproject.com/en/4.2/howto/static-files/
+
+STATIC_URL = 'static/'
+
+# Default primary key field type
+# https://docs.djangoproject.com/en/4.2/ref/settings/#default-auto-field
+
+DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
diff --git a/LabTemplatesCSS/LabTemplatesCSS/urls.py b/LabTemplatesCSS/LabTemplatesCSS/urls.py
new file mode 100644
index 0000000..e4b5f0f
--- /dev/null
+++ b/LabTemplatesCSS/LabTemplatesCSS/urls.py
@@ -0,0 +1,23 @@
+"""
+URL configuration for LabTemplatesCSS project.
+
+The `urlpatterns` list routes URLs to views. For more information please see:
+ https://docs.djangoproject.com/en/4.2/topics/http/urls/
+Examples:
+Function views
+ 1. Add an import: from my_app import views
+ 2. Add a URL to urlpatterns: path('', views.home, name='home')
+Class-based views
+ 1. Add an import: from other_app.views import Home
+ 2. Add a URL to urlpatterns: path('', Home.as_view(), name='home')
+Including another URLconf
+ 1. Import the include() function: from django.urls import include, path
+ 2. Add a URL to urlpatterns: path('blog/', include('blog.urls'))
+"""
+from django.contrib import admin
+from django.urls import path, include
+
+urlpatterns = [
+ path('admin/', admin.site.urls),
+ path('', include('main.urls'))
+]
diff --git a/LabTemplatesCSS/LabTemplatesCSS/wsgi.py b/LabTemplatesCSS/LabTemplatesCSS/wsgi.py
new file mode 100644
index 0000000..207dae6
--- /dev/null
+++ b/LabTemplatesCSS/LabTemplatesCSS/wsgi.py
@@ -0,0 +1,16 @@
+"""
+WSGI config for LabTemplatesCSS project.
+
+It exposes the WSGI callable as a module-level variable named ``application``.
+
+For more information on this file, see
+https://docs.djangoproject.com/en/4.2/howto/deployment/wsgi/
+"""
+
+import os
+
+from django.core.wsgi import get_wsgi_application
+
+os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'LabTemplatesCSS.settings')
+
+application = get_wsgi_application()
diff --git a/LabTemplatesCSS/main/__init__.py b/LabTemplatesCSS/main/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/LabTemplatesCSS/main/admin.py b/LabTemplatesCSS/main/admin.py
new file mode 100644
index 0000000..8c38f3f
--- /dev/null
+++ b/LabTemplatesCSS/main/admin.py
@@ -0,0 +1,3 @@
+from django.contrib import admin
+
+# Register your models here.
diff --git a/LabTemplatesCSS/main/apps.py b/LabTemplatesCSS/main/apps.py
new file mode 100644
index 0000000..167f044
--- /dev/null
+++ b/LabTemplatesCSS/main/apps.py
@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class MainConfig(AppConfig):
+ default_auto_field = 'django.db.models.BigAutoField'
+ name = 'main'
diff --git a/LabTemplatesCSS/main/migrations/__init__.py b/LabTemplatesCSS/main/migrations/__init__.py
new file mode 100644
index 0000000..e69de29
diff --git a/LabTemplatesCSS/main/models.py b/LabTemplatesCSS/main/models.py
new file mode 100644
index 0000000..71a8362
--- /dev/null
+++ b/LabTemplatesCSS/main/models.py
@@ -0,0 +1,3 @@
+from django.db import models
+
+# Create your models here.
diff --git a/LabTemplatesCSS/main/static/css/styles-ai.css b/LabTemplatesCSS/main/static/css/styles-ai.css
new file mode 100644
index 0000000..e1155ec
--- /dev/null
+++ b/LabTemplatesCSS/main/static/css/styles-ai.css
@@ -0,0 +1,123 @@
+html {
+ box-sizing: border-box;
+ *, *::after, *::before {
+ box-sizing: border-box;
+ }
+ font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
+}
+
+body {
+ margin: 0;
+ width: 100%;
+ background-image: linear-gradient(to top, #a18cd1 0%, #fff 30%);
+}
+
+.menu {
+ margin: 0 auto;
+ padding: 25px 10px 0 0;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ flex-wrap: wrap;
+}
+
+.menu > ul {
+ margin: 0;
+ padding: 0;
+}
+
+.menu > li {
+ list-style: none;
+ padding: 10px 20px;
+ margin: 5px 20px;
+ text-align: center;
+}
+
+
+h1 {
+ margin: 0 auto;
+ text-align: center;
+ background-image: linear-gradient(to top, #a18cd1 0%, #fbc2eb 100%);
+ padding: 30px;
+ position: relative;
+ animation-name: myanimation;
+ animation-duration: 2s;
+ }
+
+h3 {
+ background-color: #8EC5FC;
+ background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%);
+ text-align: center;
+ min-height: 50px;
+ min-width: 100%;
+ border-radius: 10px;
+ /* align-items: center; */
+ align-content: center;
+ position: relative;
+ animation-name: myanimation;
+ animation-duration: 2s;
+}
+
+.container {
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+}
+
+main {
+ width: 100%;
+ padding: 15px;
+}
+
+article {
+ margin: 0;
+ width: 100%;
+ padding: 15px;
+}
+
+img {
+ display: block;
+ width: 80%;
+ margin: 0 auto;
+
+ /* add animation */
+ position: relative;
+ animation-name: myanimation;
+ animation-duration: 2s;
+}
+
+/* for the animation */
+@keyframes myanimation {
+ 0% {opacity: 1;}
+ 25% {opacity: 0.75;}
+ 50% {opacity: 0.5;}
+ 75% {opacity: 0.75;}
+ 100% {opacity: 1;}
+}
+
+iframe {
+ display: block;
+ margin: 0 auto;
+ max-width: 90%;
+}
+
+@media (min-width: 640px) {
+ .container {
+ flex-direction: row;
+ }
+
+ .menu {
+ flex-direction: row;
+ }
+}
+
+@media (min-width: 1200px) {
+ body {
+ margin: 0 auto;
+ max-width: 80%;
+ }
+
+ h1 {
+ border-radius: 10px;
+ }
+}
\ No newline at end of file
diff --git a/LabTemplatesCSS/main/static/css/styles-cv.css b/LabTemplatesCSS/main/static/css/styles-cv.css
new file mode 100644
index 0000000..ae484d8
--- /dev/null
+++ b/LabTemplatesCSS/main/static/css/styles-cv.css
@@ -0,0 +1,377 @@
+@import
+url('https://fonts.googleapis.com/css?family="Poppins&display=swap');
+
+/* * {
+ box-sizing: border-box;
+} */
+
+html, body {
+ margin: 0;
+ padding: 0;
+ font-family: 'Poppins', sans-serif;
+}
+
+img {
+ border: 1px solid #333;
+}
+
+p {
+ font-size: 16px;
+ color: #222111;
+}
+
+h1 {
+ color: #02b3e4;
+}
+
+h3 {
+ text-align: center;
+ color: #02b3e4;
+}
+
+
+/*
+ *
+ * Header
+ *
+ */
+
+ header {
+ width: 100%;
+ display: inline-block;
+ border-bottom: 1px solid #333;
+ padding-top: 20px;
+ padding-left: 30px;
+ margin-bottom: 20px;
+ background-image: linear-gradient(to top, #ffffff , #cccccc);
+}
+
+.menu {
+ margin: 0 auto;
+ padding: 25px 10px 0 0;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ flex-wrap: wrap;
+}
+
+.menu > ul {
+ margin: 0;
+ padding: 0;
+}
+
+.menu > li {
+ list-style: none;
+ padding: 10px 20px;
+ margin: 5px 20px;
+ text-align: center;
+}
+
+.menu > li:first-of-type {
+ margin-left: 0;
+ padding-left: 0;
+}
+
+.logo, .title {
+ float: left;
+ margin-left: 15px;
+}
+
+.udacity-logo {
+ border: none;
+ width: 80px;
+ height: 80px;
+ padding-top: 20px;
+}
+
+
+/*
+ *
+ * Content
+ *
+ */
+
+.container {
+ display: flex;
+ flex-wrap: wrap;
+ margin: 0 40px;
+}
+
+.center {
+ display: block;
+ margin-left: auto;
+ margin-right: auto;
+ width: 100%;
+}
+
+.hero {
+ width: 100%;
+}
+
+.web-design-img {
+ max-width: 100%;
+}
+
+.my-journey {
+ width: 100%;
+}
+
+.featured-work-title {
+ margin-top: 50px;
+}
+
+.featured-work {
+ display: flex;
+ flex-wrap: wrap;
+ width: 100%;
+}
+
+.dark-grey {
+ color: #333444;
+}
+
+
+/*
+ *
+ * Modals of projects
+ *
+ */
+
+.darker {
+ /* margin-bottom: 0; */
+ /* padding-bottom: 0; */
+}
+
+.project-container {
+ margin-top: 0;
+ padding-top: 0;
+ display: flex;
+ flex-direction: column;
+ flex-wrap: wrap;
+ /* background-color: #fff; */
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
+ width: 100%;
+}
+
+.container-first {
+ background-color: rgba(211, 211, 211, 0.2);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ pointer-events: none;
+ height: 80vh;
+ width: 100vw;
+ order: 3;
+ padding-bottom: 30px;
+ margin-bottom: 0;
+ /* transition: opacity 0.3s ease; */
+}
+
+.container-second {
+ padding-top: 0;
+ background-color: rgba(211, 211, 211, 0.2);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ pointer-events: none;
+ top: 0;
+ left: 0;
+ height: 80vh;
+ width: 100%;
+ /* transition: opacity 0.3s ease; */
+ /* position: fixed; */
+ /* opacity: 1; */
+}
+
+.container-third {
+ padding-top: 0;
+ background-color: rgba(211, 211, 211, 0.2);
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ pointer-events: none;
+ top: 0;
+ left: 0;
+ height: 80vh;
+ width: 100%;
+ /* transition: opacity 0.3s ease; */
+ /* position: fixed; */
+ /* opacity: 0; */
+}
+
+
+.modal {
+ background-color: #fff;
+ border-radius: 5px;
+ box-shadow: 0 2px 4px rgba(211, 211, 211, 0.2);
+ padding: 30px 50px;
+ width: 350px;
+ max-width: 100%;
+ max-height: 88%;
+ text-align: center;
+}
+
+.modal h3 {
+ margin: 0 auto;
+}
+
+.modal-img {
+ width: 70%;
+ margin: 2px;
+ display:inline;
+}
+
+
+/*
+ *
+ * Footer
+ *
+ */
+
+footer {
+ width: 100%;
+ padding-left: 30px;
+ background-image: linear-gradient(to bottom, #ffffff , #cccccc);
+}
+
+#copyright {
+ padding: 20px 0;
+ padding-left: 20px;
+ margin-bottom: 0;
+}
+
+
+/*
+ *
+ * Media Queries
+ *
+ */
+
+@media screen and (max-width: 550px) {
+ body {
+ font-size: 12px;
+ }
+
+ .menu > li {
+ list-style: none;
+ padding: 10px;
+ margin: 10px;
+ }
+
+ .menu > li:first-of-type {
+ margin: 10px;
+ padding: 10px;
+ }
+
+
+ header {
+ padding-left: 10px;
+ }
+
+ .logo, .title {
+ margin-left: 10px;
+ }
+
+ .udacity-logo {
+ max-width: 60px;
+ max-height: 60px;
+ }
+
+ .container {
+ margin: 0 10px;
+ }
+
+ .web-design-img {
+ width: 95%;
+ margin-left: 5px;
+ margin-right: 5px;
+ }
+
+ .my-journey, .featured-work-title {
+ margin: 5px 5px;
+ }
+
+ .featured-work-title {
+ margin-top: 45px;
+ }
+
+ .first-work, .second-work, .third-work {
+ width: 95%;
+ margin: 5px 5px;
+ margin-bottom: 30px;
+ }
+
+}
+
+@media screen and (min-width: 550px) {
+ .menu {
+ flex-direction: row;
+ }
+
+ .menu > li {
+ list-style: none;
+ padding: 10px;
+ margin: 10px;
+ }
+
+ .menu > li:first-of-type {
+ margin:10px;
+ padding: 10px;
+ }
+
+
+ .second-work {
+ width: 46%;
+ order: +1;
+ margin: 10px auto;
+ }
+
+ .first-work, .third-work {
+ width: 46%;
+ margin: 10px auto;
+ margin-bottom: 30px;
+ }
+}
+
+@media screen and (min-width: 950px) {
+ body {
+ font-size: 1.2em;
+ }
+
+ .container {
+ width: 880px;
+ margin-left: auto;
+ margin-right: auto;
+ }
+
+ .hero {
+ width: 70%;
+ margin-right: 30px;
+ margin-bottom: 30px;
+ }
+
+ .my-journey {
+ width: 25%;
+ }
+
+ .first-work, .second-work, .third-work {
+ width: calc((100% - 60px) / 3);
+ margin-right: 5px;
+ }
+
+ .third-work {
+ margin-right: 0;
+ }
+
+ .project-container {
+ flex-direction: row;
+ }
+
+ .container-second, .container-third {
+ width: calc(100% / 2);
+ }
+
+ .footer {
+ padding-left: 30px;
+ }
+}
diff --git a/LabTemplatesCSS/main/static/css/styles-intro.css b/LabTemplatesCSS/main/static/css/styles-intro.css
new file mode 100644
index 0000000..e0cd409
--- /dev/null
+++ b/LabTemplatesCSS/main/static/css/styles-intro.css
@@ -0,0 +1,132 @@
+html {
+ /* resetting box-sizing to border-box */
+ box-sizing: border-box;
+ *, *::before, *::after {
+ box-sizing: inherit;
+ }
+ font-size: 14px;
+ font-family: "Montserrat", sans-serif;
+}
+
+body {
+ max-width: 100%;
+ margin: 0 auto;
+ /* background-image: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); */
+ background-image: linear-gradient(to top, #ffffff , #DEEFF5);
+ padding: 0 10px;
+}
+
+.menu {
+ margin: 0 auto;
+ padding: 25px 10px 0 0;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ flex-wrap: wrap;
+ }
+
+.menu > ul {
+ margin: 0;
+ padding: 0;
+}
+
+.menu > li {
+ list-style: none;
+ padding: 10px 20px;
+ margin: 5px 20px;
+ text-align: center;
+}
+
+
+h1 {
+ text-align: center;
+ margin: 0;
+ margin-bottom: 20px;
+ padding: 20px 0;
+ color: #00539f;
+ text-shadow: 2px 2px 1px black;
+}
+
+.container {
+ display: flex;
+ flex-direction: column;
+ gap: 20px;
+}
+
+aside {
+ border: 0.5px dashed darkgray;
+}
+
+aside > * {
+ /* children of aside */
+ margin-left: 10px;
+ margin-right: 10px;
+}
+
+p, li {
+ font-size: 16px;
+ line-height: 1.4;
+}
+
+img {
+ display: block;
+ width: 80%;
+ height: auto;
+}
+
+.form {
+ display: flex;
+}
+
+#name {
+ flex-grow: 1;
+ margin-left: 30px;
+ width: 100%;
+}
+
+#email {
+ flex-grow: 1;
+ margin-left: 33px;
+ width: 100%;
+}
+
+#msg {
+ flex-grow: 1;
+ margin-left: 8px;
+}
+
+.button {
+ display: flex;
+ justify-content: flex-end;
+}
+
+button {
+ margin: 15px;
+}
+
+
+table, th, tr, td {
+ border: 1px solid darkgray;
+ padding: 5px;
+ margin-bottom: 20px;
+}
+
+@media only screen and (min-width: 700px) {
+ p, td, li {
+ font-size: 1.2em;
+ }
+
+ body {
+ max-width: 80%;
+ }
+
+ .menu {
+ flex-direction: row;
+ }
+
+ /* change into two cloumns using flex */
+ .container {
+ flex-direction: row;
+ justify-content: space-between;
+ }
+}
\ No newline at end of file
diff --git a/LabTemplatesCSS/main/static/images/FlashCards.gif b/LabTemplatesCSS/main/static/images/FlashCards.gif
new file mode 100644
index 0000000..8ce2219
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/FlashCards.gif differ
diff --git a/LabTemplatesCSS/main/static/images/FlashCards2.gif b/LabTemplatesCSS/main/static/images/FlashCards2.gif
new file mode 100644
index 0000000..cd9e9a1
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/FlashCards2.gif differ
diff --git a/LabTemplatesCSS/main/static/images/Linux.jpg b/LabTemplatesCSS/main/static/images/Linux.jpg
new file mode 100644
index 0000000..08b4597
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/Linux.jpg differ
diff --git a/LabTemplatesCSS/main/static/images/MemoryGame.gif b/LabTemplatesCSS/main/static/images/MemoryGame.gif
new file mode 100644
index 0000000..1fa04d1
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/MemoryGame.gif differ
diff --git a/LabTemplatesCSS/main/static/images/MemoryGame2.gif b/LabTemplatesCSS/main/static/images/MemoryGame2.gif
new file mode 100644
index 0000000..3a3ff84
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/MemoryGame2.gif differ
diff --git a/LabTemplatesCSS/main/static/images/MyReads.gif b/LabTemplatesCSS/main/static/images/MyReads.gif
new file mode 100644
index 0000000..53850b8
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/MyReads.gif differ
diff --git a/LabTemplatesCSS/main/static/images/ai-blue.jpg b/LabTemplatesCSS/main/static/images/ai-blue.jpg
new file mode 100644
index 0000000..228c0f0
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/ai-blue.jpg differ
diff --git a/LabTemplatesCSS/main/static/images/boxing.avif b/LabTemplatesCSS/main/static/images/boxing.avif
new file mode 100644
index 0000000..134ecc5
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/boxing.avif differ
diff --git a/LabTemplatesCSS/main/static/images/flash-cards.JPG b/LabTemplatesCSS/main/static/images/flash-cards.JPG
new file mode 100644
index 0000000..1e0c461
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/flash-cards.JPG differ
diff --git a/LabTemplatesCSS/main/static/images/gradiant-test.png b/LabTemplatesCSS/main/static/images/gradiant-test.png
new file mode 100644
index 0000000..22d6f7f
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/gradiant-test.png differ
diff --git a/LabTemplatesCSS/main/static/images/gradiant_b.png b/LabTemplatesCSS/main/static/images/gradiant_b.png
new file mode 100644
index 0000000..c2454e4
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/gradiant_b.png differ
diff --git a/LabTemplatesCSS/main/static/images/html-css-js.png b/LabTemplatesCSS/main/static/images/html-css-js.png
new file mode 100644
index 0000000..bc6323e
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/html-css-js.png differ
diff --git a/LabTemplatesCSS/main/static/images/linux2.jpeg b/LabTemplatesCSS/main/static/images/linux2.jpeg
new file mode 100644
index 0000000..113a7a8
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/linux2.jpeg differ
diff --git a/LabTemplatesCSS/main/static/images/memory-game.jpg b/LabTemplatesCSS/main/static/images/memory-game.jpg
new file mode 100644
index 0000000..5558d8f
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/memory-game.jpg differ
diff --git a/LabTemplatesCSS/main/static/images/my-reads.jpg b/LabTemplatesCSS/main/static/images/my-reads.jpg
new file mode 100644
index 0000000..eafc47e
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/my-reads.jpg differ
diff --git a/LabTemplatesCSS/main/static/images/react.png b/LabTemplatesCSS/main/static/images/react.png
new file mode 100644
index 0000000..12aa9fc
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/react.png differ
diff --git a/LabTemplatesCSS/main/static/images/udacity-logo.png b/LabTemplatesCSS/main/static/images/udacity-logo.png
new file mode 100644
index 0000000..f2faef2
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/udacity-logo.png differ
diff --git a/LabTemplatesCSS/main/static/images/web-design-img.jpg b/LabTemplatesCSS/main/static/images/web-design-img.jpg
new file mode 100644
index 0000000..8f12adb
Binary files /dev/null and b/LabTemplatesCSS/main/static/images/web-design-img.jpg differ
diff --git a/LabTemplatesCSS/main/templates/main/article-ai.html b/LabTemplatesCSS/main/templates/main/article-ai.html
new file mode 100644
index 0000000..6f75934
--- /dev/null
+++ b/LabTemplatesCSS/main/templates/main/article-ai.html
@@ -0,0 +1,64 @@
+{% load static %}
+
+
+
+ Article AI
+
+
+ AI for Python Developers: Leveraging Artificial Intelligence
+
+
+
+ Discover how to use Python to build powerful AI applications, from data analysis to deployment.
+
+
+ Popular AI Libraries and Tools
+ Python has a range of libraries specifically designed for AI and machine learning. Here are some of the most commonly used ones:
+
+ TensorFlow: An open-source platform by Google for machine learning and deep learning. TensorFlow simplifies the process of building and training neural networks, with capabilities for both beginners and advanced users.PyTorch: Developed by Facebook, PyTorch offers an intuitive interface for building deep learning models, especially useful for research and rapid prototyping.scikit-learn: A versatile library for data analysis and classical machine learning, useful for tasks like regression, classification, clustering, and dimensionality reduction.
+
+
+ Getting Started with AI in Python
+ Python is one of the most popular languages for AI development due to its simplicity, vast library ecosystem, and community support. From developing intelligent applications to building machine learning models, Python provides all the tools and flexibility you need to explore AI.
+ VIDEO
+
+
+
+ Building Ethical AI Applications
+ As we develop AI applications, it’s important to consider their ethical implications, such as:
+
+ Bias in Data: Ensure your model is trained on diverse datasets to avoid biased results.Transparency: Build models that are explainable and make it clear how predictions are generated.Privacy: Handle sensitive data responsibly by following best practices for data security and anonymization.
+
+
+ Suggested Reading and Resources
+ For developers looking to deepen their AI knowledge, here are some additional resources:
+
+
+
Abdullah bin Rokan
+
+
+
+
+
+
+
Abdullah bin Rokan
+
Web Developer
+
+
+
+
+
+
+
+
+
+ My Journey
+ I have a bachelor of computer science from King Saud University, I enjoy coding and problem solving. I use to have basic knowledge of web development. But I wanted to learn more so I took Front-End and React Developer Nanodegrees with MISK Academy which improved my programming skills a lot.
+
+
+ My Goal
+ My goal is to gain more experince and to become a full-stack developer to build some great web apps
+
+
+
+
Skills
+
+
+
+
+
+
HTML / CSS / JS
+
+
+
+
React / React Native
+
+
+
+
Linux
+
+
+
+
Featured Work
+
+
+
+
+
Memory Game
+
This is a browser-based card matching game (also known as Concentration).
+
+
+
+
+
+
+
+
MyReads
+
MyReads is a web app that allows you to select and categorize books you have read, are currently reading, or want to read.
+
It also allows you to search for books and to add it to your library.
+
+
+
+
+
+
+
+
Mobile Flashcards
+
React Native app that allows users to study collections of flashcards.
+
+
+
+
+
+
CSS Introduction
+
+
+ Sports Passion
+ Welcome to Sports Passion website, we cover on-demand sport in over 200 countries worldwide
+ Sports coverage list
+
+ MMA
+ Boxing
+ Olympics
+
+
+
+ Links
+
+ Contact us
+
+
+
Latest Evnents
+
+ Sport
+ Event
+ Result
+
+ MMA
+ Topuria vs Holloway Topuria successfully defended his belt to remain the feather wieght champion
+
+
+ Boxing
+ Beterbiev vs Bivol Beterviev unfied the belts to become the undisputed light heavey wieght champion
+
+
+
+
\ No newline at end of file
diff --git a/LabTemplatesCSS/main/templates/main/home.html b/LabTemplatesCSS/main/templates/main/home.html
new file mode 100644
index 0000000..cc0ba52
--- /dev/null
+++ b/LabTemplatesCSS/main/templates/main/home.html
@@ -0,0 +1,20 @@
+{% load static %}
+
+
+
+ Document
+ HTML Introduction
+
+
+
+ HTML Introduction
+ Sports Passion
+ Welcome to Sports Passion website, we cover on-demand sport in over 200 countries worldwide
+ Sports coverage list
+
+ MMA
+ Boxing
+ Olympics
+
+ Links
+
+ Latest Evnents
+
+ Sport
+ Event
+ Result
+
+ MMA
+ Topuria vs Holloway Topuria successfully defended his belt to remain the feather wieght champion
+
+
+ Boxing
+ Beterbiev vs Bivol Beterviev unfied the belts to become the undisputed light heavey wieght champion
+
+
+ Contact us
+
+
+
\ No newline at end of file
diff --git a/LabTemplatesCSS/main/tests.py b/LabTemplatesCSS/main/tests.py
new file mode 100644
index 0000000..7ce503c
--- /dev/null
+++ b/LabTemplatesCSS/main/tests.py
@@ -0,0 +1,3 @@
+from django.test import TestCase
+
+# Create your tests here.
diff --git a/LabTemplatesCSS/main/urls.py b/LabTemplatesCSS/main/urls.py
new file mode 100644
index 0000000..ee605f7
--- /dev/null
+++ b/LabTemplatesCSS/main/urls.py
@@ -0,0 +1,12 @@
+from django.urls import path
+from . import views
+
+app_name = "main"
+
+urlpatterns = [
+ path("", views.home_view, name = "home_view"),
+ path("html/introduction/", views.html_intro_view, name = "html_intro_view"),
+ path("css/introduction/", views.css_intro_view, name = "css_intro_view"),
+ path("article/ai/", views.article_ai_view, name = "article_ai_view"),
+ path("career/cv/", views.career_cv_view, name = "career_cv_view"),
+]
diff --git a/LabTemplatesCSS/main/views.py b/LabTemplatesCSS/main/views.py
new file mode 100644
index 0000000..d3a8908
--- /dev/null
+++ b/LabTemplatesCSS/main/views.py
@@ -0,0 +1,23 @@
+from django.shortcuts import render
+from django.http import HttpRequest, HttpResponse
+
+# Create your views here.
+def html_intro_view(request: HttpRequest):
+
+ return render(request, "main/html-intro.html")
+
+def css_intro_view(request: HttpRequest):
+
+ return render(request, "main/css-intro.html")
+
+def article_ai_view(request: HttpRequest):
+
+ return render(request, "main/article-ai.html")
+
+def career_cv_view(request: HttpRequest):
+
+ return render(request, "main/career-cv.html")
+
+def home_view(request: HttpRequest):
+
+ return render(request, "main/home.html")
\ No newline at end of file
diff --git a/LabTemplatesCSS/manage.py b/LabTemplatesCSS/manage.py
new file mode 100755
index 0000000..d6e158e
--- /dev/null
+++ b/LabTemplatesCSS/manage.py
@@ -0,0 +1,22 @@
+#!/usr/bin/env python
+"""Django's command-line utility for administrative tasks."""
+import os
+import sys
+
+
+def main():
+ """Run administrative tasks."""
+ os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'LabTemplatesCSS.settings')
+ try:
+ from django.core.management import execute_from_command_line
+ except ImportError as exc:
+ raise ImportError(
+ "Couldn't import Django. Are you sure it's installed and "
+ "available on your PYTHONPATH environment variable? Did you "
+ "forget to activate a virtual environment?"
+ ) from exc
+ execute_from_command_line(sys.argv)
+
+
+if __name__ == '__main__':
+ main()
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+