DECA
/
deca.eco
2
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases Wiki Activity

Update Footer styles

This commit is contained in:
David E. Perez Negron R. 2024-06-28 22:28:13 -06:00
parent 125905222f
commit 4a8e723253
2 changed files with 42 additions and 56 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
_includes/css/page.css
View File

@ -79,7 +79,7 @@
border-style: double; border-style: double;
position: relative; position: relative;
transition: all 0.3s ease; transition: all 0.3s ease;
box-shadow: 0 5px 15px var(--color-link-hover, rgba(0, 0, 0, 0.2)); box-shadow: 0 5px 15px var(--color-link-hover, rgba(0, 0, 0, 0.1));
} }
.main-button:hover, .main-button:focus, .main-button:hover, .main-button:focus,
@ -130,34 +130,19 @@
/* Ensure this section gets called from footer.css instead */ /* Ensure this section gets called from footer.css instead */
.footer-container {
background: var(--color-background-1);
}
.footer { .footer {
font: var(--text-caption);
color: var(--color-foreground-1);
max-width: var(--max-width); max-width: var(--max-width);
margin: auto; margin: auto;
text-align: center; text-align: center;
padding: 0 var(--margin);
} }
.footer-copyright {
margin: 0;
padding: var(--row-gap-0) 0;
& a {
color: currentColor;
}
}
.footer-links { .footer-links {
margin: 0; margin: 0;
list-style: none; list-style: none;
padding: 10px 0; padding: 10px 0;
display: flex; display: flex;
flex-wrap: wrap;
gap: 10px; gap: 10px;
justify-content: center; justify-content: center;
border-bottom: solid 1px var(--color-background-3);
& svg { & svg {
display: block; display: block;
@ -167,20 +152,22 @@
} }
& a { & a {
text-decoration: none; font: var(--font-display);
font: var(--text-caption-bold);
display: flex; display: flex;
align-items: center; align-items: center;
column-gap: 10px; column-gap: 10px;
padding: 10px; padding: 10px;
border-radius: var(--border-radius-small); border-radius: 5px;
color: currentColor; transition: background-color 0.2s ease,
white-space: nowrap; transform 0.2s ease,
box-shadow 0.5s;
&:hover { &:hover {
color: var(--color-foreground); color: var(--color-link-hover);
background: var(--color-background-2); transform: translateY(-2px);
box-shadow: 0 8px 20px var(--color-link-hover, rgba(0, 0, 0, 0.4));
} }
} }
} }

3
_includes/templates/footer.vto
View File

@ -1,4 +1,3 @@
<div class="footer-container">
<footer class="footer"> <footer class="footer">
<ul class="footer-links"> <ul class="footer-links">
<li> <li>
@ -32,5 +31,5 @@
</li> </li>
</ul> </ul>
</footer> </footer>
</div>