WIP

[hacks/simpleWebSlides.git] / simpleWebSlides.css

diff --git a/simpleWebSlides.css b/simpleWebSlides.css
index 51ae087..32fdc55 100644 (file)
--- a/simpleWebSlides.css
+++ b/simpleWebSlides.css
@@ -1,10 +1,8 @@
 /*         Common           */
 body {
-    margin: 0 0 0 0;
-    padding: 0 0 0 0;
-    -webkit-box-sizing: border-box;
+    margin:0;
+    padding:0;
     box-sizing: border-box;
-    -moz-box-sizing: border-box;
 }
 
 .sws-active-object {
@@ -15,16 +13,9 @@ body {
 }
 
 .sws-canvas {
-    display: -webkit-flex;
-    display: flex;
-    flex-direction: column;
-    -webkit-flex-direction: column;
-    /* We make the box sizing border-box so that the user can freely add
-       padding and borders to canvas without changing the overall
-       layout */
     box-sizing: border-box;
-    -webkit-box-sizing: border-box;
-    -moz-box-sizing: border-box;
+    text-align: center;
+    vertical-align:middle;
 }
 .sws-cover {
     justify-content: center;
@@ -34,41 +25,31 @@ body {
 
 /* Layout of a canvas */
 .sws-header , .sws-title,{
-    -webkit-box-align:start;
-    display:block;
+    height:5vmin;
 }
 
 .sws-inner-canvas {
-    top-margin: auto;
-    bottom-margin: auto;
-    display:flex;
-    display:-webkit-flex;
-    flex: 3;
-    -webkit-flex: 3;
-    flex-direction: column;
-    -webkit-flex-direction: column;
-    justify-content: center;
-    -webkit-justify-content:center;
+    height: 80vmin;
+    text-align: justify;
 }
 
 .sws-content {
-    margin: 0vh;
-    padding: 0vh;
-    display:block;
+    margin: 0;
+    padding: 0;
+    display: block;
     width: 100%;
 }
 
 .sws-footer{
-    position: relative;
-    display:block;
-    bottom: 0pt;
-    left: 0pt;
+    height: 10vmin;
 }
 
 .sws-header, .sws-title, .sws-inner-canvas, .sws-footer{
-    margin: 0 0 0 0;
-    padding: 0 0 0 0;
+    display:inline-block;
+    margin:0;
+    padding:0;
     width: 100%;
+    box-sizing: border-box;
 }
 
 
@@ -85,8 +66,8 @@ body > h1, body > h2, body > h3 {
 }
 
 :root.sws-display .sws-canvas {
-    width:133.3vh;
-    height:100vh;
+    width:133.3vmin;
+    height:100vmin;
     overflow:hidden;
 }
 
@@ -95,27 +76,27 @@ body > h1, body > h2, body > h3 {
 /* Aspect is 4/3, 16/9, 16/10 (default is 4/3) */
 
 :root.sws-aspect-4-3 .sws-canvas {
-    width:133.3vh;
-    height:100vh;
+    width:133.3vmin;
+    height:100vmin;
 }
 
 :root.sws-aspect-16-9 .sws-canvas {
-    width:177.7vh;
-    height:100vh;
+    width:177.7vmin;
+    height:100vmin;
 }
 
 :root.sws-aspect-16-10 .sws-canvas {
-    width:160vh;
-    height:100vh;
+    width:160vmin;
+    height:100vmin;
 }
 
 :root.sws-display .sws-canvas {
     position: relative;
     margin-left: auto;
     margin-right: auto;
-    padding: 0vh;
-    margin-top: 0vh;
-    margin-bottom: 0vh;
+    padding: 0;
+    margin-top: 0;
+    margin-bottom: 0;
 }
 
 :root.sws-display .sws-inactive-slide {
@@ -141,8 +122,8 @@ body > h1, body > h2, body > h3 {
 
     @page {
        size: 297mm 210mm;
-       margin: 0pt;
-       padding: 0pt;
+       margin: 0;
+       padding: 0;
 
 }
 
@@ -213,11 +194,11 @@ p { width: 100%; }
 
 #sws-control-panel {
 /*    visibility: hidden;*/
-    font-size:6vh;
-    width: 100vh;
+    font-size:6vmin;
+    width: 100vmin;
     bottom: 0vh;
     display:inline-block;
-    border-radius: 1vh;
+    border-radius: 1vmin;
     background-color: white;
     opacity: 0.9;
     color: black;
@@ -231,7 +212,7 @@ p { width: 100%; }
 #sws-control-panel-canvas:after{
     content:"";
     display:inline-block;
-    width: 0vh;
+    width: 0vmin;
     height: 100%;
     background:pink;
     vertical-align:bottom;
@@ -239,7 +220,7 @@ p { width: 100%; }
 
 #sws-control-panel-title-bar {
     width: 100%;
-    font-size: 3vh;
+    font-size: 3vmin;
     text-align:right;
 }
 
@@ -247,7 +228,7 @@ p { width: 100%; }
  {
      display: inline-block;
      vertical-align: middle;
-     font-size: 3vh;
+     font-size: 3vmin;
  }
 
 #sws-control-panel-navigation {
@@ -263,7 +244,7 @@ p { width: 100%; }
 }
 
 #sws-control-panel-title-bar a {
-    padding:0vh 2vh 0vh 0vh;
+    padding:0vmin 2vmin 0vmin 0vmin;
     margin: 0 0 0 0;
 }
 
@@ -272,17 +253,17 @@ p { width: 100%; }
 }
 #sws-control-panel-slide-input
 {
-    font-size: 3vh;
+    font-size: 3vmin;
     width: 3em;
     vertical-align:middle;
 }
 #sws-control-panel-total-slides {
-    font-size: 3vh;
+    font-size: 3vmin;
     vertical-align:middle;
 }
 
 #sws-control-panel-navigation-bar {
-    width: 50vh;
+    width: 50vmin;
 }
 #sws-print-container {
     top: 0;
@@ -302,7 +283,7 @@ p { width: 100%; }
     left:35%;
     top:25%;
     opacity: 0.9;
-    border-radius: 1vh;
+    border-radius: 1vmin;
     display:none;
 }
 #sws-help-panel-canvas * {