github.com/rohankumardubey/syslog-redirector-golang@v0.0.0-20140320174030-4859f03d829a/misc/tour/static/tour.css (about) 1 html { 2 height: 100%; 3 } 4 5 body { 6 font-family: Helvetica, Arial, sans-serif; 7 font-size: 16px; 8 line-height: 1.6em; 9 margin: 0; 10 padding: 0; 11 background: #E0EBF5; 12 height: 100%; 13 color: #222; 14 } 15 16 #wrap { 17 min-height: 100%; 18 margin: 0 0 0 auto; 19 width: 550px; 20 background: #FFF url(gopher.png) no-repeat 1.2em bottom; 21 position: relative; 22 } 23 24 #toc, .slide { 25 padding: 0 1.2em 130px 1.2em; 26 } 27 28 #header { 29 padding: 0 1.2em; 30 } 31 32 #slidenum { 33 float: right; 34 font-size: 2.5em; 35 font-weight: bold; 36 color: #999; 37 padding-top: .4em; 38 } 39 40 h1 { 41 margin: 0; 42 padding: 1.2em 0 .2em; 43 font-size: 1.2em; 44 } 45 46 #tocbtn { 47 background: url(tocbtn.png) no-repeat left; 48 width: 42px; 49 height: 50px; 50 display: block; 51 position: absolute; 52 top: 0; 53 right: 80px; 54 z-index: 10; 55 } 56 57 #tocbtn:hover { 58 background-position: right; 59 } 60 61 h2 { 62 font-size: 1.8em; 63 margin: 0 0 .6em 0; 64 color: #375EAB; 65 line-height: 1.2em; 66 } 67 68 a { 69 color: #375EAB; 70 text-decoration: none; 71 } 72 73 a:hover { 74 text-decoration: underline; 75 } 76 77 p { 78 margin: .6em 0; 79 } 80 81 ol li { 82 list-style: decimal outside none; 83 } 84 85 #slide3 img { 86 max-width: 90%; 87 margin: .5em auto; 88 display: block; 89 } 90 91 #workspace { 92 position: fixed; 93 top: 0; 94 bottom: 0; 95 left: 0; 96 right: 550px; 97 background: #E0EBF5; 98 min-height: 200px; 99 } 100 101 #workspace-top { 102 position: absolute; 103 top: 0; 104 bottom: 30%; 105 right: 0; 106 left: 0; 107 } 108 109 #workspace-bottom { 110 position: absolute; 111 top: 70%; 112 bottom: 0; 113 right: 0; 114 left: 0; 115 } 116 117 #workspace-editor { 118 position: absolute; 119 top: .6em; 120 bottom: .3em; 121 right: .6em; 122 left: .6em; 123 border: 1px solid #375EAB; 124 background: #FFFFD8; 125 -webkit-border-top-left-radius: 5px; 126 -webkit-border-top-right-radius: 5px; 127 -moz-border-radius-topleft: 5px; 128 -moz-border-radius-topright: 5px; 129 border-top-left-radius: 5px; 130 border-top-right-radius: 5px; 131 } 132 133 #editor { 134 position: absolute; 135 top: 5px; 136 bottom: 5px; 137 left: 5px; 138 right: 5px; 139 border: none; 140 outline: none; 141 resize: none; 142 background: #FFFFD8; 143 font-size: 16px; 144 } 145 146 #output { 147 position: absolute; 148 top: .3em; 149 bottom: .6em; 150 right: .6em; 151 left: .6em; 152 border: 1px solid #375EAB; 153 background: #FFFFFF; 154 -webkit-border-bottom-left-radius: 5px; 155 -webkit-border-bottom-right-radius: 5px; 156 -moz-border-radius-bottomleft: 5px; 157 -moz-border-radius-tottomright: 5px; 158 border-bottom-left-radius: 5px; 159 border-bottom-right-radius: 5px; 160 overflow: auto; 161 } 162 #output pre { 163 margin: 5px; 164 padding: 0; 165 background: none; 166 font-size: 16px; 167 } 168 #output .loading { 169 color: #999; 170 } 171 #output .stdout, #output pre { 172 color: black; 173 } 174 #output .stderr, #output .error { 175 color: #a11; 176 } 177 #output .system, #output .exit { 178 color: #375EAB; 179 } 180 181 #output img { 182 margin: 0; 183 padding: 0; 184 border: none; 185 display: block; 186 } 187 188 pre, code { 189 font-family: Menlo, monospace; 190 font-size: 14px; 191 } 192 193 div.source { 194 display: none; 195 } 196 197 .CodeMirror { 198 position: absolute; 199 top: 0; 200 bottom: 0; 201 left: 0; 202 right: 0; 203 background: none; 204 font-family: Menlo, monospace; 205 } 206 207 .CodeMirror-scroll { 208 height: 100%; 209 } 210 211 .CodeMirror-gutter { 212 background: inherit; 213 border-right: 1px solid #999; 214 } 215 216 .CodeMirror-gutter-text { 217 color: #999; 218 } 219 220 .CodeMirror-matchingbracket { 221 color: #000 !important; 222 text-decoration: underline; 223 } 224 225 .CodeMirror-focused div.CodeMirror-selected { 226 background: #d0d0d0; 227 } 228 229 .CodeMirror .errLine { 230 background: #FDD !important; 231 } 232 .CodeMirror .highlightLine { 233 background: #E0EBF5 !important; 234 } 235 236 #slides pre { 237 background: #E9E9E9; 238 padding: 10px; 239 -webkit-border-radius: 5px; 240 -moz-border-radius: 5px; 241 border-radius: 5px; 242 overflow: auto; 243 } 244 245 .controls { 246 position: absolute; 247 z-index: 10; 248 top: 1.2em; 249 right: 2em; 250 text-align: right; 251 } 252 253 .controls.expanded #more { 254 background: #FFF; 255 } 256 257 .controls.expanded ul.more { 258 display: block; 259 } 260 261 #run, #more { 262 margin-left: .8em; 263 padding: 2px 12px; 264 margin: 0 0 0 .8em; 265 text-transform: uppercase; 266 letter-spacing: .2em; 267 color: #222; 268 font-size: .9em; 269 font-weight: bold; 270 text-decoration: none; 271 272 background: #E0EBF5; 273 274 border: 2px solid #375EAB; 275 color: #375EAB; 276 } 277 278 #run { 279 -webkit-border-top-left-radius: 5px; 280 -webkit-border-bottom-left-radius: 5px; 281 -moz-border-radius-topleft: 5px; 282 -moz-border-radius-bottomleft: 5px; 283 border-top-left-radius: 5px; 284 border-bottom-left-radius: 5px; 285 border-right: none; 286 } 287 288 #more { 289 margin-left: 0; 290 padding: 2px 5px; 291 border: 2px solid #375EAB; 292 border-left-width: 1px; 293 -webkit-border-top-right-radius: 5px; 294 -webkit-border-bottom-right-radius: 5px; 295 -moz-border-radius-topright: 5px; 296 -moz-border-radius-bottomright: 5px; 297 border-top-right-radius: 5px; 298 border-bottom-right-radius: 5px; 299 } 300 301 ul.more { 302 display: none; 303 position: relative; 304 list-style: none; 305 margin: 0; 306 top: 2px; 307 padding: 5px 0; 308 float: right; 309 background: #FFF; 310 border: 1px solid #CCC; 311 border-radius: 5px; 312 -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 313 -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 314 box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2); 315 } 316 317 ul.more li { 318 text-align: left; 319 padding: 0; 320 } 321 322 ul.more li a { 323 padding: 0 1em 0 .5em; 324 text-decoration: none; 325 display: block; 326 color: #222; 327 } 328 329 ul.more li a:hover { 330 background: #E0EBF5; 331 } 332 333 ul.more li hr { 334 border: none; 335 border-top: 1px solid #CCC; 336 margin: .2em .5em; 337 } 338 339 .controls a { 340 border-right: none; 341 -webkit-border-top-right-radius: 0; 342 -webkit-border-bottom-right-radius: 0; 343 -moz-border-radius-topright: 0; 344 -moz-border-radius-bottomright: 0; 345 border-top-right-radius: 0; 346 border-bottom-right-radius: 0; 347 } 348 349 #more:hover, #run:hover { 350 background: #fff; 351 } 352 353 div.toc { 354 display: none; 355 } 356 357 div.nav { 358 position: absolute; 359 bottom: 1.8em; 360 right: 1.2em; 361 } 362 363 div.nav a, div.nav span { 364 margin-left: .5em; 365 font-size: 2.5em; 366 } 367 368 div.nav span { 369 color: #CCC; 370 } 371 372 div.nav a { 373 color: #000; 374 text-decoration: none; 375 } 376 377 div.nav a:hover { 378 color: #375EAB; 379 } 380 381 .full-width { 382 width: 100% !important; 383 } 384 385 @media screen and (max-width : 1100px) { 386 #wrap { 387 width: 400px; 388 } 389 #workspace { 390 right: 400px; 391 } 392 } 393 394 @media screen and (max-width : 800px) { 395 body { 396 background: #FFF; 397 } 398 #wrap { 399 width: 100%; 400 padding-bottom: 130px; 401 min-height: 0; 402 } 403 #workspace, #workspace-top, #workspace-bottom, #workspace-editor, #output { 404 position: static; 405 top: auto; 406 left: auto; 407 right: auto; 408 bottom: auto; 409 } 410 #toc, .slide { 411 padding-bottom: 0; 412 } 413 .CodeMirror { 414 position: relative; 415 } 416 #workspace { 417 padding: .8em 1.2em; 418 margin: 1.2em 0; 419 } 420 #workspace-top { 421 margin-bottom: .6em; 422 } 423 .CodeMirror { 424 height: 18em; 425 } 426 #output { 427 height: 6em; 428 } 429 .controls { 430 position: absolute; 431 top: auto; 432 left: auto; 433 bottom: auto; 434 right: 2.6em; 435 margin-top: .6em; 436 } 437 }