Gitea migration

.gitignore

@@ -0,0 +1,138 @@
+# ---> Node
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+.pnpm-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Snowpack dependency directory (https://snowpack.dev/)
+web_modules/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional stylelint cache
+.stylelintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variable files
+.env
+.env.development.local
+.env.test.local
+.env.production.local
+.env.local
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+.parcel-cache
+
+# Next.js build output
+.next
+out
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and not Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# vuepress v2.x temp and cache directory
+.temp
+.cache
+
+# vitepress build output
+**/.vitepress/dist
+
+# vitepress cache directory
+**/.vitepress/cache
+
+# Docusaurus cache and generated files
+.docusaurus
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# yarn v2
+.yarn/cache
+.yarn/unplugged
+.yarn/build-state.yml
+.yarn/install-state.gz
+.pnp.*
+

LICENSE

@@ -0,0 +1,18 @@
+MIT License
+
+Copyright (c) 2026 rapturate
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and 
+associated documentation files (the "Software"), to deal in the Software without restriction, including 
+without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 
+copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the 
+following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial 
+portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT 
+LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO 
+EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER 
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE 
+USE OR OTHER DEALINGS IN THE SOFTWARE.

Project 1/css/indexStyle.css

@@ -0,0 +1,418 @@
+/* Quick Reset */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+/*Variables*/
+:root {
+    --clr-name-plate: #1c3610;
+    --clr-text-color: rgb(41, 39, 39);
+    --clr-One:#F2D7C0;
+    --clr-Two:#B8C2C5;
+    --clr-Three:#43665f;
+    --clr-Four:#A68B78 ;
+    --clr-Five:#4A5052;
+    --clr-Six: #5D3A28;
+
+    --fs-h1: 2.5rem;
+    --fs-h2: 1.8rem;
+    --fs-h3: 1.2rem;
+    --fs-text: 1rem;
+    --fs-small: 0.9rem;
+}
+
+html {
+    height: 100%;
+}
+
+body {
+    font-family: 'Open Sans', Arial, sans-serif; 
+    line-height: 1.5;
+    background-color: var(--clr-One);
+    color: var(--clr-text-color);
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+/* Header */
+header {
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100%;
+    background-color: var(--clr-Three);
+    z-index: 10;
+    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+}
+
+div.nav-bar {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    width: 100%;
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 1rem 2rem;
+}
+
+.nav-logo {
+    background-color: var(--clr-One);
+    border-radius: 20px;
+    padding: 5px;
+}
+
+nav ul.nav-links {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    align-items: center;
+    list-style: none;
+}
+
+nav ul.nav-links a {
+    color: var(--clr-Six);
+    text-decoration: none;
+    padding: 0.5rem 1rem;
+    border-radius: 10px;
+    background-color: var(--clr-One);
+    font-weight: 500;
+    transition: background-color 0.3s ease;
+}
+
+nav ul.nav-links a:hover,
+nav ul.nav-links a:focus {
+    background-color: var(--clr-Four);
+    outline: none;
+}
+
+/* Main content */
+main {
+    flex: 1;
+    padding-top: 120px;
+}
+
+/* Hero */
+#hero {
+    display: flex;
+    flex-direction: column;
+    padding: 3rem 2rem;
+    min-height: 30rem;
+    background-image: url("../images/hero background.jpg");
+    background-size: cover;
+    background-position: center;
+    align-items: center;
+    justify-content: center;
+    gap: 2rem;
+}
+
+div.hero-text {
+    display: flex;
+    flex-direction: column;
+    text-align: center;
+    max-width: 500px;
+    gap: 1rem;
+}
+
+div.hero-text h1 {
+    color: var(--clr-name-plate);
+    font-size: var(--fs-h1);
+    font-weight: 700;
+}
+
+div.hero-text p {
+    color: var(--clr-text-color);
+    font-size: var(--fs-text);
+    max-width: 60ch;
+}
+
+.cta-button {
+    display: inline-block;
+    background-color: var(--clr-Three);
+    color: var(--clr-One);
+    padding: 1rem 2rem;
+    text-decoration: none;
+    border-radius: 10px;
+    font-weight: 600;
+    transition: background-color 0.3s ease;
+    margin-top: 1rem;
+    align-self: center;
+}
+
+.cta-button:hover,
+.cta-button:focus {
+    background-color: var(--clr-Six);
+    outline: none;
+}
+
+img.hero-img {
+    width: 200px;
+    height: 200px;
+    border-radius: 50%;
+    object-fit: cover;
+}
+
+/* About Section */
+.about-section {
+    padding: 4rem 2rem;
+    max-width: 800px;
+    margin: 0 auto;
+    text-align: justify;
+}
+
+.about-section h2 {
+    font-size: var(--fs-h2);
+    color: var(--clr-name-plate);
+    margin-bottom: 2rem;
+    text-align: center;
+}
+
+.about-section p {
+    font-size: var(--fs-text);
+    line-height: 1.6;
+    max-width: 75ch;
+}
+
+/* Projects Containers */
+.list-all-projects {
+    background-color: var(--clr-Four);
+    padding: 4rem 2rem;
+    min-height: 400px;
+}
+
+.list-all-projects h2 {
+    text-align: center;
+    color: var(--clr-text-color);
+    font-size: var(--fs-h2);
+    margin-bottom: 3rem;
+}
+
+#projects {
+    display: grid;
+    gap: 2rem;
+    grid-template-columns: 1fr;
+    max-width: 1200px;
+    margin: 0 auto;
+}
+
+.project-box {
+    background-color: var(--clr-Two);
+    border-radius: 15px;
+    display: flex;
+    align-items: flex-start;
+    color: var(--clr-text-color);
+    overflow: hidden;
+    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+    transition: transform 0.3s ease;
+}
+
+.project-box:hover {
+    transform: translateY(-2px);
+}
+
+.project-box img {
+    width: 150px;
+    height: 120px;
+    object-fit: cover;
+    flex-shrink: 0;
+}
+
+.proj-text {
+    padding: 1rem;
+    flex: 1;
+}
+
+.proj-text h3 {
+    font-size: var(--fs-h3);
+    margin-bottom: 0.5rem;
+    color: var(--clr-name-plate);
+}
+
+.proj-text p {
+    font-size: var(--fs-small);
+    line-height: 1.4;
+}
+
+/* Contact Section */
+#contact {
+    padding: 4rem 2rem;
+    background-color: var(--clr-One);
+}
+
+#contact h2 {
+    text-align: center;
+    font-size: var(--fs-h2);
+    color: var(--clr-name-plate);
+    margin-bottom: 2rem;
+}
+
+#socials {
+    display: flex;
+    justify-content: center;
+    gap: 2rem;
+    margin-bottom: 3rem;
+}
+
+#socials a img {
+    width: 3rem;
+    height: 3rem;
+    transition: transform 0.3s ease;
+}
+
+#socials a:hover img {
+    transform: scale(1.1);
+}
+
+form {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    gap: 1.5rem;
+    max-width: 500px;
+    margin: 0 auto;
+}
+
+form label {
+    align-self: flex-start;
+    font-weight: 600;
+    color: var(--clr-name-plate);
+}
+
+form input,
+form textarea {
+    width: 100%;
+    padding: 1rem;
+    font-size: var(--fs-text);
+    border: 3px solid var(--clr-Five);
+    border-radius: 10px;
+    background-color: white;
+    color: var(--clr-text-color);
+}
+
+form input:focus,
+form textarea:focus {
+    outline: none;
+    border-color: var(--clr-Three);
+}
+
+form textarea {
+    min-height: 120px;
+    resize: vertical;
+}
+
+form button {
+    background-color: var(--clr-Three);
+    color: var(--clr-One);
+    border: none;
+    padding: 1rem 2rem;
+    font-size: var(--fs-text);
+    border-radius: 10px;
+    cursor: pointer;
+    font-weight: 600;
+    transition: background-color 0.3s ease;
+}
+
+form button:hover,
+form button:focus {
+    background-color: var(--clr-Six);
+    outline: none;
+}
+
+/* Footer */
+footer {
+    background-color: var(--clr-Five);
+    color: var(--clr-One);
+    padding: 2rem;
+    text-align: center;
+    width: 100%;
+    margin-top: auto;
+}
+
+footer p {
+    margin-bottom: 1rem;
+}
+
+.social-links {
+    display: flex;
+    justify-content: center;
+    gap: 1.5rem;
+}
+
+.social-links a img {
+    width: 2rem;
+    height: 2rem;
+    filter: brightness(0) invert(1);
+    transition: transform 0.3s ease;
+}
+
+.social-links a:hover img {
+    transform: scale(1.1);
+}
+
+/* Responsive Design - Mobile First */
+@media (min-width: 600px) {
+    nav ul.nav-links {
+        flex-direction: row;
+    }
+    
+    #hero {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        align-items: center;
+        gap: 3rem;
+        padding: 4rem 2rem;
+    }
+    
+    div.hero-text {
+        text-align: left;
+        order: 2;
+    }
+    
+    div.hero-text h1 {
+        text-align: left;
+    }
+    
+    div.hero-text p {
+        text-align: left;
+    }
+    
+    .cta-button {
+        align-self: flex-start;
+    }
+    
+    img.hero-img {
+        order: 1;
+        justify-self: center;
+    }
+    
+    #projects {
+        grid-template-columns: repeat(2, 1fr);
+    }
+    
+    .project-box img {
+        width: 120px;
+        height: 100px;
+    }
+}
+
+@media (min-width: 900px) {
+    #projects {
+        grid-template-columns: repeat(3, 1fr);
+    }
+    
+    .project-box {
+        flex-direction: column;
+        text-align: center;
+    }
+    
+    .project-box img {
+        width: 100%;
+        height: 200px;
+    }
+    
+    .proj-text {
+        text-align: left;
+    }
+}

Project 1/css/projectStyle.css

@@ -0,0 +1,219 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+/*Variables*/
+:root {
+    --clr-primary: #009DF0;
+    --clr-accent-light: #F09B00;
+    --clr-accent-dark: #F04E00;
+    --clr-card-background: #E3F0FB;
+    --clr-page-background: #fffcf6;
+    --clr-text-light: #263f4a;
+    --clr-text-main: #1B0A14;
+    --clr-header-bg: #43665f;
+    --clr-nav-bg: #F2D7C0;
+    
+    --fs-h1: 2.5rem;
+    --fs-h2: 1.5rem;
+    --fs-text: 1rem;
+}
+
+html {
+    height: 100%;
+}
+
+body {
+    font-family: 'Open Sans', Arial, sans-serif;
+    line-height: 1.5;
+    background-color: var(--clr-page-background);
+    color: var(--clr-text-main);
+    min-height: 100vh;
+    display: flex;
+    flex-direction: column;
+}
+
+/* Header */
+header {
+    width: 100%;
+    background-color: var(--clr-header-bg);
+    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
+}
+
+.nav-bar {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 1rem 2rem;
+}
+
+.nav-logo {
+    background-color: var(--clr-nav-bg);
+    border-radius: 20px;
+    padding: 5px;
+}
+
+nav ul.nav-links {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    align-items: center;
+    list-style: none;
+}
+
+nav ul.nav-links a {
+    color: #5D3A28;
+    text-decoration: none;
+    padding: 0.5rem 1rem;
+    border-radius: 10px;
+    background-color: var(--clr-nav-bg);
+    font-weight: 500;
+    transition: background-color 0.3s ease;
+}
+
+nav ul.nav-links a:hover,
+nav ul.nav-links a:focus {
+    background-color: #A68B78;
+    outline: none;
+}
+
+.header-content {
+    text-align: center;
+    padding: 2rem;
+    background-color: var(--clr-page-background);
+}
+
+.header-content h1 {
+    font-size: var(--fs-h1);
+    color: var(--clr-text-main);
+    font-weight: 700;
+}
+
+/* Main content */
+main {
+    flex: 1;
+    padding: 3rem 2rem;
+    max-width: 1200px;
+    margin: 0 auto;
+    width: 100%;
+}
+
+#projects {
+    display: grid;
+    grid-template-columns: 1fr; /* Single column for mobile */
+    gap: 2rem;
+}
+
+#projects h2 {
+    font-size: var(--fs-h2);
+    color: var(--clr-text-main);
+    margin-bottom: 1rem;
+}
+
+#projects p {
+    color: var(--clr-text-light);
+    font-size: var(--fs-text);
+    line-height: 1.6;
+    max-width: 65ch;
+}
+
+.project-card {
+    display: flex;
+    flex-direction: column;
+    background-color: var(--clr-card-background);
+    border-radius: 16px;
+    box-shadow: 0 4px 12px rgba(91, 127, 161, 0.3);
+    overflow: hidden;
+    transition: transform 0.3s ease, box-shadow 0.3s ease;
+}
+
+.project-card:hover {
+    transform: translateY(-4px);
+    box-shadow: 0 8px 20px rgba(91, 127, 161, 0.4);
+}
+
+.project-image {
+    width: 100%;
+    height: 250px;
+    overflow: hidden;
+}
+
+.project-image img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    transition: transform 0.3s ease;
+}
+
+.project-card:hover .project-image img {
+    transform: scale(1.05);
+}
+
+.project-description {
+    padding: 1.5rem;
+    flex: 1;
+}
+
+.project-description h2 {
+    margin-bottom: 1rem;
+}
+
+/* Footer */
+footer {
+    background-color: #4A5052;
+    color: #F2D7C0;
+    padding: 2rem;
+    text-align: center;
+    width: 100%;
+    margin-top: auto;
+}
+
+footer p {
+    margin-bottom: 1rem;
+}
+
+.social-links {
+    display: flex;
+    justify-content: center;
+    gap: 1.5rem;
+}
+
+.social-links a img {
+    width: 2rem;
+    height: 2rem;
+    filter: brightness(0) invert(1);
+    transition: transform 0.3s ease;
+}
+
+.social-links a:hover img {
+    transform: scale(1.1);
+}
+
+/* Responsive Design - Mobile First */
+@media (min-width: 600px) {
+    nav ul.nav-links {
+        flex-direction: row;
+    }
+    
+    #projects {
+        grid-template-columns: repeat(2, 1fr);
+    }
+    
+    .project-image {
+        height: 200px;
+    }
+}
+
+@media (min-width: 900px) {
+    #projects {
+        grid-template-columns: repeat(3, 1fr);
+    }
+    
+    .project-image {
+        height: 250px;
+    }
+}

