github.com/sentienttechnologies/studio-go-runner@v0.0.0-20201118202441-6d21f2ced8ee/docs/slides/css/theme/template/theme.scss (about) 1 // Base theme template for reveal.js 2 3 /********************************************* 4 * GLOBAL STYLES 5 *********************************************/ 6 7 body { 8 @include bodyBackground(); 9 background-color: $backgroundColor; 10 } 11 12 .reveal { 13 font-family: $mainFont; 14 font-size: $mainFontSize; 15 font-weight: normal; 16 color: $mainColor; 17 } 18 19 ::selection { 20 color: $selectionColor; 21 background: $selectionBackgroundColor; 22 text-shadow: none; 23 } 24 25 ::-moz-selection { 26 color: $selectionColor; 27 background: $selectionBackgroundColor; 28 text-shadow: none; 29 } 30 31 .reveal .slides>section, 32 .reveal .slides>section>section { 33 line-height: 1.3; 34 font-weight: inherit; 35 } 36 37 /********************************************* 38 * HEADERS 39 *********************************************/ 40 41 .reveal h1, 42 .reveal h2, 43 .reveal h3, 44 .reveal h4, 45 .reveal h5, 46 .reveal h6 { 47 margin: $headingMargin; 48 color: $headingColor; 49 50 font-family: $headingFont; 51 font-weight: $headingFontWeight; 52 line-height: $headingLineHeight; 53 letter-spacing: $headingLetterSpacing; 54 55 text-transform: $headingTextTransform; 56 text-shadow: $headingTextShadow; 57 58 word-wrap: break-word; 59 } 60 61 .reveal h1 {font-size: $heading1Size; } 62 .reveal h2 {font-size: $heading2Size; } 63 .reveal h3 {font-size: $heading3Size; } 64 .reveal h4 {font-size: $heading4Size; } 65 66 .reveal h1 { 67 text-shadow: $heading1TextShadow; 68 } 69 70 71 /********************************************* 72 * OTHER 73 *********************************************/ 74 75 .reveal p { 76 margin: $blockMargin 0; 77 line-height: 1.3; 78 } 79 80 /* Ensure certain elements are never larger than the slide itself */ 81 .reveal img, 82 .reveal video, 83 .reveal iframe { 84 max-width: 95%; 85 max-height: 95%; 86 } 87 .reveal strong, 88 .reveal b { 89 font-weight: bold; 90 } 91 92 .reveal em { 93 font-style: italic; 94 } 95 96 .reveal ol, 97 .reveal dl, 98 .reveal ul { 99 display: inline-block; 100 101 text-align: left; 102 margin: 0 0 0 1em; 103 } 104 105 .reveal ol { 106 list-style-type: decimal; 107 } 108 109 .reveal ul { 110 list-style-type: disc; 111 } 112 113 .reveal ul ul { 114 list-style-type: square; 115 } 116 117 .reveal ul ul ul { 118 list-style-type: circle; 119 } 120 121 .reveal ul ul, 122 .reveal ul ol, 123 .reveal ol ol, 124 .reveal ol ul { 125 display: block; 126 margin-left: 40px; 127 } 128 129 .reveal dt { 130 font-weight: bold; 131 } 132 133 .reveal dd { 134 margin-left: 40px; 135 } 136 137 .reveal blockquote { 138 display: block; 139 position: relative; 140 width: 70%; 141 margin: $blockMargin auto; 142 padding: 5px; 143 144 font-style: italic; 145 background: rgba(255, 255, 255, 0.05); 146 box-shadow: 0px 0px 2px rgba(0,0,0,0.2); 147 } 148 .reveal blockquote p:first-child, 149 .reveal blockquote p:last-child { 150 display: inline-block; 151 } 152 153 .reveal q { 154 font-style: italic; 155 } 156 157 .reveal pre { 158 display: block; 159 position: relative; 160 width: 90%; 161 margin: $blockMargin auto; 162 163 text-align: left; 164 font-size: 0.55em; 165 font-family: monospace; 166 line-height: 1.2em; 167 168 word-wrap: break-word; 169 170 box-shadow: 0px 0px 6px rgba(0,0,0,0.3); 171 } 172 173 .reveal code { 174 font-family: monospace; 175 text-transform: none; 176 } 177 178 .reveal pre code { 179 display: block; 180 padding: 5px; 181 overflow: auto; 182 max-height: 400px; 183 word-wrap: normal; 184 } 185 186 .reveal table { 187 margin: auto; 188 border-collapse: collapse; 189 border-spacing: 0; 190 } 191 192 .reveal table th { 193 font-weight: bold; 194 } 195 196 .reveal table th, 197 .reveal table td { 198 text-align: left; 199 padding: 0.2em 0.5em 0.2em 0.5em; 200 border-bottom: 1px solid; 201 } 202 203 .reveal table th[align="center"], 204 .reveal table td[align="center"] { 205 text-align: center; 206 } 207 208 .reveal table th[align="right"], 209 .reveal table td[align="right"] { 210 text-align: right; 211 } 212 213 .reveal table tbody tr:last-child th, 214 .reveal table tbody tr:last-child td { 215 border-bottom: none; 216 } 217 218 .reveal sup { 219 vertical-align: super; 220 } 221 .reveal sub { 222 vertical-align: sub; 223 } 224 225 .reveal small { 226 display: inline-block; 227 font-size: 0.6em; 228 line-height: 1.2em; 229 vertical-align: top; 230 } 231 232 .reveal small * { 233 vertical-align: top; 234 } 235 236 237 /********************************************* 238 * LINKS 239 *********************************************/ 240 241 .reveal a { 242 color: $linkColor; 243 text-decoration: none; 244 245 -webkit-transition: color .15s ease; 246 -moz-transition: color .15s ease; 247 transition: color .15s ease; 248 } 249 .reveal a:hover { 250 color: $linkColorHover; 251 252 text-shadow: none; 253 border: none; 254 } 255 256 .reveal .roll span:after { 257 color: #fff; 258 background: darken( $linkColor, 15% ); 259 } 260 261 262 /********************************************* 263 * IMAGES 264 *********************************************/ 265 266 .reveal section img { 267 margin: 15px 0px; 268 background: rgba(255,255,255,0.12); 269 border: 4px solid $mainColor; 270 271 box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); 272 } 273 274 .reveal section img.plain { 275 border: 0; 276 box-shadow: none; 277 } 278 279 .reveal a img { 280 -webkit-transition: all .15s linear; 281 -moz-transition: all .15s linear; 282 transition: all .15s linear; 283 } 284 285 .reveal a:hover img { 286 background: rgba(255,255,255,0.2); 287 border-color: $linkColor; 288 289 box-shadow: 0 0 20px rgba(0, 0, 0, 0.55); 290 } 291 292 293 /********************************************* 294 * NAVIGATION CONTROLS 295 *********************************************/ 296 297 .reveal .controls { 298 color: $linkColor; 299 } 300 301 302 /********************************************* 303 * PROGRESS BAR 304 *********************************************/ 305 306 .reveal .progress { 307 background: rgba(0,0,0,0.2); 308 color: $linkColor; 309 } 310 .reveal .progress span { 311 -webkit-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); 312 -moz-transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); 313 transition: width 800ms cubic-bezier(0.260, 0.860, 0.440, 0.985); 314 } 315 316