From cf414a437d9a8b335a0114d81f894959ca2c7f37 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mike=20Schw=C3=B6rer?= <mailport@mikescher.de>
Date: Sun, 28 Jan 2018 14:23:12 +0100
Subject: [PATCH] chrome fixes

---
 www/data/css/styles.css               | 18 +++++++++++-------
 www/data/css/styles.min.css           | 10 +++++-----
 www/data/css/styles_bookslist.scss    |  3 ++-
 www/data/css/styles_booksview.scss    |  5 +++--
 www/data/css/styles_programslist.scss |  3 ++-
 www/data/css/styles_programsview.scss |  5 +++--
 www/index.php                         |  6 ------
 www/pages/programs_view.php           |  2 ++
 8 files changed, 28 insertions(+), 24 deletions(-)

diff --git a/www/data/css/styles.css b/www/data/css/styles.css
index 7ea6eff..3299da2 100644
--- a/www/data/css/styles.css
+++ b/www/data/css/styles.css
@@ -919,7 +919,7 @@ html, body {
 
 .prgl_elem_left img {
   width: 250px;
-  height: 100%;
+  height: auto;
   min-height: 100px; }
 
 .prgl_elem_right {
@@ -995,7 +995,8 @@ html, body {
     width: 350px; }
 
   .prgl_elem_left img {
-    width: 100%; }
+    width: 100%;
+    height: 100%; }
 
   .prgl_elem_title {
     font-size: 24pt;
@@ -1049,8 +1050,9 @@ html, body {
   margin-bottom: auto; }
 
 .prgv_left img {
-  max-height: 100%;
-  max-width: 100%; }
+  height: 100%;
+  width: 100%;
+  object-fit: contain; }
 
 .prgv_right {
   background: #BBB;
@@ -1160,7 +1162,8 @@ html, body {
 
 .booklst_left img {
   width: 150px;
-  height: auto; }
+  height: 200px;
+  object-fit: contain; }
 
 .booklst_right {
   display: flex;
@@ -1240,8 +1243,9 @@ html, body {
   margin-bottom: auto; }
 
 .bookv_left img {
-  max-height: 100%;
-  max-width: 100%; }
+  height: 100%;
+  width: 100%;
+  object-fit: contain; }
 
 .bookv_right {
   background: #BBB;
diff --git a/www/data/css/styles.min.css b/www/data/css/styles.min.css
index 06c9383..f1b0ec0 100644
--- a/www/data/css/styles.min.css
+++ b/www/data/css/styles.min.css
@@ -226,7 +226,7 @@ html,body{margin:0;padding:0;height:100%}
 .prgl_elem:hover .prgl_elem_subinfo_data{color:black}
 .prgl_elem:hover .prgl_elem_left img{filter:grayscale(100%)}
 .prgl_elem_left{padding:4px;display:flex}
-.prgl_elem_left img{width:250px;height:100%;min-height:100px}
+.prgl_elem_left img{width:250px;height:auto;min-height:100px}
 .prgl_elem_right{display:flex;flex-direction:column;flex-grow:1}
 .prgl_elem_title{color:#222;font-size:40pt;font-weight:bolder;flex-grow:1;display:flex;justify-content:center;align-items:center}
 .prgl_elem_sdesc{color:#555;font-size:14pt;flex-grow:1;margin-bottom:20px;margin-left:10px;margin-right:10px;display:flex;justify-content:center;align-items:center}
@@ -244,7 +244,7 @@ html,body{margin:0;padding:0;height:100%}
 }
 @media(max-width:850px){
 	.prgl_elem{flex-direction:column;width:350px}
-	.prgl_elem_left img{width:100%}
+	.prgl_elem_left img{width:100%;height:100%}
 	.prgl_elem_title{font-size:24pt;word-wrap:break-word;text-align:center}
 	.prgl_elem_left{justify-content:center}
 	.prgl_elem_info{flex-direction:column;margin:8px 0 8px 8px}
@@ -256,7 +256,7 @@ html,body{margin:0;padding:0;height:100%}
 #prgv_header hr{background:-moz-radial-gradient(circle,#CCC,#FFFFFF00);background:-webkit-radial-gradient(circle,#CCC 0,#FFFFFF00 100%)}
 .prgv_top{display:flex;flex-direction:row;margin-top:15px}
 .prgv_left{display:inline-flex;justify-content:center;flex-grow:1;margin-left:10px;margin-top:auto;margin-bottom:auto}
-.prgv_left img{max-height:100%;max-width:100%}
+.prgv_left img{height:100%;width:100%;object-fit:contain}
 .prgv_right{background:#BBB;border:1px solid #666;margin:0 10px;padding:8px 5px 2px 5px;min-height:250px;min-width:200px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto auto auto auto 1fr auto;grid-column-gap:15px;grid-row-gap:2px}
 .prgv_right_key{font-weight:bold}
 .prgv_right_value a{color:#333;text-decoration:none}
@@ -283,7 +283,7 @@ html,body{margin:0;padding:0;height:100%}
 .booklst_entry:hover .booklst_left img{filter:grayscale(100%)}
 .booklst_entry:hover .booklst_date span{background:white;border-left:1px solid black;border-bottom:1px solid black}
 .booklst_left{padding:4px;display:flex}
-.booklst_left img{width:150px;height:auto}
+.booklst_left img{width:150px;height:200px;object-fit:contain}
 .booklst_right{display:flex;flex-direction:column;flex-grow:1}
 .booklst_title{color:#222;font-size:40pt;font-weight:bolder;flex-grow:1;display:flex;justify-content:center;align-items:center;text-align:center}
 .booklst_date{display:flex;flex-direction:row-reverse;color:#222}
@@ -300,7 +300,7 @@ html,body{margin:0;padding:0;height:100%}
 #bookv_header hr{background:-moz-radial-gradient(circle,#CCC,#FFFFFF00);background:-webkit-radial-gradient(circle,#CCC 0,#FFFFFF00 100%)}
 .bookv_top{display:flex;flex-direction:row;margin-top:15px;padding-bottom:10px}
 .bookv_left{display:inline-flex;justify-content:center;flex-grow:1;margin-left:10px;margin-top:auto;margin-bottom:auto}
-.bookv_left img{max-height:100%;max-width:100%}
+.bookv_left img{height:100%;width:100%;object-fit:contain}
 .bookv_right{background:#BBB;border:1px solid #666;margin:0 10px;padding:8px 5px 2px 5px;min-height:250px;min-width:200px;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto auto auto auto auto 1fr auto;grid-column-gap:15px;grid-row-gap:2px}
 .bookv_right_key{font-weight:bold}
 .bookv_right_value a{color:#333;text-decoration:none}
diff --git a/www/data/css/styles_bookslist.scss b/www/data/css/styles_bookslist.scss
index 66dde0d..a0e0fa8 100644
--- a/www/data/css/styles_bookslist.scss
+++ b/www/data/css/styles_bookslist.scss
@@ -31,7 +31,8 @@
 
 .booklst_left img {
   width: 150px;
-  height: auto;
+  height: 200px;
+  object-fit: contain;
 }
 
 .booklst_right {
diff --git a/www/data/css/styles_booksview.scss b/www/data/css/styles_booksview.scss
index fe6f213..86a9cb7 100644
--- a/www/data/css/styles_booksview.scss
+++ b/www/data/css/styles_booksview.scss
@@ -42,8 +42,9 @@
 }
 
 .bookv_left img {
-  max-height: 100%;
-  max-width: 100%;
+  height: 100%;
+  width: 100%;
+  object-fit: contain
 }
 
 .bookv_right {
diff --git a/www/data/css/styles_programslist.scss b/www/data/css/styles_programslist.scss
index a00e75e..72d32f5 100644
--- a/www/data/css/styles_programslist.scss
+++ b/www/data/css/styles_programslist.scss
@@ -35,7 +35,7 @@
 
 .prgl_elem_left img {
   width: 250px;
-  height: 100%;
+  height: auto;
   min-height: 100px;
 }
 
@@ -131,6 +131,7 @@
   }
   .prgl_elem_left img {
     width: 100%;
+    height: 100%;
   }
   .prgl_elem_title {
     font-size: 24pt;
diff --git a/www/data/css/styles_programsview.scss b/www/data/css/styles_programsview.scss
index ab21661..f28afb9 100644
--- a/www/data/css/styles_programsview.scss
+++ b/www/data/css/styles_programsview.scss
@@ -41,8 +41,9 @@
 }
 
 .prgv_left img {
-  max-height: 100%;
-  max-width: 100%;
+  height: 100%;
+  width: 100%;
+  object-fit: contain
 }
 
 .prgv_right {
diff --git a/www/index.php b/www/index.php
index a386415..2a8c55b 100644
--- a/www/index.php
+++ b/www/index.php
@@ -199,9 +199,3 @@ try {
 //TODO euler insert+show 32bit | 64bit mode
 //TODO send cache header (?)
 //TODO global uncached error logger -> send by mail
-
-//TODO chrome test
-// - books view image height
-// - program list image height changes on hover
-//
-//
\ No newline at end of file
diff --git a/www/pages/programs_view.php b/www/pages/programs_view.php
index 437d09f..f4d8e0d 100644
--- a/www/pages/programs_view.php
+++ b/www/pages/programs_view.php
@@ -34,7 +34,9 @@ if ($prog === NULL) httpError(404, 'Program not found');
 				<div class="contentheader" id="prgv_header"><h1><?php echo htmlspecialchars($prog['name']); ?></h1><hr/></div>
 
 				<div class="prgv_top">
+
 					<div class="prgv_left"><img src="<?php echo $prog['mainimage_url']; ?>" alt="Thumbnail (<?php echo $prog['name'] ?>)" /></div>
+
 					<div class="prgv_right">
 						<div class="prgv_right_key"   style="grid-row:1">Name:</div>
 						<div class="prgv_right_value" style="grid-row:1"><a href="<?php echo $prog['url']; ?>"><?php echo htmlspecialchars($prog['name']) ?></a></div>