Mercurial > hg > mgallery

changeset 209:671b7cfebf87

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Various fixes and adjustments to style.
author Matti Hamalainen <ccr@tnsp.org>
date Thu, 22 Mar 2018 13:41:36 +0200
parents cdccda315a0f
children 0a0a2936d779
files basic.css mgallery.js mgallery.php
diffstat 3 files changed, 42 insertions(+), 24 deletions(-) [+]
line wrap: on
line diff
--- a/basic.css	Wed Mar 21 18:39:13 2018 +0200
+++ b/basic.css	Thu Mar 22 13:41:36 2018 +0200
@@ -1,9 +1,9 @@
 body {
-	font-size: 12px;
+	font-size: 14px;
 	font-family: Verdana, Arial, helvetica, sans-serif;
 
 	color: white;
-	background: #121;
+	background: #454;
 
 	margin: 0;
 	padding: 0;
@@ -26,6 +26,11 @@
 }
 
 #imagePage {
+	position: absolute;
+	top: 0;
+	bottom: 0;
+	left: 0;
+	right: 0;
 }
 
 h1 {
@@ -48,7 +53,6 @@
 
 	border-top-left-radius: 0.5em;
 	border-top-right-radius: 0.5em;
-	box-shadow: 0px -4px 4px black;
 }
 
 #pageInfoFooter {
@@ -57,6 +61,7 @@
 	bottom: 0;
 	left: 0;
 	right: 0;
+	height: 1.5em;
 
 	background: #565;
 	margin: 0;
@@ -82,7 +87,6 @@
 	display: block;
 	text-decoration: none;
 	position: fixed;
-	top: 0.25em;
 	left: 0.15em;
 	z-index: 30;
 
@@ -117,8 +121,7 @@
  * Albums
  */
 div.albumHeaderText {
-	padding: 0.5em;
-	font-size: 1.25em;
+	padding: 0.25em;
 }
 
 .galleryTable {
@@ -146,8 +149,8 @@
 	width: 100%;
 }
 
-.albumTable {
-	border-bottom: 1px solid black;
+.galleryTable + .imageTable {
+	border-top: 2px solid #232;
 }
 
 .galleryTable a, .galleryTable a:visited  {
@@ -172,8 +175,9 @@
  *
  */
 #pageImageBox {
+	position: absolute;
 	top: 0;
-	bottom: 0;
+	bottom: 4.5em;
 	left: 0;
 	right: 0;
 }
@@ -200,8 +204,8 @@
 
 img.albumIcon {
 	border: 0.2em solid black;
-	border-radius: 0.6em;
-	box-shadow: 0px 0px 4px black;
+	border-radius: 0.4em;
+	box-shadow: 0px 0px 2px black;
 }
 
 a:hover img.albumIcon, a:active img.albumIcon, a:focus img.albumIcon {
@@ -280,11 +284,17 @@
 }
 
 .galleryEntry div.imageCaption {
-	font-size: 1.25em;
 }
 
-#pageImageBox div.imageCaption {
+#pageImageCaption {
+	position: absolute;
+	bottom: 1.5em;
+	left: 0;
+	right: 0;
+	height: 2em;
 	background: #350;
+	border-top: 1px solid black;
+	border-bottom: 1px solid black;
 	z-index: 12;
 }
 
@@ -389,7 +399,7 @@
 @media screen and (min-resolution: 150dpi) {
 
 	div.albumTitle, div.imageCaption {
-		font-size: 1.5em;
+		font-size: 1.2em;
 	}
 
 	#languages {
@@ -406,11 +416,16 @@
 	}
 
 	#naviBreadCrumbs {
-		font-size: 1.6em;
+		font-size: 1.5em;
 	}
 
-	h1 {
-		font-size: 1.25em;
+	div.albumHeaderText {
+		background: blue;
+	}
+
+	#pageImageCaption {
+		bottom: 0;
+		height: 2em;
 	}
 
 	#pageInfoFooter {
@@ -421,7 +436,7 @@
 		font-size: 1.5em;
 		top: auto;
 		left: auto;
-		bottom: 0.5em;
+		bottom: 2.5em;
 	}
 
 	#pageInfoButton {
@@ -443,13 +458,17 @@
 
 @media screen and (min-resolution: 150dpi) and (orientation: portrait) {
 	body {
-		font-size: 25px;
+		font-size: 24px;
 	}
 
 	div.galleryEntry {
 		width: 40%;
 	}
 
+	#pageInfoHeader {
+		font-size: 1.25em;
+	}
+
 	#pageInfoButton, #pageUpNaviButton {
 		font-size: 2em;
 	}
--- a/mgallery.js	Wed Mar 21 18:39:13 2018 +0200
+++ b/mgallery.js	Thu Mar 22 13:41:36 2018 +0200
@@ -116,8 +116,8 @@
 function mgalAdjustImageDo()
 {
   var eimg = document.getElementById("imageImage");
-  var win = mgalGetElementOrWindowSize();
-  var madj = 0.90;
+  var win = mgalGetElementOrWindowSize("pageImageBox");
+  var madj = 0.99;
   if (eimg && win != null)
   {
     if (eimg.width > eimg.height)
@@ -133,10 +133,9 @@
     else
     {
       eimg.style.width = "auto";
+      eimg.style.height = "100%";
       if (eimg.height > win[1] * madj)
         eimg.style.height = (win[1] * madj)+"px";
-      else
-        eimg.style.height = "100%";
     }
   }
   adjustPID = -1;
--- a/mgallery.php	Wed Mar 21 18:39:13 2018 +0200
+++ b/mgallery.php	Thu Mar 22 13:41:36 2018 +0200
@@ -603,8 +603,8 @@
       "</div>\n".
       mgGetNaviControlImageBoxJS($galImagesIndex, $index, "nextBtm", 1)."\n".
       mgGetNaviControlImageBox($galImagesIndex, $index, "next", 1)."\n".
-      (isset($data["caption"]) ? "<div class=\"imageCaption\">".mgGetArrStr($data, "caption", "%1")."</div>\n" : "").
     "</div>\n". // pageImageBox
+    (isset($data["caption"]) ? "<div id=\"pageImageCaption\" class=\"imageCaption\">".mgGetArrStr($data, "caption", "%1")."</div>\n" : "").
     // infoBox
     "<div id=\"infoBox\">\n".
       mgGetArr($data, "datetime", "<span class=\"infoDateTime\">%1</span>\n", "", "mgTimeStr").