BitGoblin/website
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Added some parallax to the footer - the footer now gets revealed as you scroll down instead of moving with the page

Browse Source
This commit is contained in:
Gregory Ballantine 2021-08-20 22:52:10 -04:00
parent 1904e631e6
commit 4abc629afa
2 changed files with 36 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/_layouts/default.html
View File

@ -10,6 +10,7 @@
<script src="/assets/scripts/varrock.js"></script> <script src="/assets/scripts/varrock.js"></script>
</head> </head>
<body> <body>
<div id="wrapper">
<header id="header-box"> <header id="header-box">
<div id="header-logo"> <div id="header-logo">
<h1>Bit Goblin</h1> <h1>Bit Goblin</h1>
@ -32,6 +33,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>
<footer id="footer"> <footer id="footer">
<div class="row"> <div class="row">

17
src/assets/stylesheets/lumbridge.sass
View File

@ -5,6 +5,7 @@ body
font-family: "Gill Sans", sans-serif font-family: "Gill Sans", sans-serif
font-size: 2rem font-size: 2rem
margin: 0 margin: 0
padding-bottom: 125px
a a
color: #1e76d1 color: #1e76d1
@ -21,8 +22,19 @@ hr
.u-text-center .u-text-center
text-align: 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 #header-box
position: relative position: relative
z-index: 2
height: 500px height: 500px
background: background:
image: url(/assets/images/bg-banner.jpg) image: url(/assets/images/bg-banner.jpg)
@ -113,7 +125,12 @@ hr
// footer section // footer section
#footer #footer
position: fixed
z-index: -1
bottom: 0
width: 100% width: 100%
margin-top: 25px margin-top: 25px
padding-top: 15px padding-top: 15px
background: #212121
border-top: 2px solid #999 border-top: 2px solid #999
color: white