From 1f1869796a85a2e6ef22ec04d639353a4ca05ce5 Mon Sep 17 00:00:00 2001
From: Juhana <juhana.luomanen@aalto.fi>
Date: Wed, 1 Mar 2017 14:13:20 +0200
Subject: [PATCH] Fix image scaling in infoscreen Resolves #32

---
 infoscreen/static/css/infoscreen.css      | 21 ++++++++++++++++-----
 infoscreen/static/html/generic_image.html |  5 ++++-
 2 files changed, 20 insertions(+), 6 deletions(-)

diff --git a/infoscreen/static/css/infoscreen.css b/infoscreen/static/css/infoscreen.css
index ef39121..5e3bd48 100644
--- a/infoscreen/static/css/infoscreen.css
+++ b/infoscreen/static/css/infoscreen.css
@@ -12,12 +12,23 @@
     height:100%;
 }
 
+.img-container{
+    width: 100vw;
+    height: 100vh;
+    position: relative;
+    overflow: hidden;
+}
 .fit {
-	width: auto;
-	min-height: 100%;
-	display: block;
-    margin-left: auto;
-    margin-right: auto;
+    position:absolute;
+    top: 50%;
+    left: 50%;
+    width: 100%;
+    min-height: 100%;
+    height: auto;
+    margin: auto;
+    -webkit-transform: translate(-50%,-50%);
+    -ms-transform: translate(-50%,-50%);
+    transform: translate(-50%,-50%);
 }
 
 .swap-animation.ng-enter, .swap-animation.ng-leave {
diff --git a/infoscreen/static/html/generic_image.html b/infoscreen/static/html/generic_image.html
index 3113d80..6a7747b 100644
--- a/infoscreen/static/html/generic_image.html
+++ b/infoscreen/static/html/generic_image.html
@@ -1 +1,4 @@
-<img ng-src="{{ img }}" class="fit"/>
+<div class="img-container">
+    <img ng-src="{{ img }}" class="fit"/>
+</div>
+