footer is responsive
This commit is contained in:
parent
527afe8fec
commit
fcf5635bf5
56
style.css
56
style.css
@ -238,7 +238,7 @@ SECTIONS
|
||||
color: white;
|
||||
background: #0b4fa0;
|
||||
display: grid;
|
||||
grid-template-columns: minmax(1em, 1fr) minmax(130px, 250px) minmax(130px, 250px) minmax(1em, 1fr);
|
||||
grid-template-columns: minmax(1em, 1fr) minmax(130px, 500px) minmax(130px, 500px) minmax(1em, 1fr);
|
||||
grid-template-areas:
|
||||
"lpad socials partners rpad"
|
||||
"lpad menu logo rpad"
|
||||
@ -325,6 +325,60 @@ SECTIONS
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
@media (min-width: 760px) {
|
||||
.st-footer {
|
||||
background-color: white;
|
||||
grid-template-columns: minmax(1em, 1fr) minmax(50px, 80px) repeat(2, minmax(130px, 725px)) minmax(1em, 1fr);
|
||||
grid-template-areas:
|
||||
"lpad socials empty partners rpad"
|
||||
"lpad menu empty partners rpad"
|
||||
"lpad logo logo logo rpad"
|
||||
"lpad copy copy copy rpad";
|
||||
align-items: end;
|
||||
}
|
||||
|
||||
.st-footer-partners__title,
|
||||
.st-footer-partners__list-item a,
|
||||
.st-footer-nav-links a {
|
||||
color: #270BA1;
|
||||
}
|
||||
|
||||
.st-footer-partners__list-item a:hover,
|
||||
.st-footer-partners__list-item a:active,
|
||||
.st-footer-nav-links a:hover,
|
||||
.st-footer-nav-links a:active {
|
||||
color: #0b4fa0;
|
||||
}
|
||||
|
||||
.st-footer-partners ul {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.st-footer-site-title {
|
||||
writing-mode: horizontal-tb;
|
||||
justify-self: center;
|
||||
margin-top: .5em;
|
||||
font-size: 6.8rem;
|
||||
}
|
||||
|
||||
.st-footer-copyright {
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.st-footer-partners__list-item {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.st-footer-icon {
|
||||
font-size: 2rem;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.st-footer-nav-links a {
|
||||
font-size: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
/* article section */
|
||||
|
||||
.st-article-section,
|
||||
|
Loading…
Reference in New Issue
Block a user