MediaWiki:Mobile.css: Difference between revisions
no edit summary
imported>Jacob Robertson No edit summary |
imported>Jacob Robertson No edit summary |
||
| Line 33: | Line 33: | ||
align-items: center; | align-items: center; | ||
} | } | ||
.em-shrinker { | .em-shrinker { | ||
display: inline-block; | display: inline-block; | ||
| Line 46: | Line 42: | ||
color: var(--beacons-dark); | color: var(--beacons-dark); | ||
} | } | ||
/**************** PORTRAIT *********************/ | |||
@media screen and (width <= 480px) { | |||
.em-container { | .em-container { | ||
display: grid; | display: grid; | ||
| Line 90: | Line 90: | ||
} | } | ||
.em-trails { | .em-trails { | ||
grid-area: | grid-area: 2 / 2; | ||
margin-top: .8em; | margin-top: .8em; | ||
margin-bottom: .4em; | margin-bottom: .4em; | ||
| Line 111: | Line 111: | ||
} | } | ||
.em-landmarks { | .em-landmarks { | ||
grid-area: | grid-area: 1 / 1; | ||
margin-top: .4em; | margin-top: .4em; | ||
margin-bottom: .8em; | margin-bottom: .8em; | ||
| Line 117: | Line 117: | ||
margin-right: .8em; | margin-right: .8em; | ||
} | } | ||
div.em-pathways-container div.em-landmarks { | |||
background-image: linear-gradient(to right, var(--beacons-dark), var(--beacons-light)); | |||
} | |||
.em-landmarks-table { | |||
display: table; | |||
line-height: 98%; | |||
} | |||
.em-landmarks-top { | |||
display: table-row; | |||
} | |||
.em-landmarks-top-inner { | |||
display: table-cell; | |||
} | |||
.em-landmarks-bottom { | |||
display: table-row; | |||
} | |||
.em-landmarks-bottom-inner { | |||
display: table-cell; | |||
font-style: italic; | |||
font-weight: normal; | |||
font-size: 92%; | |||
} | |||
.em-pathways { | .em-pathways { | ||
grid-area: 8 / 2 / 9 / 4; | grid-area: 8 / 2 / 9 / 4; | ||
| Line 235: | Line 258: | ||
border: solid white 2px; | border: solid white 2px; | ||
border-radius: | border-radius: 2em%; | ||
font-weight: bold; | font-weight: bold; | ||
text-align: center; | text-align: center; | ||
| Line 323: | Line 346: | ||
} | } | ||
/ | /******************************** LANDSCAPE - COPY THIS DIRECTLY FROM Common.css *********************/ | ||
@media all and (width > 480px) { | @media all and (width > 480px) { | ||
.em-container { | .em-container { | ||
display: grid; | display: grid; | ||
| Line 379: | Line 394: | ||
} | } | ||
.em-trails { | .em-trails { | ||
grid-area: | grid-area: 2 / 2; | ||
margin-top: | margin-top: .5em; | ||
margin-bottom: | margin-bottom: 1em; | ||
margin-left: | margin-left: .5em; | ||
margin-right: | margin-right: 1em; | ||
} | } | ||
.em-guides { | .em-guides { | ||
| Line 400: | Line 415: | ||
} | } | ||
.em-landmarks { | .em-landmarks { | ||
grid-area: | grid-area: 1 / 1; | ||
margin-top: .5em; | margin-top: 1em; | ||
margin- | margin-bottom: .5em; | ||
margin- | margin-left: 1em; | ||
margin-right: .5em; | |||
} | |||
div.em-pathways-container div.em-landmarks { | |||
background-image: linear-gradient(to right, var(--beacons-dark), var(--beacons-light)); | |||
} | |||
.em-landmarks-table { | |||
display: table; | |||
line-height: 98%; | |||
} | |||
.em-landmarks-top { | |||
display: table-row; | |||
} | |||
.em-landmarks-top-inner { | |||
display: table-cell; | |||
} | |||
.em-landmarks-bottom { | |||
display: table-row; | |||
} | |||
.em-landmarks-bottom-inner { | |||
display: table-cell; | |||
font-style: italic; | |||
font-weight: normal; | |||
font-size: 92%; | |||
} | } | ||
.em-pathways { | .em-pathways { | ||
grid-area: 6 / 2 / 7 / 6; | grid-area: 6 / 2 / 7 / 6; | ||
| Line 521: | Line 560: | ||
border-bottom-right-radius: .5em; | border-bottom-right-radius: .5em; | ||
} | } | ||
div.em-bubble { | div.em-bubble { | ||
| Line 530: | Line 568: | ||
border: solid white 2px; | border: solid white 2px; | ||
border-radius: | border-radius: 2em; | ||
font-weight: bold; | font-weight: bold; | ||
text-align: center; | text-align: center; | ||
| Line 536: | Line 574: | ||
background-image: linear-gradient(to right, var(--milestone-dark), var(--milestone-light)); | background-image: linear-gradient(to right, var(--milestone-dark), var(--milestone-light)); | ||
} | } | ||
| Line 550: | Line 586: | ||
opacity: 55%; | opacity: 55%; | ||
} | } | ||
/*** end landscape section ***/ | /*** end landscape section ***/ | ||
} | } | ||