src/librustdoc/html/static/css/themes/ayu.css

   1 /*
   2 Based off of the Ayu theme
   3 Original by Dempfi (https://github.com/dempfi/ayu)
   4 */
   5
   6 /* General structure and fonts */
   7
   8 body, #settings-menu #settings, #settings-menu #settings::before {
   9         background-color: #0f1419;
  10         color: #c5c5c5;
  11 }
  12
  13 .setting-line .radio-line input {
  14         border-color: #c5c5c5;
  15 }
  16 .setting-line .radio-line input:checked {
  17         box-shadow: inset 0 0 0 3px #0f1419;
  18         background-color: #ffb454;
  19 }
  20 .setting-line .radio-line input:focus {
  21         box-shadow: 0 0 1px 1px #ffb454;
  22 }
  23 /* In here we combine both `:focus` and `:checked` properties. */
  24 .setting-line .radio-line input:checked:focus {
  25         box-shadow: inset 0 0 0 3px 0f1419,
  26                 0 0 2px 2px #ffb454;
  27 }
  28 .setting-line .radio-line input:hover {
  29         border-color: #ffb454 !important;
  30 }
  31
  32 .slider {
  33         background-color: #ccc;
  34 }
  35 .slider:before {
  36         background-color: white;
  37 }
  38 input:checked + .slider {
  39         background-color: #ffb454;
  40 }
  41 input:focus + .slider {
  42         box-shadow: 0 0 0 2px #0a84ff, 0 0 0 6px rgba(10, 132, 255, 0.3);
  43 }
  44
  45 h1, h2, h3, h4 {
  46         color: white;
  47 }
  48 h1.fqn {
  49         border-bottom-color: #5c6773;
  50 }
  51 h1.fqn  a {
  52         color: #fff;
  53 }
  54 h2, h3, h4 {
  55         border-bottom-color: #5c6773;
  56 }
  57 h4 {
  58         border: none;
  59 }
  60
  61 .in-band {
  62         background-color: #0f1419;
  63 }
  64
  65 .invisible {
  66         background: rgba(0, 0, 0, 0);
  67 }
  68
  69 .docblock code {
  70         color: #ffb454;
  71 }
  72 .code-header {
  73         color: #e6e1cf;
  74 }
  75 .docblock pre > code, pre > code {
  76         color: #e6e1cf;
  77 }
  78 span code {
  79         color: #e6e1cf;
  80 }
  81 .docblock a > code {
  82         color: #39AFD7 !important;
  83 }
  84 .docblock code, .docblock-short code {
  85         background-color: #191f26;
  86 }
  87 pre, .rustdoc.source .example-wrap {
  88         color: #e6e1cf;
  89         background-color: #191f26;
  90 }
  91
  92 .sidebar, .mobile-topbar, .sidebar-menu-toggle {
  93         background-color: #14191f;
  94 }
  95
  96 .rust-logo {
  97         filter: drop-shadow(1px 0 0px #fff)
  98                 drop-shadow(0 1px 0 #fff)
  99                 drop-shadow(-1px 0 0 #fff)
 100                 drop-shadow(0 -1px 0 #fff);
 101 }
 102
 103 /* Improve the scrollbar display on firefox */
 104 * {
 105         scrollbar-color: #5c6773 #24292f;
 106 }
 107
 108 .sidebar {
 109         scrollbar-color: #5c6773 #24292f;
 110 }
 111
 112 /* Improve the scrollbar display on webkit-based browsers */
 113 ::-webkit-scrollbar-track {
 114         background-color: transparent;
 115 }
 116 ::-webkit-scrollbar-thumb {
 117         background-color: #5c6773;
 118 }
 119 .sidebar::-webkit-scrollbar-track {
 120         background-color: transparent;
 121 }
 122 .sidebar::-webkit-scrollbar-thumb {
 123         background-color: #5c6773;
 124 }
 125
 126 .sidebar .current,
 127 .sidebar a:hover {
 128         background-color: transparent;
 129         color: #ffb44c;
 130 }
 131
 132 .source .sidebar {
 133         background-color: #14191f;
 134 }
 135
 136 .sidebar-elems .location {
 137         color: #ff7733;
 138 }
 139
 140 .line-numbers span { color: #5c6773; }
 141 .line-numbers .line-highlighted {
 142         color: #708090;
 143         background-color: rgba(255, 236, 164, 0.06);
 144         padding-right: 4px;
 145         border-right: 1px solid #ffb44c;
 146 }
 147
 148 .docblock h1, .docblock h2, .docblock h3, .docblock h4, .docblock h5, .docblock h6 {
 149         border-bottom-color: #5c6773;
 150 }
 151
 152 .docblock table td, .docblock table th {
 153         border-color: #5c6773;
 154 }
 155
 156 .content .method .where,
 157 .content .fn .where,
 158 .content .where.fmt-newline {
 159         color: #c5c5c5;
 160 }
 161
 162 .search-results a:hover {
 163         background-color: #777;
 164 }
 165
 166 .search-results a:focus {
 167         color: #000 !important;
 168         background-color: #c6afb3;
 169 }
 170 .search-results a {
 171         color: #0096cf;
 172 }
 173 .search-results a div.desc {
 174         color: #c5c5c5;
 175 }
 176
 177 .content .item-info::before { color: #ccc; }
 178
 179 .content span.foreigntype, .content a.foreigntype { color: #ffa0a5; }
 180 .content span.union, .content a.union { color: #ffa0a5; }
 181 .content span.constant, .content a.constant,
 182 .content span.static, .content a.static { color: #39AFD7; }
 183 .content span.primitive, .content a.primitive { color: #ffa0a5; }
 184 .content span.traitalias, .content a.traitalias { color: #39AFD7; }
 185 .content span.keyword, .content a.keyword { color: #39AFD7; }
 186
 187 .content span.externcrate, .content span.mod, .content a.mod {
 188         color: #39AFD7;
 189 }
 190 .content span.struct, .content a.struct {
 191         color: #ffa0a5;
 192 }
 193 .content span.enum, .content a.enum {
 194         color: #ffa0a5;
 195 }
 196 .content span.trait, .content a.trait {
 197         color: #39AFD7;
 198 }
 199 .content span.type, .content a.type {
 200         color: #39AFD7;
 201 }
 202 .content span.type,
 203 .content a.type,
 204 .block a.current.type { color: #39AFD7; }
 205 .content span.associatedtype,
 206 .content a.associatedtype,
 207 .block a.current.associatedtype { color: #39AFD7; }
 208 .content span.fn, .content a.fn, .content span.method,
 209 .content a.method, .content span.tymethod,
 210 .content a.tymethod, .content .fnname {
 211         color: #fdd687;
 212 }
 213 .content span.attr, .content a.attr, .content span.derive,
 214 .content a.derive, .content span.macro, .content a.macro {
 215         color: #a37acc;
 216 }
 217
 218 .sidebar a { color: #53b1db; }
 219 .sidebar a.current.type { color: #53b1db; }
 220 .sidebar a.current.associatedtype { color: #53b1db; }
 221
 222 pre.rust .comment { color: #788797; }
 223 pre.rust .doccomment { color: #a1ac88; }
 224
 225 nav.main .current {
 226         border-top-color: #5c6773;
 227         border-bottom-color: #5c6773;
 228 }
 229 nav.main .separator {
 230         border: 1px solid #5c6773;
 231 }
 232 a {
 233         color: #39AFD7;
 234 }
 235
 236 a#toggle-all-docs,
 237 a.anchor,
 238 .small-section-header a,
 239 #source-sidebar a,
 240 pre.rust a,
 241 .sidebar h2 a,
 242 .sidebar h3 a,
 243 .mobile-topbar h2 a,
 244 .in-band a {
 245         color: #c5c5c5;
 246 }
 247 .sidebar h2 a,
 248 .sidebar h3 a {
 249         color: white;
 250 }
 251 .search-results a {
 252         color: #0096cf;
 253 }
 254 body.source .example-wrap pre.rust a {
 255         background: #333;
 256 }
 257
 258 details.rustdoc-toggle > summary.hideme > span,
 259 details.rustdoc-toggle > summary::before,
 260 details.undocumented > summary::before {
 261         color: #999;
 262 }
 263
 264 details.rustdoc-toggle > summary::before,
 265 details.undocumented > summary::before {
 266         filter: invert(100%);
 267 }
 268
 269 #crate-search, .search-input {
 270         background-color: #141920;
 271         /* Without the `!important`, the border-color is ignored for `<select>`... */
 272         border-color: #424c57 !important;
 273 }
 274
 275 .search-input {
 276         color: #ffffff;
 277 }
 278
 279 .module-item .stab,
 280 .import-item .stab {
 281         color: #000;
 282 }
 283
 284 /* Created this empty rule to satisfy the theme checks. */
 285 .stab.empty-impl {}
 286
 287 .stab.unstable,
 288 .stab.deprecated,
 289 .stab.portability,
 290 .stab.empty-impl {
 291         color: #c5c5c5;
 292         background: #314559 !important;
 293         border-style: none !important;
 294         border-radius: 4px;
 295         padding: 3px 6px 3px 6px;
 296 }
 297
 298 .stab.portability > code {
 299         color: #e6e1cf;
 300         background: none;
 301 }
 302
 303 #help > div {
 304         background: #14191f;
 305         box-shadow: 0px 6px 20px 0px black;
 306         border: none;
 307         border-radius: 4px;
 308 }
 309
 310 #help span.bottom, #help span.top {
 311         border-color: #5c6773;
 312 }
 313
 314 .rightside,
 315 .out-of-band {
 316         color: grey;
 317 }
 318
 319 .result-name .primitive > i, .result-name .keyword > i {
 320         color: #788797;
 321 }
 322
 323 .line-numbers :target { background-color: transparent; }
 324
 325 /* Code highlighting */
 326 pre.rust .number, pre.rust .string { color: #b8cc52; }
 327 pre.rust .kw, pre.rust .kw-2, pre.rust .prelude-ty,
 328 pre.rust .bool-val, pre.rust .prelude-val,
 329 pre.rust .op, pre.rust .lifetime { color: #ff7733; }
 330 pre.rust .macro, pre.rust .macro-nonterminal { color: #a37acc; }
 331 pre.rust .question-mark {
 332         color: #ff9011;
 333 }
 334 pre.rust .self {
 335         color: #36a3d9;
 336         font-style: italic;
 337 }
 338 pre.rust .attribute {
 339         color: #e6e1cf;
 340 }
 341 pre.rust .attribute .ident, pre.rust .attribute .op {
 342         color: #e6e1cf;
 343 }
 344
 345 .example-wrap > pre.line-number {
 346         color: #5c67736e;
 347         border: none;
 348 }
 349
 350 a.test-arrow {
 351         font-size: 100%;
 352         color: #788797;
 353         border-radius: 4px;
 354         background-color: rgba(57, 175, 215, 0.09);
 355 }
 356
 357 a.test-arrow:hover {
 358         background-color: rgba(57, 175, 215, 0.368);
 359         color: #c5c5c5;
 360 }
 361
 362 .toggle-label,
 363 .code-attribute {
 364         color: #999;
 365 }
 366
 367 :target {
 368         background: rgba(255, 236, 164, 0.06);
 369         border-right: 3px solid rgba(255, 180, 76, 0.85);
 370 }
 371
 372 pre.compile_fail {
 373         border-left: 2px solid rgba(255,0,0,.4);
 374 }
 375
 376 pre.compile_fail:hover, .information:hover + pre.compile_fail {
 377         border-left: 2px solid #f00;
 378 }
 379
 380 pre.should_panic {
 381         border-left: 2px solid rgba(255,0,0,.4);
 382 }
 383
 384 pre.should_panic:hover, .information:hover + pre.should_panic {
 385         border-left: 2px solid #f00;
 386 }
 387
 388 pre.ignore {
 389         border-left: 2px solid rgba(255,142,0,.6);
 390 }
 391
 392 pre.ignore:hover, .information:hover + pre.ignore {
 393         border-left: 2px solid #ff9200;
 394 }
 395
 396 .tooltip.compile_fail {
 397         color: rgba(255,0,0,.5);
 398 }
 399
 400 .information > .compile_fail:hover {
 401         color: #f00;
 402 }
 403
 404 .tooltip.should_panic {
 405         color: rgba(255,0,0,.5);
 406 }
 407
 408 .information > .should_panic:hover {
 409         color: #f00;
 410 }
 411
 412 .tooltip.ignore {
 413         color: rgba(255,142,0,.6);
 414 }
 415
 416 .information > .ignore:hover {
 417         color: #ff9200;
 418 }
 419
 420 .search-failed a {
 421         color: #39AFD7;
 422 }
 423
 424 .tooltip::after {
 425         background-color: #314559;
 426         color: #c5c5c5;
 427         border: 1px solid #5c6773;
 428 }
 429
 430 .tooltip::before {
 431         border-color: transparent #314559 transparent transparent;
 432 }
 433
 434 .notable-traits-tooltiptext {
 435         background-color: #314559;
 436         border-color: #5c6773;
 437 }
 438
 439 .notable-traits-tooltiptext .notable {
 440         border-bottom-color: #5c6773;
 441 }
 442
 443 #titles > button.selected {
 444         background-color: #141920 !important;
 445         border-bottom: 1px solid #ffb44c !important;
 446         border-top: none;
 447 }
 448
 449 #titles > button:not(.selected) {
 450         background-color: transparent !important;
 451         border: none;
 452 }
 453
 454 #titles > button:hover {
 455         border-bottom: 1px solid rgba(242, 151, 24, 0.3);
 456 }
 457
 458 #titles > button > div.count {
 459         color: #888;
 460 }
 461
 462 /* rules that this theme does not need to set, here to satisfy the rule checker */
 463 /* note that a lot of these are partially set in some way (meaning they are set
 464 individually rather than as a group) */
 465 /* FIXME: these rules should be at the bottom of the file but currently must be
 466 above the `@media (max-width: 700px)` rules due to a bug in the css checker */
 467 /* see https://github.com/rust-lang/rust/pull/71237#issuecomment-618170143 */
 468 .search-input:focus {}
 469 .content span.attr,.content a.attr,.block a.current.attr,.content span.derive,.content a.derive,
 470 .block a.current.derive,.content span.macro,.content a.macro,.block a.current.macro {}
 471 .content span.struct,.content a.struct,.block a.current.struct {}
 472 #titles>button:hover,#titles>button.selected {}
 473 .content span.typedef,.content a.typedef,.block a.current.typedef {}
 474 .content span.union,.content a.union,.block a.current.union {}
 475 pre.rust .lifetime {}
 476 .stab.unstable {}
 477 h2,
 478 h3:not(.impl):not(.method):not(.type):not(.tymethod), h4:not(.method):not(.type):not(.tymethod) {}
 479 .content span.enum,.content a.enum,.block a.current.enum {}
 480 .content span.constant,.content a.constant,.block a.current.constant,.content span.static,
 481 .content a.static, .block a.current.static {}
 482 .content span.keyword,.content a.keyword,.block a.current.keyword {}
 483 pre.rust .comment {}
 484 .content span.traitalias,.content a.traitalias,.block a.current.traitalias {}
 485 .content span.fn,.content a.fn,.block a.current.fn,.content span.method,.content a.method,
 486 .block a.current.method,.content span.tymethod,.content a.tymethod,.block a.current.tymethod,
 487 .content .fnname {}
 488 pre.rust .kw {}
 489 pre.rust .self,pre.rust .bool-val,pre.rust .prelude-val,pre.rust .attribute,
 490 pre.rust .attribute .ident {}
 491 .content span.foreigntype,.content a.foreigntype,.block a.current.foreigntype {}
 492 pre.rust .doccomment {}
 493 .stab.deprecated {}
 494 .content a.attr,.content a.derive,.content a.macro {}
 495 .stab.portability {}
 496 .content span.primitive,.content a.primitive,.block a.current.primitive {}
 497 .content span.externcrate,.content span.mod,.content a.mod,.block a.current.mod {}
 498 pre.rust .kw-2,pre.rust .prelude-ty {}
 499 .content span.trait,.content a.trait,.block a.current.trait {}
 500
 501 .search-results a:focus span {}
 502 a.result-trait:focus {}
 503 a.result-traitalias:focus {}
 504 a.result-mod:focus,
 505 a.result-externcrate:focus {}
 506 a.result-mod:focus {}
 507 a.result-externcrate:focus {}
 508 a.result-enum:focus {}
 509 a.result-struct:focus {}
 510 a.result-union:focus {}
 511 a.result-fn:focus,
 512 a.result-method:focus,
 513 a.result-tymethod:focus {}
 514 a.result-type:focus {}
 515 a.result-associatedtype:focus {}
 516 a.result-foreigntype:focus {}
 517 a.result-attr:focus,
 518 a.result-derive:focus,
 519 a.result-macro:focus {}
 520 a.result-constant:focus,
 521 a.result-static:focus {}
 522 a.result-primitive:focus {}
 523 a.result-keyword:focus {}
 524
 525 .sidebar a.current.enum {}
 526 .sidebar a.current.struct {}
 527 .sidebar a.current.foreigntype {}
 528 .sidebar a.current.attr,
 529 .sidebar a.current.derive,
 530 .sidebar a.current.macro {}
 531 .sidebar a.current.union {}
 532 .sidebar a.current.constant
 533 .sidebar a.current.static {}
 534 .sidebar a.current.primitive {}
 535 .sidebar a.current.externcrate
 536 .sidebar a.current.mod {}
 537 .sidebar a.current.trait {}
 538 .sidebar a.current.traitalias {}
 539 .sidebar a.current.fn,
 540 .sidebar a.current.method,
 541 .sidebar a.current.tymethod {}
 542 .sidebar a.current.keyword {}
 543
 544 @media (max-width: 700px) {
 545         .sidebar-menu {
 546                 background-color: #14191f;
 547                 border-bottom-color: #5c6773;
 548                 border-right-color: #5c6773;
 549         }
 550
 551         .sidebar-elems {
 552                 background-color: #14191f;
 553                 border-right-color: #5c6773;
 554         }
 555
 556         #sidebar-filler {
 557                 background-color: #14191f;
 558                 border-bottom-color: #5c6773;
 559         }
 560 }
 561
 562 kbd {
 563         color: #c5c5c5;
 564         background-color: #314559;
 565         border-color: #5c6773;
 566         border-bottom-color: #5c6773;
 567         box-shadow: inset 0 -1px 0 #5c6773;
 568 }
 569
 570 #settings-menu > a, #help-button {
 571         border-color: #5c6773;
 572         background-color: #0f1419;
 573         color: #fff;
 574 }
 575
 576 #settings-menu > a img {
 577         filter: invert(100);
 578 }
 579
 580 #settings-menu #settings, #settings-menu #settings::before {
 581         border-color: #5c6773;
 582 }
 583
 584 #copy-path {
 585         color: #fff;
 586 }
 587 #copy-path > img {
 588         filter: invert(70%);
 589 }
 590 #copy-path:hover > img {
 591         filter: invert(100%);
 592 }
 593
 594 #settings-menu > a:hover, #settings-menu > a:focus,
 595 #help-button:hover, #help-button:focus {
 596         border-color: #e0e0e0;
 597 }
 598
 599 #theme-choices {
 600         border-color: #5c6773;
 601         background-color: #0f1419;
 602 }
 603
 604 #theme-choices > button:not(:first-child) {
 605         border-top-color: #5c6773;
 606 }
 607
 608 #theme-choices > button:hover, #theme-choices > button:focus {
 609         background-color: rgba(110, 110, 110, 0.33);
 610 }
 611
 612 .search-results .result-name span.alias {
 613         color: #c5c5c5;
 614 }
 615 .search-results .result-name span.grey {
 616         color: #999;
 617 }
 618
 619 #sidebar-toggle {
 620         background-color: #14191f;
 621 }
 622 #sidebar-toggle:hover {
 623         background-color: rgba(70, 70, 70, 0.33);
 624 }
 625 #source-sidebar {
 626         background-color: #14191f;
 627 }
 628 #source-sidebar > .title {
 629         color: #fff;
 630         border-bottom-color: #5c6773;
 631 }
 632 div.files > a:hover, div.name:hover {
 633         background-color: #14191f;
 634         color: #ffb44c;
 635 }
 636 div.files > .selected {
 637         background-color: #14191f;
 638         color: #ffb44c;
 639 }
 640
 641 .scraped-example-list .scrape-help {
 642         border-color: #aaa;
 643         color: #eee;
 644 }
 645 .scraped-example-list .scrape-help:hover {
 646         border-color: white;
 647         color: white;
 648 }
 649 .more-examples-toggle summary, .more-examples-toggle .hide-more {
 650         color: #999;
 651 }
 652 .scraped-example .example-wrap .rust span.highlight {
 653         background: rgb(91, 59, 1);
 654 }
 655 .scraped-example .example-wrap .rust span.highlight.focus {
 656         background: rgb(124, 75, 15);
 657 }
 658 .scraped-example:not(.expanded) .code-wrapper:before {
 659         background: linear-gradient(to bottom, rgba(15, 20, 25, 1), rgba(15, 20, 25, 0));
 660 }
 661 .scraped-example:not(.expanded) .code-wrapper:after {
 662         background: linear-gradient(to top, rgba(15, 20, 25, 1), rgba(15, 20, 25, 0));
 663 }
 664 .toggle-line-inner {
 665         background: #999;
 666 }
 667 .toggle-line:hover .toggle-line-inner {
 668         background: #c5c5c5;
 669 }