fyrfli/jsquotes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 3 Wiki Activity

Re-added footer and footer styling

Browse Source
This commit is contained in:
Camille Frantz 2022-05-18 10:38:58 -05:00
parent 37633c8a38
commit e1ca4263d4
3 changed files with 28 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app.js
View File

@ -1,3 +1,7 @@
// Full year for footer
const todayDate = new Date();
jsyear.innerText = todayDate.getFullYear();
const disp = document.querySelector(".display"); const disp = document.querySelector(".display");
fetch("FavouriteQuotes.json") fetch("FavouriteQuotes.json")

3
index.html
View File

@ -11,6 +11,9 @@
<body> <body>
<div class="display"></div> <div class="display"></div>
<footer class="footer">
&copy;<span id="jsyear"></span> Camille Frantz (<a href="https://github.com/fyrfli" target="_blank">@fyrfli</a>).
</footer>
<script src="app.js"></script> <script src="app.js"></script>
</body> </body>

21
style.css
View File

@ -9,6 +9,9 @@
} }
.display { .display {
width: 80vw;
max-width: 500px;
margin-top: 12rem;
background: linear-gradient(to bottom right, #0c024d, #0dbcc5); background: linear-gradient(to bottom right, #0c024d, #0dbcc5);
background-attachment: fixed; background-attachment: fixed;
color: white; color: white;
@ -16,3 +19,21 @@
padding: 2rem; padding: 2rem;
border-radius: 12px; border-radius: 12px;
} }
.footer {
display: block;
position: relative;
top: 30rem;
text-align: center;
font-size: 0.8rem;
margin: 2rem auto;
}
.footer a:any-link {
text-decoration: none;
color: #0c024d;
}
.footer a:hover {
color: #0dbcc5;
}