simpleWebSlides.css

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