Mercurial > hg > mgallery
diff basic.css @ 213:8938fef384a2
CSS adjustments, use nesting media query blocks.
author | Matti Hamalainen <ccr@tnsp.org> |
---|---|
date | Thu, 22 Mar 2018 17:54:04 +0200 |
parents | c3512a94189d |
children | 23995179ecd8 |
line wrap: on
line diff
--- a/basic.css Thu Mar 22 15:30:50 2018 +0200 +++ b/basic.css Thu Mar 22 17:54:04 2018 +0200 @@ -402,7 +402,42 @@ } -@media screen and (min-resolution: 150dpi) { +/* + * Mobile device rules via media queries + */ +@media screen and (min-resolution: 2dppx) and (min-resolution: 150dpi) { + + @media (orientation: landscape) { + body { + font-size: 18px; + } + + #pageInfoButton, #pageUpNaviButton { + font-size: 1.5em; + bottom: 3em; + } + } + + + @media (orientation: portrait) { + body { + font-size: 24px; + } + + div.galleryEntry { + width: 40%; + } + + #pageInfoHeader { + font-size: 1.25em; + } + + #pageInfoButton, #pageUpNaviButton { + font-size: 2em; + bottom: 2.5em; + } + } + div.albumTitle, div.imageCaption { font-size: 1.2em; @@ -439,43 +474,15 @@ } #pageInfoButton, #pageUpNaviButton { - font-size: 1.5em; top: auto; left: auto; - bottom: 2.5em; } #pageInfoButton { - right: 0.5em; + right: 0.25em; } #pageUpNaviButton { - right: 4.5em; - } -} - - -@media screen and (min-resolution: 150dpi) and (orientation: landscape) { - body { - font-size: 18px; + right: 4em; } } - - -@media screen and (min-resolution: 150dpi) and (orientation: portrait) { - body { - font-size: 24px; - } - - div.galleryEntry { - width: 40%; - } - - #pageInfoHeader { - font-size: 1.25em; - } - - #pageInfoButton, #pageUpNaviButton { - font-size: 2em; - } -}