Project 1/images/Lew Header icon.svg

@@ -0,0 +1,12 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+                    <defs>
+                        <linearGradient id="grad6" x1="0%" y1="0%" x2="100%" y2="100%">
+                            <stop offset="0%" style="stop-color:#A2D3DB;stop-opacity:1" />
+                            <stop offset="50%" style="stop-color:#999FA0;stop-opacity:1" />
+                            <stop offset="100%" style="stop-color:#867262;stop-opacity:1" />
+                        </linearGradient>
+                    </defs>
+                    <circle cx="50" cy="50" r="30" fill="#f8af73ff" opacity="1"/>
+                    <path d="M25 40 Q40 28 55 40 Q70 52 80 40" stroke="url(#grad6)" stroke-width="5" fill="none" stroke-linecap="round"/>
+                    <path d="M25 50 Q35 42 45 50 Q55 58 65 50" stroke="url(#grad6)" stroke-width="3" fill="none" stroke-linecap="round" opacity="0.7"/>
+                </svg>

Project 1/images/Lew Header.svg

@@ -0,0 +1,13 @@
+<svg viewBox="0 0 280 100" xmlns="http://www.w3.org/2000/svg">
+                    <defs>
+                        <linearGradient id="grad6" x1="0%" y1="0%" x2="100%" y2="100%">
+                            <stop offset="0%" style="stop-color:#A2D3DB;stop-opacity:1" />
+                            <stop offset="50%" style="stop-color:#999FA0;stop-opacity:1" />
+                            <stop offset="100%" style="stop-color:#867262;stop-opacity:1" />
+                        </linearGradient>
+                    </defs>
+                    <circle cx="50" cy="50" r="30" fill="#f8af73ff" opacity="1"/>
+                    <path d="M25 40 Q40 28 55 40 Q70 52 80 40" stroke="url(#grad6)" stroke-width="5" fill="none" stroke-linecap="round"/>
+                    <path d="M25 50 Q35 42 45 50 Q55 58 65 50" stroke="url(#grad6)" stroke-width="3" fill="none" stroke-linecap="round" opacity="0.7"/>
+                    <text x="90" y="58" font-family="Arial, sans-serif" font-size="24" font-weight="600" fill="#323434">Rapturate</text>
+                </svg>

