Commander1024/lostplaces-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Footer now uses global viewport variables.

Browse Source
This commit is contained in:
Marcus Scholz
2020-09-05 23:17:02 +02:00
parent 713edfdc3b
commit fb13f466d0
3 changed files with 186 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
components/03_Organisms/footer/_footer.scss
View File

@@ -114,7 +114,7 @@ footer {
color: $-almost-white
}
@media only screen and (max-width: 768px) {
@media(max-width: $-viewport-normal) {
.footer-list-header {
font-size: 2em
}
@@ -132,7 +132,7 @@ footer {
}
}
@media only screen and (max-width: 568px) {
@media(max-width: $-viewport-medium) {
.footer-list-top {
width: 100%
}
@@ -173,7 +173,7 @@ footer {
}
}
@media only screen and (max-width: 480px) {
@media(max-width: $-viewport-small) {
.footer-social-overlap > a {
margin: auto
}
@@ -185,7 +185,7 @@ footer {
}
}
@media only screen and (max-width: 320px) {
@media(max-width: $-viewport-extra-small) {
.footer-list-header {
font-size: 2.2em
}

6
components/main.scss
View File

@@ -60,10 +60,10 @@ $-primary-serif-font: 'Crimson Text',
serif;
// Define viewport sizes.
$-viewport-extra-small: 450px;
$-viewport-small: 650px;
$-viewport-medium: 750px;
$-viewport-normal: 1000px;
$-viewport-medium: 750px;
$-viewport-small: 650px;
$-viewport-extra-small: 450px;
// Define when to hide the sidebar.
$-viewport-toggle-sidebar: $-viewport-small;