Update Footer styles
This commit is contained in:
parent
125905222f
commit
4a8e723253
|
@ -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));
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<div class="footer-container">
|
<footer class="footer">
|
||||||
<footer class="footer">
|
|
||||||
<ul class="footer-links">
|
<ul class="footer-links">
|
||||||
<li>
|
<li>
|
||||||
<a href="https://t.me/deca_currency" target="_blank">
|
<a href="https://t.me/deca_currency" target="_blank">
|
||||||
|
@ -31,6 +30,6 @@
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue