From be3218290dc63ba251bfd2fe4d4dccb2122f4bbe Mon Sep 17 00:00:00 2001
From: Alexander Bilz <mail@alexbilz.com>
Date: Mon, 21 Feb 2022 18:13:35 +0000
Subject: [PATCH] feat: refactor CSS to SCSS 

---
 layouts/portfolio/list.html |  130 ++++++++++++++++++++----------------------
 1 files changed, 62 insertions(+), 68 deletions(-)

diff --git a/layouts/portfolio/list.html b/layouts/portfolio/list.html
index 27906e6..12fede9 100644
--- a/layouts/portfolio/list.html
+++ b/layouts/portfolio/list.html
@@ -1,5 +1,4 @@
 {{ define "main" }}
-
   {{ range $index, $elemen:= .Site.Data.portfolio.portfolioitems }}
     <div
       class="post {{ with .Site.Params.doNotLoadAnimations }}
@@ -10,88 +9,83 @@
 
       {{ end }}"
     >
-      <div class="post-content">
-        <div class="post-title">
-          <h2>{{ .title }}</h2>
-        </div>
-
-        {{ range $i, $p := .portfolioitem }}
-          <div class="box-wrapper">
-            {{ if .image }}
-              <div
-                class="box-image {{ if (modBool $i 2) }}
-                  box-image--right
-
-                {{ else }}
-                  box-image--left
-
-                {{ end }}"
-              >
-                <a href="{{ .link | safeURL }}" target="_blank" rel="noopener">
-                  <img src="{{ .image | relURL }}" alt="{{ .name | markdownify }}" />
-                </a>
-              </div>
-
-            {{ end }}
+      <h2 class="portfolio__title">{{ .title }}</h2>
+      {{ range $i, $p := .portfolioitem }}
+        <div class="portfolio">
+          {{ if .image }}
             <div
-              class="box {{ if (modBool $i 2) }}
-                box--left
+              class="portfolio__image-wrapper {{ if (modBool $i 2) }}
+                portfolio__image-wrapper--right
 
               {{ else }}
-                box--right
+                portfolio__image-wrapper--left
 
               {{ end }}"
             >
-              <h2>{{ .name | markdownify }}</h2>
+              <a href="{{ .link | safeURL }}" target="_blank" rel="noopener">
+                <img class="portfolio__image" src="{{ .image | relURL }}" alt="{{ .name | markdownify }}" />
+              </a>
+            </div>
+
+          {{ end }}
+          <div
+            class="portfolio__description {{ if (modBool $i 2) }}
+              portfolio__description--left
+
+            {{ else }}
+              portfolio__description--right
+
+            {{ end }}"
+          >
+            <h2>{{ .name | markdownify }}</h2>
+            <div class="info">
+              {{ if .status }}
+                <em class="fas fa-flag-checkered"></em>
+                <span>{{ .status }}</span>
+
+              {{ end }}
+              {{ if .venue }}
+                <em class="fas fa-map-marker-alt"></em>
+                <span>{{ .venue }}</span>
+
+              {{ end }}
+              {{ if .start }}
+                <span>Start:</span>
+                <span>{{ .start }}</span>
+
+              {{ end }}
+              {{ if .end }}
+                <span>End:</span>
+                <span>{{ .end }}</span>
+
+              {{ end }}
+            </div>
+            {{ if .authors }}
               <div class="info">
-                {{ if .status }}
-                  <em class="fas fa-flag-checkered"></em>
-                  <span>{{ .status }}</span>
-
-                {{ end }}
-                {{ if .venue }}
-                  <em class="fas fa-map-marker-alt"></em>
-                  <span>{{ .venue }}</span>
-
-                {{ end }}
-                {{ if .start }}
-                  <span>Start:</span>
-                  <span>{{ .start }}</span>
-
-                {{ end }}
-                {{ if .end }}
-                  <span>End:</span>
-                  <span>{{ .end }}</span>
+                {{ range .authors }}
+                  <span>{{ . }}</span>
 
                 {{ end }}
               </div>
-              {{ if .authors }}
-                <div class="info">
-                  {{ range .authors }}
-                    <span>{{ . }}</span>
 
-                  {{ end }}
-                </div>
-
-              {{ end }}
-              <p>{{ .description | markdownify }}</p>
-              {{ if .link }}
-                <div class="cta">
-                  <a class="btn" href="{{ .link | safeURL }}" target="_blank" rel="noopener">Visit Site</a>
-                </div>
-
-              {{ end }}
-              <div class="seperator">
-                {{ range .tags }}
-                  <p class="tag">{{ . }}</p>
-
-                {{ end }}
+            {{ end }}
+            <p>{{ .description | markdownify }}</p>
+            {{ if .link }}
+              <div class="portfolio__button-wrapper">
+                <a class="portfolio__button" href="{{ .link | safeURL }}" target="_blank" rel="noopener">Visit Site</a>
               </div>
+
+            {{ end }}
+            <div class="seperator">
+              {{ range .tags }}
+                <p class="tag">{{ . }}</p>
+
+              {{ end }}
             </div>
           </div>
+        </div>
 
-        {{ end }}
-      </div>
+      {{ end }}
     </div>
 
   {{ end }}

--
Gitblit v1.10.0