Project 1/images/facebook-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free 7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M576 320C576 178.6 461.4 64 320 64C178.6 64 64 178.6 64 320C64 440 146.7 540.8 258.2 568.5L258.2 398.2L205.4 398.2L205.4 320L258.2 320L258.2 286.3C258.2 199.2 297.6 158.8 383.2 158.8C399.4 158.8 427.4 162 438.9 165.2L438.9 236C432.9 235.4 422.4 235 409.3 235C367.3 235 351.1 250.9 351.1 292.2L351.1 320L434.7 320L420.3 398.2L351 398.2L351 574.1C477.8 558.8 576 450.9 576 320z"/></svg>

Project 1/images/instagram-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free 7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M320.3 205C256.8 204.8 205.2 256.2 205 319.7C204.8 383.2 256.2 434.8 319.7 435C383.2 435.2 434.8 383.8 435 320.3C435.2 256.8 383.8 205.2 320.3 205zM319.7 245.4C360.9 245.2 394.4 278.5 394.6 319.7C394.8 360.9 361.5 394.4 320.3 394.6C279.1 394.8 245.6 361.5 245.4 320.3C245.2 279.1 278.5 245.6 319.7 245.4zM413.1 200.3C413.1 185.5 425.1 173.5 439.9 173.5C454.7 173.5 466.7 185.5 466.7 200.3C466.7 215.1 454.7 227.1 439.9 227.1C425.1 227.1 413.1 215.1 413.1 200.3zM542.8 227.5C541.1 191.6 532.9 159.8 506.6 133.6C480.4 107.4 448.6 99.2 412.7 97.4C375.7 95.3 264.8 95.3 227.8 97.4C192 99.1 160.2 107.3 133.9 133.5C107.6 159.7 99.5 191.5 97.7 227.4C95.6 264.4 95.6 375.3 97.7 412.3C99.4 448.2 107.6 480 133.9 506.2C160.2 532.4 191.9 540.6 227.8 542.4C264.8 544.5 375.7 544.5 412.7 542.4C448.6 540.7 480.4 532.5 506.6 506.2C532.8 480 541 448.2 542.8 412.3C544.9 375.3 544.9 264.5 542.8 227.5zM495 452C487.2 471.6 472.1 486.7 452.4 494.6C422.9 506.3 352.9 503.6 320.3 503.6C287.7 503.6 217.6 506.2 188.2 494.6C168.6 486.8 153.5 471.7 145.6 452C133.9 422.5 136.6 352.5 136.6 319.9C136.6 287.3 134 217.2 145.6 187.8C153.4 168.2 168.5 153.1 188.2 145.2C217.7 133.5 287.7 136.2 320.3 136.2C352.9 136.2 423 133.6 452.4 145.2C472 153 487.1 168.1 495 187.8C506.7 217.3 504 287.3 504 319.9C504 352.5 506.7 422.6 495 452z"/></svg>

