Added ElevateCareers to my projects

LucasWinkler · Feb 28, 2024 · ae741a5 · ae741a5
1 parent 641a4d7
commit ae741a5
Show file tree

Hide file tree

Showing 2 changed files with 60 additions and 70 deletions.
diff --git a/index.html b/index.html
@@ -770,9 +770,66 @@ <h2 id="projectsHeading" class="projects__title heading-underline reveal reveal-
           <article class="project reveal-tablet-md-down reveal--fade-bottom-tablet-md-down">
             <div class="project__content reveal-tablet-md-up reveal--fade-right-tablet-md-up">
               <header class="project__header">
-                <h3 class="project__title">Audiophile E-commerce [WIP]</h3>
+                <h3 class="project__title">ElevateCareers</h3>
                 <span class="project__number" aria-hidden="true">01.</span>
               </header>
+              <div class="project__info">
+                <p class="project__description">
+                  A minimalistic, accessible job board with data scraped from Indeed.ca. Due to web scraping searches
+                  will take between 30-60 seconds and will stay cached for 1 hour.
+                </p>
+                <ul class="project__stack" aria-label="Project stack">
+                  <li class="project__tech">Next.js (React)</li>
+                  <li class="project__tech">TypeScript</li>
+                  <li class="project__tech">TailwindCSS</li>
+                  <li class="project__tech">Oxylabs Web Scraper API</li>
+                </ul>
+              </div>
+              <footer class="project__links">
+                <a class="button button--secondary" href="https://elevate-careers.vercel.app/" rel="noopener noreferrer"
+                  target="_blank" title="Open the live website" role="link">
+                  <span class="button__prepend button__prepend--no-fill">
+                    <svg aria-hidden="true" focusable="false" width="17" height="17" viewBox="0 0 17 17" fill="none"
+                      xmlns="http://www.w3.org/2000/svg">
+                      <path
+                        d="M8.3125 2.4375H1.4375V15.5625H14.5625V8.6875M14.5625 2.4375L7.6875 9.3125M11.4375 1.1875H15.8125V5.5625"
+                        stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
+                    </svg>
+                  </span>
+                  <span class="button__text button__text--fw-regular">
+                    See project
+                  </span>
+                </a>
+                <a class="button button--secondary" href="https://github.com/LucasWinkler/elevate-careers"
+                  rel="noopener noreferrer" target="_blank" title="Open the github repository">
+                  <span class="button__prepend">
+                    <svg aria-hidden="true" focusable="false" width="18" height="18" viewBox="0 0 18 18" fill="none"
+                      xmlns="http://www.w3.org/2000/svg">
+                      <path fill-rule="evenodd" clip-rule="evenodd"
+                        d="M9 0C4.0275 0 0 4.0275 0 9C0 12.9825 2.57625 16.3462 6.15375 17.5387C6.60375 17.6175 6.7725 17.3475 6.7725 17.1112C6.7725 16.8975 6.76125 16.1887 6.76125 15.435C4.5 15.8512 3.915 14.8837 3.735 14.3775C3.63375 14.1187 3.195 13.32 2.8125 13.1062C2.4975 12.9375 2.0475 12.5212 2.80125 12.51C3.51 12.4987 4.01625 13.1625 4.185 13.4325C4.995 14.7937 6.28875 14.4112 6.80625 14.175C6.885 13.59 7.12125 13.1962 7.38 12.9712C5.3775 12.7462 3.285 11.97 3.285 8.5275C3.285 7.54875 3.63375 6.73875 4.2075 6.10875C4.1175 5.88375 3.8025 4.96125 4.2975 3.72375C4.2975 3.72375 5.05125 3.4875 6.7725 4.64625C7.4925 4.44375 8.2575 4.3425 9.0225 4.3425C9.7875 4.3425 10.5525 4.44375 11.2725 4.64625C12.9937 3.47625 13.7475 3.72375 13.7475 3.72375C14.2425 4.96125 13.9275 5.88375 13.8375 6.10875C14.4113 6.73875 14.76 7.5375 14.76 8.5275C14.76 11.9812 12.6562 12.7462 10.6537 12.9712C10.98 13.2525 11.2613 13.7925 11.2613 14.6362C11.2613 15.84 11.25 16.8075 11.25 17.1112C11.25 17.3475 11.4187 17.6287 11.8687 17.5387C13.6554 16.9355 15.2079 15.7873 16.3077 14.2555C17.4076 12.7238 17.9995 10.8857 18 9C18 4.0275 13.9725 0 9 0Z"
+                        fill="white" />
+                    </svg>
+                  </span>
+                  <span class="button__text button__text--fw-regular">
+                    See code
+                  </span>
+                </a>
+              </footer>
+            </div>
+            <div class="project__image-wrapper reveal-tablet-md-up reveal--fade-right-tablet-md-up"
+              style="--animation-delay: 2">
+              <div class="project__image">
+                <img width="547" height="286" src="/images/project-elevatecareers.webp"
+                  alt="ElevateCareers project in desktop and mobile mockup devices" loading="lazy">
+              </div>
+            </div>
+          </article>
+          <article class="project reveal-tablet-md-down reveal--fade-bottom-tablet-md-down">
+            <div class="project__content reveal-tablet-md-up reveal--fade-right-tablet-md-up">
+              <header class="project__header">
+                <h3 class="project__title">Audiophile E-commerce [WIP]</h3>
+                <span class="project__number" aria-hidden="true">02.</span>
+              </header>
               <div class="project__info">
                 <p class="project__description">
                   An e-commerce solution for a fictional audio equipment store. It features a fully responsive design
