Take content out of template and move to page/partials

2022-05-26 14:02:02 +02:00 · 2022-05-26 14:02:02 +02:00 · faa8aec491
commit faa8aec491
parent ef5dc8116a
5 changed files with 56 additions and 40 deletions
--- a/src/index.pug
+++ b/src/index.pug
@ -1 +1,23 @@
-extends templates/page.pug
+extends templates/homepage.pug
+
+block main
+  section.blog-recent
+    .header
+      h3 Latest Articles
+      .all-articles
+        a(href="/blog") All articles
+    .list
+      ul.blog-items
+        li.blog-item
+          img.article-image(src="//via.placeholder.com/128", alt="Article Topic")
+          .article-text
+            h4.article-title New Portfolio Layout
+            span.article-date(title='September 3rd 2021, 10:11:02') 9 months ago
+
+block aside
+  section.blog-popular
+    h3 Popular Content
+    ul.popular-items
+      li
+        include partials/arrow.pug
+        a.link(href="javascript:void(0)") New Portfolio Layout
--- a/src/partials/arrow.pug
+++ b/src/partials/arrow.pug
@ -0,0 +1,2 @@
+span.arrow
+  | <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>
--- a/src/templates/homepage.pug
+++ b/src/templates/homepage.pug
@ -0,0 +1,4 @@
+extends page.pug
+
+block variables
+  - var isHome = true;
--- a/src/templates/page.pug
+++ b/src/templates/page.pug
@ -1,39 +1 @@
-doctype html
-html(lang='en')
-  head
-    meta(charset='UTF-8')
-    meta(http-equiv='X-UA-Compatible', content='IE=edge')
-    meta(name='viewport', content='width=device-width, initial-scale=1.0')
-    title Portfolio - Daniel de Cloet
-  body.page-home
-    #app
-      .home-header
-        .container
-          include ../partials/header.pug
-          include ../partials/hero.pug
-        include ../partials/header-wave.pug
-      .container
-        .split-content
-          main
-            section.blog-recent
-              .header
-                h3 Latest Articles
-                .all-articles
-                  a(href="/blog") All articles
-              .list
-                ul.blog-items
-                  li.blog-item
-                    img.article-image(src="//via.placeholder.com/128", alt="Article Topic")
-                    .article-text
-                      h4.article-title New Portfolio Layout
-                      span.article-date(title='September 3rd 2021, 10:11:02') 9 months ago
-          aside
-            section.blog-popular
-              h3 Popular Content
-              ul.popular-items
-                li
-                  span.arrow
-                    | <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>
-                  a.link(href="javascript:void(0)") New Portfolio Layout
-      .container
-        include ../partials/footer.pug
+extends skeleton.pug
--- a/src/templates/skeleton.pug
+++ b/src/templates/skeleton.pug
@ -0,0 +1,26 @@
+block variables
+
+doctype html
+html(lang='en')
+  head
+    meta(charset='UTF-8')
+    meta(http-equiv='X-UA-Compatible', content='IE=edge')
+    meta(name='viewport', content='width=device-width, initial-scale=1.0')
+    title Portfolio - Daniel de Cloet
+  body.page-home
+    #app
+      .home-header
+        .container
+          include ../partials/header.pug
+          - if (isHome)
+            include ../partials/hero.pug
+        - if (isHome)
+          include ../partials/header-wave.pug
+      .container
+        .split-content
+          main
+            block main
+          aside
+            block aside
+      .container
+        include ../partials/footer.pug