Mercurial > hg > mgallery

changeset 213:8938fef384a2

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
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 926779f93229
files basic.css
diffstat 1 files changed, 38 insertions(+), 31 deletions(-) [+]
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;
-	}
-}