Project 1/images/linkedin-icon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 640"><!--!Font Awesome Free 7.0.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2025 Fonticons, Inc.--><path d="M512 96L127.9 96C110.3 96 96 110.5 96 128.3L96 511.7C96 529.5 110.3 544 127.9 544L512 544C529.6 544 544 529.5 544 511.7L544 128.3C544 110.5 529.6 96 512 96zM231.4 480L165 480L165 266.2L231.5 266.2L231.5 480L231.4 480zM198.2 160C219.5 160 236.7 177.2 236.7 198.5C236.7 219.8 219.5 237 198.2 237C176.9 237 159.7 219.8 159.7 198.5C159.7 177.2 176.9 160 198.2 160zM480.3 480L413.9 480L413.9 376C413.9 351.2 413.4 319.3 379.4 319.3C344.8 319.3 339.5 346.3 339.5 374.2L339.5 480L273.1 480L273.1 266.2L336.8 266.2L336.8 295.4L337.7 295.4C346.6 278.6 368.3 260.9 400.6 260.9C467.8 260.9 480.3 305.2 480.3 362.8L480.3 480z"/></svg>

Project 1/index.html

@@ -0,0 +1,129 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <!--Fonts-->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
+    <!--End Fonts-->
+
+    <link rel="stylesheet" href="css/indexStyle.css">
+    <title>See the Magic</title>
+    <link rel="icon" type="image/svg+xml" href="./images/Lew Header icon.svg">
+</head>
+<body>
+    <header>
+        <div class="nav-bar">
+            <a href="index.html"><img class ="nav-logo" src="./images/Lew Header.svg" alt="lew's logo" width="180" height="auto"></a>
+            <nav>
+                <ul class="nav-links">
+                    <li><a href="./project.html">Projects</a></li>
+                    <li><a href="#contact">Contact</a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+    
+    <main>
+        <section id="hero">
+            <img class="hero-img" src="./images/Lew's Images/Lew.JPG" alt="profile picture">
+            <div class="hero-text">
+                <h1>Lew Price</h1>
+                <p>Welcome to the Future!</p>
+                <a href="#contact" class="cta-button">Get In Touch</a>
+            </div>
+        </section>
+
+        <section class="about-section">
+            <h2>About Me</h2>
+            <p>I have been interested in computers and programming from a very young age. I started with HTML in 2008. I quickly dove deeper into the world of programming where I began learning Java. At the time, Minecraft Beta was just starting to become popular in the world of gaming and I would practice Java by modding Minecraft Beta. Java taught me the ins and outs of the object-oriented world where I started to branch out into other languages to learn more about algorithms and systems. I am now comfortable writing programs in C, C++, Java, Python, HTML, CSS, and Golang. In addition, I am comfortable working with SQL databases, UML diagraming, and MongoDB.</p>
+        </section>
+
+        <section class="list-all-projects">
+            <h2>Personal Projects</h2>
+            <div id="projects">
+                <div class="project-box">
+                    <img src="./images/Lew's Images/Project 1jpg.jpg" alt="project picture">
+                    <div class="proj-text">
+                        <h3>Web Scraper/Discord Bot</h3>
+                        <p>- Golang</p>
+                    </div>
+                </div>
+                <div class="project-box">
+                    <img src="./images/Lew's Images/ToDoList Project.jpg"  alt="project picture">
+                    <div class="proj-text">
+                        <h3>To-Do List</h3>
+                        <p>- Java</p>
+                    </div>
+                </div>
+                <div class="project-box">
+                    <img src="./images/Lew's Images/Doubly Linked List.jpg" alt="project picture">
+                    <div class="proj-text">
+                        <h3>Binary Search Tree</h3>
+                        <p>- C++</p>
+                    </div>
+                </div>
+                <div class="project-box">
+                    <img src="./images/Lew's Images/Graph Theory Project.jpg" alt="project picture">
+                    <div class="proj-text">
+                        <h3>Graph Theory Project</h3>
+                        <p>- C++</p>
+                    </div>
+                </div>
+                <div class="project-box">
+                    <img src="./images/Lew's Images/Find Median Sorted Array.jpg" alt="project picture">
+                    <div class="proj-text">
+                        <h3>Median of Two Sorted Arrays</h3>
+                        <p>- Golang</p>
+                    </div>
+                </div>
+            </div>
+        </section>
+
+        <section id="contact">
+            <h2>Contact Me</h2>
+            <div id="socials">
+                <a class="social-img" href="https://www.instagram.com/ohbejoyfulbags/" target="_blank">
+                    <img src="./images/instagram-icon.svg" alt="Instagram">
+                </a>
+                <a class="social-img" href="https://www.facebook.com/lewprice140" target="_blank">
+                    <img src="./images/facebook-icon.svg" alt="Facebook">
+                </a>
+                <a class="social-img" href="https://www.linkedin.com/in/lewis-price-a79185195/" target="_blank">
+                    <img  src="images/linkedin-icon.svg" alt="LinkedIn">
+                </a>
+            </div>
+            <form action="#" method="post">
+                <label for="name">Name:</label>
+                <input type="text" id="name" name="name" placeholder="Enter Your Name" required>
+                
+                <label for="email">Email:</label>
+                <input type="email" id="email" name="email" placeholder="person@gmail.com" required>
+                
+                <label for="message">Message:</label>
+                <textarea id="message" name="message" placeholder="Enter a short message!" required></textarea>
+                
+                <button type="submit">Send Message</button>
+            </form>
+        </section>
+    </main>
+    
+    <footer>
+        <p>&copy; 2024 Lorem Ipsum. All rights reserved.</p>
+        <div class="social-links">
+            <a href="https://www.instagram.com/lewcifer_the_great/" target="_blank" aria-label="Instagram">
+                <img src="./images/instagram-icon.svg" alt="">
+            </a>
+            <a href="https://www.facebook.com/lewprice140" target="_blank" aria-label="Facebook">
+                <img src="./images/facebook-icon.svg" alt="">
+            </a>
+            <a href="https://www.linkedin.com/in/lewis-price-a79185195/" target="_blank" aria-label="LinkedIn">
+                <img src="images/linkedin-icon.svg" alt="">
+            </a>
+        </div>
+    </footer>
+    
+</body>
+</html>

