Updated SASS configuration

Added some parallax to the footer - the footer now gets revealed as you scroll down instead of moving with the page
2021-08-20 23:38:00 -04:00 · 2021-08-20 22:52:10 -04:00
3 changed files with 40 additions and 17 deletions
--- a/src/_config.yml
+++ b/src/_config.yml
@ -18,3 +18,7 @@ links:
 # Build settings
 plugins:
  - jekyll-feed
+
+sass:
+  sass_dir: 'assets/stylesheets'
+  style: 'compressed'
--- a/src/_layouts/default.html
+++ b/src/_layouts/default.html
@ -10,6 +10,7 @@
  <script src="/assets/scripts/varrock.js"></script>
 </head>
 <body>
+  <div id="wrapper">
    <header id="header-box">
      <div id="header-logo">
        <h1>Bit Goblin</h1>
@ -32,6 +33,7 @@
        </div>
      </div>
    </div>
+  </div>

  <footer id="footer">
    <div class="row">
--- a/src/assets/stylesheets/lumbridge.sass
+++ b/src/assets/stylesheets/lumbridge.sass
@ -5,6 +5,7 @@ body
  font-family: "Gill Sans", sans-serif
  font-size: 2rem
  margin: 0
+  padding-bottom: 125px

 a
  color: #1e76d1
@ -21,8 +22,19 @@ hr
 .u-text-center
  text-align: center

+// this wrapper is only used to hide the footer
+#wrapper
+  position: relative
+  z-index: 10
+  width: 100%
+  height: 100%
+  margin: 0
+  padding: 0
+  background: white
+
 #header-box
  position: relative
+  z-index: 2
  height: 500px
  background:
    image: url(/assets/images/bg-banner.jpg)
@ -113,7 +125,12 @@ hr
 // footer section

 #footer
+  position: fixed
+  z-index: -1
+  bottom: 0
  width: 100%
  margin-top: 25px
  padding-top: 15px
+  background: #212121
  border-top: 2px solid #999
+  color: white
Author	SHA1	Message	Date
Gregory Ballantine	dad601e54b	Updated SASS configuration	2021-08-20 23:38:00 -04:00
Gregory Ballantine	4abc629afa	Added some parallax to the footer - the footer now gets revealed as you scroll down instead of moving with the page	2021-08-20 22:52:10 -04:00