simpleWebSlides.css

   1
   2 /*         Common           */
   3 body {
   4     margin: 0 0 0 0;
   5     padding: 0 0 0 0;
   6     -webkit-box-sizing: border-box;
   7     box-sizing: border-box;
   8     -moz-box-sizing: border-box;
   9 }
  10
  11 .sws-active-object {
  12     visibility: visible;
  13 }
  14 .sws-inactive-object {
  15     opacity: 0;
  16 }
  17
  18
  19 .sws-canvas {
  20     display: -webkit-flex;
  21     display: flex;
  22     flex-direction: column;
  23     -webkit-flex-direction: column;
  24     /* We make the box sizing border-box so that the user can freely add
  25        padding and borders to canvas without changing the overall
  26        layout */
  27     -webkit-box-sizing: border-box;
  28     box-sizing: border-box;
  29     -moz-box-sizing: border-box;
  30 }
  31
  32 .sws-cover {
  33     justify-content: center;
  34     -webkit-justify-content: center;
  35     text-align:center;
  36 }
  37
  38 /* Layout of a canvas */
  39 .sws-header , .sws-title,{
  40     -webkit-box-align:start;
  41     display:block;
  42 }
  43
  44 .sws-inner-canvas {
  45     top-margin: auto;
  46     bottom-margin: auto;
  47     display:flex;
  48     display:-webkit-flex;
  49     flex: 3;
  50     -webkit-flex: 3;
  51     flex-direction: column;
  52     -webkit-flex-direction: column;
  53     justify-content: center;
  54     -webkit-justify-content:center;
  55 }
  56
  57 .sws-content {
  58     margin: 0vh;
  59     padding: 0vh;
  60     display:block;
  61     width: 100%;
  62 }
  63
  64 .sws-footer{
  65     display:block;
  66 }
  67
  68 .sws-header, .sws-title, .sws-inner-canvas, .sws-footer{
  69     margin: 0 0 0 0;
  70     padding: 0 0 0 0;
  71     width: 100%;
  72 }
  73
  74
  75
  76 body > h1, body > h2, body > h3 {
  77     display: none;
  78 }
  79 /*             Display Mode             */
  80 /****************************************/
  81
  82
  83 :root.sws-display body {
  84     overflow:hidden;
  85 }
  86
  87 :root.sws-display .sws-canvas {
  88     width:133.3vh;
  89     height:100vh;
  90 }
  91
  92
  93 /* display mode */
  94 /* Aspect is 4/3, 16/9, 16/10 (default is 4/3) */
  95
  96 :root.sws-aspect-4-3 .sws-canvas {
  97     width:133.3vh;
  98     height:100vh;
  99 }
 100
 101 :root.sws-aspect-16-9 .sws-canvas {
 102     width:177.7vh;
 103     height:100vh;
 104 }
 105
 106 :root.sws-aspect-16-10 .sws-canvas {
 107     width:160vh;
 108     height:100vh;
 109 }
 110
 111 :root.sws-display .sws-canvas {
 112     position: relative;
 113     margin-left: auto;
 114     margin-right: auto;
 115     padding: 0vh;
 116     margin-top: 0vh;
 117     margin-bottom: 0vh;
 118 }
 119
 120 :root.sws-display .sws-inactive-slide {
 121     display: none;
 122 }
 123 :root.sws-display body {
 124     background: black;
 125 }
 126
 127
 128 /*                 Print Mode                 */
 129 /* ****************************************** */
 130
 131 @page { margin: 0pt 0pt 0pt 0pt; }
 132
 133 :root.sws-print body {
 134     background: white;
 135 }
 136
 137 :root.sws-print body {
 138     width: 297mm;
 139     height: 210mm;
 140     padding: 0pt 0pt 0pt 0pt;
 141     margin: 0pt 0pt 0pt 0pt;
 142
 143 }
 144
 145 :root.sws-print .sws-canvas {
 146     position: relative;
 147     width: 297mm;
 148     height: 210mm;
 149     clear:both;
 150     float:left;
 151     page-break-after: always;
 152     padding: 0pt 0pt 0pt 0pt;
 153     margin: 0pt 0pt 0pt 0pt;
 154     overflow: hidden;
 155 }
 156
 157 :root.sws-print .sws-canvas:last{
 158     page-break-after: avoid;
 159 }
 160 :root.sws-print .sws-inactive-slide {
 161     opacity: 1;
 162 }
 163
 164
 165 p { width: 100%; }
 166
 167
 168
 169 /*             Control Panel             */
 170 /*****************************************/
 171
 172
 173
 174 @font-face {
 175   font-family: 'entypo';
 176   font-style: normal;
 177   font-weight: normal;
 178   src: url('entypo.woff') format('woff');
 179 }
 180 /* entypo */
 181 .sws-symbol {
 182     font-family: 'entypo';
 183 }
 184
 185 #sws-control-panel-canvas {
 186     position: fixed;
 187     z-index: 100;
 188     left: 0pt;
 189     bottom: 0pt;
 190     width: 100%;
 191     height: 100%;
 192     overflow:hidden;
 193     text-align: center;
 194     display:none;
 195 }
 196
 197 #sws-control-panel {
 198 /*    visibility: hidden;*/
 199     font-size:6vh;
 200     width: 100vh;
 201     bottom: 0vh;
 202     display:inline-block;
 203     border-radius: 1vh;
 204     background-color: white;
 205     opacity: 0.9;
 206     color: black;
 207     z-index: 100;
 208     margin-left: auto;
 209     margin-right:auto;
 210     vertical-align:middle;
 211 }
 212
 213
 214 #sws-control-panel-canvas:after{
 215     content:"";
 216     display:inline-block;
 217     width: 0vh;
 218     height: 100%;
 219     background:pink;
 220     vertical-align:bottom;
 221 }
 222
 223 #sws-control-panel-title-bar {
 224     width: 100%;
 225     font-size: 3vh;
 226     text-align:right;
 227 }
 228
 229 #sws-control-panel select
 230  {
 231      display: inline-block;
 232      vertical-align: middle;
 233      font-size: 3vh;
 234  }
 235
 236 #sws-control-panel-navigation {
 237     text-align: center;
 238 }
 239
 240 #sws-control-panel a {
 241     color: black;
 242     text-decoration: none;
 243     display: inline-block;
 244     padding: 0pt 1em 0pt 1em;
 245     vertical-align: middle;
 246 }
 247
 248 #sws-control-panel-title-bar a {
 249     padding:0vh 2vh 0vh 0vh;
 250     margin: 0 0 0 0;
 251 }
 252
 253 #sws-control-panel a:hover {
 254     cursor: pointer;
 255 }
 256 #sws-control-panel-slide-input
 257 {
 258     font-size: 3vh;
 259     width: 3em;
 260     vertical-align:middle;
 261 }
 262 #sws-control-panel-total-slides {
 263     font-size: 3vh;
 264     vertical-align:middle;
 265 }
 266
 267 #sws-control-panel-navigation-bar {
 268     width: 50vh;
 269 }
 270 #sws-print-container {
 271     top: 0;
 272     left: 0;
 273     width: 29.7cm;
 274     overflow: auto;
 275     border: 1px;
 276     padding: 1px 1px 1px 1px;
 277 }