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 /* counters for the toc */
 168
 169 .sws-toc ul {
 170     counter-reset: list-item;
 171 }
 172
 173 .sws-toc li {
 174     counter-increment: list-item;
 175
 176 }
 177 .sws-toc li::marker {
 178     content : counters(list-item, '.');
 179 }
 180
 181
 182 /*             Control Panel             */
 183 /*****************************************/
 184
 185
 186
 187 @font-face {
 188   font-family: 'entypo';
 189   font-style: normal;
 190   font-weight: normal;
 191   src: url('entypo.woff') format('woff');
 192 }
 193 /* entypo */
 194 .sws-symbol {
 195     font-family: 'entypo';
 196 }
 197
 198 #sws-control-panel-canvas {
 199     position: fixed;
 200     z-index: 100;
 201     left: 0pt;
 202     bottom: 0pt;
 203     width: 100%;
 204     height: 100%;
 205     overflow:hidden;
 206     text-align: center;
 207     display:none;
 208 }
 209
 210 #sws-control-panel {
 211 /*    visibility: hidden;*/
 212     font-size:6vh;
 213     width: 100vh;
 214     bottom: 0vh;
 215     display:inline-block;
 216     border-radius: 1vh;
 217     background-color: white;
 218     opacity: 0.9;
 219     color: black;
 220     z-index: 100;
 221     margin-left: auto;
 222     margin-right:auto;
 223     vertical-align:middle;
 224 }
 225
 226
 227 #sws-control-panel-canvas:after{
 228     content:"";
 229     display:inline-block;
 230     width: 0vh;
 231     height: 100%;
 232     background:pink;
 233     vertical-align:bottom;
 234 }
 235
 236 #sws-control-panel-title-bar {
 237     width: 100%;
 238     font-size: 3vh;
 239     text-align:right;
 240 }
 241
 242 #sws-control-panel select
 243  {
 244      display: inline-block;
 245      vertical-align: middle;
 246      font-size: 3vh;
 247  }
 248
 249 #sws-control-panel-navigation {
 250     text-align: center;
 251 }
 252
 253 #sws-control-panel a {
 254     color: black;
 255     text-decoration: none;
 256     display: inline-block;
 257     padding: 0pt 1em 0pt 1em;
 258     vertical-align: middle;
 259 }
 260
 261 #sws-control-panel-title-bar a {
 262     padding:0vh 2vh 0vh 0vh;
 263     margin: 0 0 0 0;
 264 }
 265
 266 #sws-control-panel a:hover {
 267     cursor: pointer;
 268 }
 269 #sws-control-panel-slide-input
 270 {
 271     font-size: 3vh;
 272     width: 3em;
 273     vertical-align:middle;
 274 }
 275 #sws-control-panel-total-slides {
 276     font-size: 3vh;
 277     vertical-align:middle;
 278 }
 279
 280 #sws-control-panel-navigation-bar {
 281     width: 50vh;
 282 }
 283 #sws-print-container {
 284     top: 0;
 285     left: 0;
 286     width: 29.7cm;
 287     overflow: auto;
 288     border: 1px;
 289     padding: 1px 1px 1px 1px;
 290 }