added footer to main profile demo site

electric-eloquence · Aug 18, 2022 · 5ab5793 · 5ab5793
1 parent 1c482a7
commit 5ab5793
Show file tree

Hide file tree

Showing 5 changed files with 24 additions and 4 deletions.
diff --git a/excludes/profiles/main/source/_patterns/02-components/regions/footer.mustache b/excludes/profiles/main/source/_patterns/02-components/regions/footer.mustache
@@ -0,0 +1,3 @@
+<footer id="footer" class="footer">
+  This website is pure frontend hotness, created in Fepper.
+</footer>
diff --git a/excludes/profiles/main/source/_patterns/03-templates/page.mustache b/excludes/profiles/main/source/_patterns/03-templates/page.mustache
@@ -5,3 +5,4 @@
     {{> components-sidebar }}
   {{/ homepage? }}
 </main>
+{{> components-footer }}
diff --git a/excludes/profiles/main/source/_styles/bld/style.css b/excludes/profiles/main/source/_styles/bld/style.css
@@ -155,7 +155,7 @@ header {
   }
 }
 article {
-  min-height: calc(100vh - 21.5rem);
+  min-height: calc(100vh - 21.5rem - 8.4rem);
   padding: 0 1.5rem 2rem 4rem;
   width: calc(100vw - 28.8rem);
 }
@@ -205,6 +205,15 @@ article {
     right: 0;
   }
 }
+footer {
+  background-color: #000;
+  color: #fff;
+  height: 8.4rem;
+  padding: 3rem 1.5rem;
+  position: relative;
+  text-align: center;
+  width: 100%;
+}
 main {
   display: flex;
   margin: 0 auto;

diff --git a/excludes/profiles/main/source/_styles/src/stylus/0-base/00-variables.styl b/excludes/profiles/main/source/_styles/src/stylus/0-base/00-variables.styl
@@ -8,9 +8,7 @@ $bp-xl-min = unit($bp-lg-max + 1, px) // 1281px.
 
 // Colors
 $black-less-contrast = #363636
-$gray-light = #dddddd
 $pink = #fae6e6
-$white-translucent = rgba(255, 255, 255, 0.95)
 
 // Typography
 $font-main = "Fira Sans", sans-serif
@@ -21,3 +19,4 @@ $header-height = 21.5rem
 $nav-submenu-height = 20rem
 $nav-width = 28.8rem
 $nav-width-small = 25rem
+$footer-height = 8.4rem
diff --git a/excludes/profiles/main/source/_styles/src/stylus/02-components/regions.styl b/excludes/profiles/main/source/_styles/src/stylus/02-components/regions.styl
@@ -1,5 +1,5 @@
 article
-  min-height: 'calc(100vh - %s)' % $header-height
+  min-height: 'calc(100vh - %s - %s)' % ($header-height $footer-height)
   padding: 0 1.5rem 2rem 4rem
   width: 'calc(100vw - %s)' % $nav-width
   @media all and (max-width: $bp-md-max)
@@ -28,3 +28,11 @@ article
     transition: right 0.2s linear
     &.active
       right: 0
+footer
+  background-color: black
+  color: white
+  height: $footer-height
+  padding: 3rem 1.5rem
+  position: relative
+  text-align: center
+  width: 100%