/documentation/docs/docco.css
CSS | 518 lines | 427 code | 72 blank | 19 comment | 0 complexity | 2d103df4767eb094a0f4e5ff8b17c8fb MD5 | raw file
1/*--------------------- Typography ----------------------------*/ 2 3@font-face { 4 font-family: 'aller-light'; 5 src: url('public/fonts/aller-light.eot'); 6 src: url('public/fonts/aller-light.eot?#iefix') format('embedded-opentype'), 7 url('public/fonts/aller-light.woff') format('woff'), 8 url('public/fonts/aller-light.ttf') format('truetype'); 9 font-weight: normal; 10 font-style: normal; 11} 12 13@font-face { 14 font-family: 'aller-bold'; 15 src: url('public/fonts/aller-bold.eot'); 16 src: url('public/fonts/aller-bold.eot?#iefix') format('embedded-opentype'), 17 url('public/fonts/aller-bold.woff') format('woff'), 18 url('public/fonts/aller-bold.ttf') format('truetype'); 19 font-weight: normal; 20 font-style: normal; 21} 22 23@font-face { 24 font-family: 'roboto-black'; 25 src: url('public/fonts/roboto-black.eot'); 26 src: url('public/fonts/roboto-black.eot?#iefix') format('embedded-opentype'), 27 url('public/fonts/roboto-black.woff') format('woff'), 28 url('public/fonts/roboto-black.ttf') format('truetype'); 29 font-weight: normal; 30 font-style: normal; 31} 32 33/*--------------------- Layout ----------------------------*/ 34html { height: 100%; } 35body { 36 font-family: "aller-light"; 37 font-size: 14px; 38 line-height: 18px; 39 color: #30404f; 40 margin: 0; padding: 0; 41 height:100%; 42} 43#container { min-height: 100%; } 44 45a { 46 color: #000; 47} 48 49b, strong { 50 font-weight: normal; 51 font-family: "aller-bold"; 52} 53 54p { 55 margin: 15px 0 0px; 56} 57 .annotation ul, .annotation ol { 58 margin: 25px 0; 59 } 60 .annotation ul li, .annotation ol li { 61 font-size: 14px; 62 line-height: 18px; 63 margin: 10px 0; 64 } 65 66h1, h2, h3, h4, h5, h6 { 67 color: #112233; 68 line-height: 1em; 69 font-weight: normal; 70 font-family: "roboto-black"; 71 text-transform: uppercase; 72 margin: 30px 0 15px 0; 73} 74 75h1 { 76 margin-top: 40px; 77} 78h2 { 79 font-size: 1.26em; 80} 81 82hr { 83 border: 0; 84 background: 1px #ddd; 85 height: 1px; 86 margin: 20px 0; 87} 88 89pre, tt, code { 90 font-size: 12px; line-height: 16px; 91 font-family: Menlo, Monaco, Consolas, "Lucida Console", monospace; 92 margin: 0; padding: 0; 93} 94 .annotation pre { 95 display: block; 96 margin: 0; 97 padding: 7px 10px; 98 background: #fcfcfc; 99 -moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.1); 100 -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.1); 101 box-shadow: inset 0 0 10px rgba(0,0,0,0.1); 102 overflow-x: auto; 103 } 104 .annotation pre code { 105 border: 0; 106 padding: 0; 107 background: transparent; 108 } 109 110 111blockquote { 112 border-left: 5px solid #ccc; 113 margin: 0; 114 padding: 1px 0 1px 1em; 115} 116 .sections blockquote p { 117 font-family: Menlo, Consolas, Monaco, monospace; 118 font-size: 12px; line-height: 16px; 119 color: #999; 120 margin: 10px 0 0; 121 white-space: pre-wrap; 122 } 123 124ul.sections { 125 list-style: none; 126 padding:0 0 5px 0;; 127 margin:0; 128} 129 130/* 131 Force border-box so that % widths fit the parent 132 container without overlap because of margin/padding. 133 134 More Info : http://www.quirksmode.org/css/box.html 135*/ 136ul.sections > li > div { 137 -moz-box-sizing: border-box; /* firefox */ 138 -ms-box-sizing: border-box; /* ie */ 139 -webkit-box-sizing: border-box; /* webkit */ 140 -khtml-box-sizing: border-box; /* konqueror */ 141 box-sizing: border-box; /* css3 */ 142} 143 144 145/*---------------------- Jump Page -----------------------------*/ 146#jump_to, #jump_page { 147 margin: 0; 148 background: white; 149 -webkit-box-shadow: 0 0 25px #777; -moz-box-shadow: 0 0 25px #777; 150 -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomleft: 5px; 151 font: 16px Arial; 152 cursor: pointer; 153 text-align: right; 154 list-style: none; 155} 156 157#jump_to a { 158 text-decoration: none; 159} 160 161#jump_to a.large { 162 display: none; 163} 164#jump_to a.small { 165 font-size: 22px; 166 font-weight: bold; 167 color: #676767; 168} 169 170#jump_to, #jump_wrapper { 171 position: fixed; 172 right: 0; top: 0; 173 padding: 10px 15px; 174 margin:0; 175} 176 177#jump_wrapper { 178 display: none; 179 padding:0; 180} 181 182#jump_to:hover #jump_wrapper { 183 display: block; 184} 185 186#jump_page_wrapper{ 187 position: fixed; 188 right: 0; 189 top: 0; 190 bottom: 0; 191} 192 193#jump_page { 194 padding: 5px 0 3px; 195 margin: 0 0 25px 25px; 196 max-height: 100%; 197 overflow: auto; 198} 199 200#jump_page .source { 201 display: block; 202 padding: 15px; 203 text-decoration: none; 204 border-top: 1px solid #eee; 205} 206 207#jump_page .source:hover { 208 background: #f5f5ff; 209} 210 211#jump_page .source:first-child { 212} 213 214/*---------------------- Low resolutions (> 320px) ---------------------*/ 215@media only screen and (min-width: 320px) { 216 .pilwrap { display: none; } 217 218 ul.sections > li > div { 219 display: block; 220 padding:5px 10px 0 10px; 221 } 222 223 ul.sections > li > div.annotation ul, ul.sections > li > div.annotation ol { 224 padding-left: 30px; 225 } 226 227 ul.sections > li > div.content { 228 overflow-x:auto; 229 -webkit-box-shadow: inset 0 0 5px #e5e5ee; 230 box-shadow: inset 0 0 5px #e5e5ee; 231 border: 1px solid #dedede; 232 margin:5px 10px 5px 10px; 233 padding-bottom: 5px; 234 } 235 236 ul.sections > li > div.annotation pre { 237 margin: 7px 0 7px; 238 padding-left: 15px; 239 } 240 241 ul.sections > li > div.annotation p tt, .annotation code { 242 background: #f8f8ff; 243 border: 1px solid #dedede; 244 font-size: 12px; 245 padding: 0 0.2em; 246 } 247} 248 249/*---------------------- (> 481px) ---------------------*/ 250@media only screen and (min-width: 481px) { 251 #container { 252 position: relative; 253 } 254 body { 255 background-color: #F5F5FF; 256 font-size: 15px; 257 line-height: 21px; 258 } 259 pre, tt, code { 260 line-height: 18px; 261 } 262 p, ul, ol { 263 margin: 0 0 15px; 264 } 265 266 267 #jump_to { 268 padding: 5px 10px; 269 } 270 #jump_wrapper { 271 padding: 0; 272 } 273 #jump_to, #jump_page { 274 font: 10px Arial; 275 text-transform: uppercase; 276 } 277 #jump_page .source { 278 padding: 5px 10px; 279 } 280 #jump_to a.large { 281 display: inline-block; 282 } 283 #jump_to a.small { 284 display: none; 285 } 286 287 288 289 #background { 290 position: absolute; 291 top: 0; bottom: 0; 292 width: 350px; 293 background: #fff; 294 border-right: 1px solid #e5e5ee; 295 z-index: -1; 296 } 297 298 ul.sections > li > div.annotation ul, ul.sections > li > div.annotation ol { 299 padding-left: 40px; 300 } 301 302 ul.sections > li { 303 white-space: nowrap; 304 } 305 306 ul.sections > li > div { 307 display: inline-block; 308 } 309 310 ul.sections > li > div.annotation { 311 max-width: 350px; 312 min-width: 350px; 313 min-height: 5px; 314 padding: 13px; 315 overflow-x: hidden; 316 white-space: normal; 317 vertical-align: top; 318 text-align: left; 319 } 320 ul.sections > li > div.annotation pre { 321 margin: 15px 0 15px; 322 padding-left: 15px; 323 } 324 325 ul.sections > li > div.content { 326 padding: 13px; 327 vertical-align: top; 328 border: none; 329 -webkit-box-shadow: none; 330 box-shadow: none; 331 } 332 333 .pilwrap { 334 position: relative; 335 display: inline; 336 } 337 338 .pilcrow { 339 font: 12px Arial; 340 text-decoration: none; 341 color: #454545; 342 position: absolute; 343 top: 3px; left: -20px; 344 padding: 1px 2px; 345 opacity: 0; 346 -webkit-transition: opacity 0.2s linear; 347 } 348 .for-h1 .pilcrow { 349 top: 47px; 350 } 351 .for-h2 .pilcrow, .for-h3 .pilcrow, .for-h4 .pilcrow { 352 top: 35px; 353 } 354 355 ul.sections > li > div.annotation:hover .pilcrow { 356 opacity: 1; 357 } 358} 359 360/*---------------------- (> 1025px) ---------------------*/ 361@media only screen and (min-width: 1025px) { 362 363 body { 364 font-size: 16px; 365 line-height: 24px; 366 } 367 368 #background { 369 width: 525px; 370 } 371 ul.sections > li > div.annotation { 372 max-width: 525px; 373 min-width: 525px; 374 padding: 10px 25px 1px 50px; 375 } 376 ul.sections > li > div.content { 377 padding: 9px 15px 16px 25px; 378 } 379} 380 381/*---------------------- Syntax Highlighting -----------------------------*/ 382 383td.linenos { background-color: #f0f0f0; padding-right: 10px; } 384span.lineno { background-color: #f0f0f0; padding: 0 5px 0 5px; } 385/* 386 387github.com style (c) Vasily Polovnyov <vast@whiteants.net> 388 389*/ 390 391pre code { 392 display: block; padding: 0.5em; 393 color: #000; 394 background: #f8f8ff 395} 396 397pre .hljs-comment, 398pre .hljs-template_comment, 399pre .hljs-diff .hljs-header, 400pre .hljs-javadoc { 401 color: #408080; 402 font-style: italic 403} 404 405pre .hljs-keyword, 406pre .hljs-assignment, 407pre .hljs-literal, 408pre .hljs-css .hljs-rule .hljs-keyword, 409pre .hljs-winutils, 410pre .hljs-javascript .hljs-title, 411pre .hljs-lisp .hljs-title, 412pre .hljs-subst { 413 color: #954121; 414 /*font-weight: bold*/ 415} 416 417pre .hljs-number, 418pre .hljs-hexcolor { 419 color: #40a070 420} 421 422pre .hljs-string, 423pre .hljs-tag .hljs-value, 424pre .hljs-phpdoc, 425pre .hljs-tex .hljs-formula { 426 color: #219161; 427} 428 429pre .hljs-title, 430pre .hljs-id { 431 color: #19469D; 432} 433pre .hljs-params { 434 color: #00F; 435} 436 437pre .hljs-javascript .hljs-title, 438pre .hljs-lisp .hljs-title, 439pre .hljs-subst { 440 font-weight: normal 441} 442 443pre .hljs-class .hljs-title, 444pre .hljs-haskell .hljs-label, 445pre .hljs-tex .hljs-command { 446 color: #458; 447 font-weight: bold 448} 449 450pre .hljs-tag, 451pre .hljs-tag .hljs-title, 452pre .hljs-rules .hljs-property, 453pre .hljs-django .hljs-tag .hljs-keyword { 454 color: #000080; 455 font-weight: normal 456} 457 458pre .hljs-attribute, 459pre .hljs-variable, 460pre .hljs-instancevar, 461pre .hljs-lisp .hljs-body { 462 color: #008080 463} 464 465pre .hljs-regexp { 466 color: #B68 467} 468 469pre .hljs-class { 470 color: #458; 471 font-weight: bold 472} 473 474pre .hljs-symbol, 475pre .hljs-ruby .hljs-symbol .hljs-string, 476pre .hljs-ruby .hljs-symbol .hljs-keyword, 477pre .hljs-ruby .hljs-symbol .hljs-keymethods, 478pre .hljs-lisp .hljs-keyword, 479pre .hljs-tex .hljs-special, 480pre .hljs-input_number { 481 color: #990073 482} 483 484pre .hljs-builtin, 485pre .hljs-constructor, 486pre .hljs-built_in, 487pre .hljs-lisp .hljs-title { 488 color: #0086b3 489} 490 491pre .hljs-preprocessor, 492pre .hljs-pi, 493pre .hljs-doctype, 494pre .hljs-shebang, 495pre .hljs-cdata { 496 color: #999; 497 font-weight: bold 498} 499 500pre .hljs-deletion { 501 background: #fdd 502} 503 504pre .hljs-addition { 505 background: #dfd 506} 507 508pre .hljs-diff .hljs-change { 509 background: #0086b3 510} 511 512pre .hljs-chunk { 513 color: #aaa 514} 515 516pre .hljs-tex .hljs-formula { 517 opacity: 0.5; 518}