Project 1/project.html

@@ -0,0 +1,106 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <!--Fonts-->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Oswald:wght@200..700&family=Quicksand:wght@300..700&display=swap" rel="stylesheet">
+
+    <!--End Fonts-->
+    <link rel="stylesheet" href="css/projectStyle.css">
+    <title>Lew's Portfolio</title>
+</head>
+<body>
+    <header>
+        <div class="nav-bar">
+            <a href="index.html"><img class ="nav-logo" src="./images/Lew Header.svg" alt="lew's logo" width="180" height="auto"></a>
+            <nav>
+                <ul class="nav-links">
+                    <li><a href="./project.html">Projects</a></li>
+                    <li><a href="./index.html#contact">Contact</a></li>
+                </ul>
+            </nav>
+        </div>
+    </header>
+    
+    <main>
+        <section id="projects">
+
+            <!--Project 1-->
+            <div class="project-card">
+                <div class="project-image">
+                    <img src="./images/Lew's Images/Project 1jpg.jpg" alt="Project 1 Image">
+                </div>
+                <div class="project-description">
+                    <h2>Web Scraper/Discord Bot</h2>
+                    <p>A web scraper and Discord bot that pulls codes to unlock special gear in Borderlands 4 when prompted by a user on Discord.</p>
+                </div>
+            </div>
+
+            <!--Project 2-->
+            <div class="project-card">
+                <div class="project-image">
+                    <img src="./images/Lew's Images/ToDoList Project.jpg" alt="Project 2 Image">
+                </div>
+                <div class="project-description">
+                    <h2>To-Do List</h2>
+                    <p>A modifiable To-Do list that allows for organization and scheduling based on priority, date, and category.</p>
+                </div>
+            </div>
+
+            <!--Project 3-->
+            <div class="project-card">
+                <div class="project-image">
+                    <img src="./images/Lew's Images/Doubly Linked List.jpg" alt="Project 3 Image">
+                </div>
+                <div class="project-description">
+                    <h2>Binary Search Tree</h2>
+                    <p>A program that I wrote as a singly linked list then modified into a doubly linked list, and then modified into a binary search tree.</p>
+                </div>
+            </div>
+
+            <!--Project 4-->
+            <div class="project-card">
+                <div class="project-image">
+                    <img src="./images/Lew's Images/Graph Theory Project.jpg" alt="Project 4 Image">
+                </div>
+                <div class="project-description">
+                    <h2>Graph Theory Project</h2>
+                    <p>An exploration of weighted graph theory using “Cities” and “Roads” as nodes and edges. Search functions include Breadth First, Depth First, and Dijkstra's.</p>
+                </div>
+            </div>
+
+            <!--Project 5-->
+            <div class="project-card">
+                <div class="project-image">
+                    <img src="./images/Lew's Images/Find Median Sorted Array.jpg" alt="Project 5 Image">
+                </div>
+                <div class="project-description">
+                    <h2>Median of Two Sorted Arrays LeetCode Hard</h2>
+                    <p>Given two sorted arrays nums1 and nums2 of size m and n respectively, return the median of the two sorted arrays.</p>
+                </div>
+            </div>
+
+        </section>
+
+    </main>
+    
+    <footer>
+        <p>&copy; 2025 Group 18. All rights reserved.</p>
+        <div class="social-links">
+            <a href="https://www.instagram.com/lewcifer_the_great/" target="_blank" aria-label="Instagram">
+                <img src="./images/instagram-icon.svg" alt="">
+            </a>
+            <a href="https://www.facebook.com/lewprice140" target="_blank" aria-label="Facebook">
+                <img src="./images/facebook-icon.svg" alt="">
+            </a>
+            <a href="https://www.linkedin.com/in/lewis-price-a79185195/" target="_blank" aria-label="LinkedIn">
+                <img src="images/linkedin-icon.svg" alt="">
+            </a>
+        </div>
+
+    </footer>
+</body>
+</html>

README.md

@@ -0,0 +1,3 @@
+# Web_Dev_Project
+
+My personal website with HTML and CSS. Currently in development.