@@ -828,7 +885,7 @@ <h3 class="project__title">Audiophile E-commerce [WIP]</h3>
             <div class="project__content reveal-tablet-md-up reveal--fade-right-tablet-md-up">
               <header class="project__header">
                 <h3 class="project__title">RankGuess [WIP]</h3>
-                <span class="project__number" aria-hidden="true">02.</span>
+                <span class="project__number" aria-hidden="true">03.</span>
               </header>
               <div class="project__info">
                 <p class="project__description">
@@ -888,7 +945,7 @@ <h3 class="project__title">RankGuess [WIP]</h3>
             <div class="project__content reveal-tablet-md-up reveal--fade-left-tablet-md-up">
               <header class="project__header">
                 <h3 class="project__title">TurboGames</h3>
-                <span class="project__number" aria-hidden="true">03.</span>
+                <span class="project__number" aria-hidden="true">04.</span>
               </header>
               <div class="project__info">
                 <p class="project__description">
@@ -948,73 +1005,6 @@ <h3 class="project__title">TurboGames</h3>
               </div>
             </div>
           </article>
-          <!-- <article class="project reveal-tablet-md-down reveal--fade-bottom-tablet-md-down">
-            <div class="project__content reveal-tablet-md-up reveal--fade-left-tablet-md-up">
-              <header class="project__header">
-                <h3 class="project__title">Personal Website V3</h3>
-                <span class="project__number" aria-hidden="true">01.</span>
-              </header>
-              <div class="project__info">
-                <p class="project__description">
-                  Iteration 3 of my personal website which features a clean,
-                  mobile first design that I created using Figma. I wanted to
-                  be able to make something that stands out more than my last
-                  site while still being simple and easy to follow.
-                </p>
-                <ul class="project__stack" aria-label="Project stack">
-                  <li class="project__tech">Vite</li>
-                  <li class="project__tech">HTML5</li>
-                  <li class="project__tech">SASS</li>
-                  <li class="project__tech">JS</li>
-                  <li class="project__tech">Fast-Average-Color</li>
-                </ul>
-              </div>
-              <footer class="project__links">
-                <div class="tooltip tooltip--active">
-                  <a class="button button--secondary disabled-link" title="Open the live website" role="link"
-                    aria-disabled="true" aria-describedby="project1DisabledReason">
-                    <span class="button__prepend button__prepend--no-fill">
-                      <svg aria-hidden="true" focusable="false" width="17" height="17" viewBox="0 0 17 17" fill="none"
-                        xmlns="http://www.w3.org/2000/svg">
-                        <path
-                          d="M8.3125 2.4375H1.4375V15.5625H14.5625V8.6875M14.5625 2.4375L7.6875 9.3125M11.4375 1.1875H15.8125V5.5625"
-                          stroke="white" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" />
-                      </svg>
-                    </span>
-                    <span class="button__text button__text--fw-regular">
-                      See project
-                    </span>
-                  </a>
-                  <div role="tooltip" class="tooltip__box" id="project1DisabledReason">
-                    <span class="tooltip__text">
-                      Psst... You're looking at it.
-                    </span>
-                  </div>
-                </div>
-                <a class="button button--secondary" href="https://github.com/LucasWinkler/personal-site-v3"
-                  rel="noopener noreferrer" target="_blank" title="Open the github repository">
-                  <span class="button__prepend">
-                    <svg aria-hidden="true" focusable="false" width="18" height="18" viewBox="0 0 18 18" fill="none"
-                      xmlns="http://www.w3.org/2000/svg">
-                      <path fill-rule="evenodd" clip-rule="evenodd"
-                        d="M9 0C4.0275 0 0 4.0275 0 9C0 12.9825 2.57625 16.3462 6.15375 17.5387C6.60375 17.6175 6.7725 17.3475 6.7725 17.1112C6.7725 16.8975 6.76125 16.1887 6.76125 15.435C4.5 15.8512 3.915 14.8837 3.735 14.3775C3.63375 14.1187 3.195 13.32 2.8125 13.1062C2.4975 12.9375 2.0475 12.5212 2.80125 12.51C3.51 12.4987 4.01625 13.1625 4.185 13.4325C4.995 14.7937 6.28875 14.4112 6.80625 14.175C6.885 13.59 7.12125 13.1962 7.38 12.9712C5.3775 12.7462 3.285 11.97 3.285 8.5275C3.285 7.54875 3.63375 6.73875 4.2075 6.10875C4.1175 5.88375 3.8025 4.96125 4.2975 3.72375C4.2975 3.72375 5.05125 3.4875 6.7725 4.64625C7.4925 4.44375 8.2575 4.3425 9.0225 4.3425C9.7875 4.3425 10.5525 4.44375 11.2725 4.64625C12.9937 3.47625 13.7475 3.72375 13.7475 3.72375C14.2425 4.96125 13.9275 5.88375 13.8375 6.10875C14.4113 6.73875 14.76 7.5375 14.76 8.5275C14.76 11.9812 12.6562 12.7462 10.6537 12.9712C10.98 13.2525 11.2613 13.7925 11.2613 14.6362C11.2613 15.84 11.25 16.8075 11.25 17.1112C11.25 17.3475 11.4187 17.6287 11.8687 17.5387C13.6554 16.9355 15.2079 15.7873 16.3077 14.2555C17.4076 12.7238 17.9995 10.8857 18 9C18 4.0275 13.9725 0 9 0Z"
-                        fill="white" />
-                    </svg>
-                  </span>
-                  <span class="button__text button__text--fw-regular">
-                    See code
-                  </span>
-                </a>
-              </footer>
-            </div>
-            <div class="project__image-wrapper reveal-tablet-md-up reveal--fade-left-tablet-md-up"
-              style="--animation-delay: 2">
-              <div class="project__image">
-                <img src="/images/project-personal-website-v3.webp" width="547" height="286"
-                  alt="Personal website v3 project in desktop and mobile mockup devices" loading="lazy">
-              </div>
-            </div>
-          </article> -->
         </div>
       </div>
     </section>

diff --git a/public/images/project-elevatecareers.webp b/public/images/project-elevatecareers.webp