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 :root {
   7         --main-background-color: #0f1419;
   8         --main-color: #c5c5c5;
   9         --settings-input-color: #ffb454;
  10         --sidebar-background-color: #14191f;
  11         --sidebar-background-color-hover: rgba(70, 70, 70, 0.33);
  12         --code-block-background-color: #191f26;
  13         --scrollbar-track-background-color: transparent;
  14         --scrollbar-thumb-background-color: #5c6773;
  15         --scrollbar-color: #5c6773 #24292f;
  16         --headings-border-bottom-color: #5c6773;
  17         --border-color: #5c6773;
  18         --button-background-color: #141920;
  19         --right-side-color: grey;
  20         --code-attribute-color: #999;
  21         --toggles-color: #999;
  22         --search-input-focused-border-color: #5c6773; /* Same as `--border-color`. */
  23         --copy-path-button-color: #fff;
  24         --copy-path-img-filter: invert(70%);
  25         --copy-path-img-hover-filter: invert(100%);
  26         --codeblock-error-hover-color: rgb(255, 0, 0);
  27         --codeblock-error-color: rgba(255, 0, 0, .5);
  28         --codeblock-ignore-hover-color: rgb(255, 142, 0);
  29         --codeblock-ignore-color: rgba(255, 142, 0, .6);
  30         --type-link-color: #ffa0a5;
  31         --trait-link-color: #39afd7;
  32         --assoc-item-link-color: #39afd7;
  33         --function-link-color: #fdd687;
  34         --macro-link-color: #a37acc;
  35         --keyword-link-color: #39afd7;
  36         --mod-link-color: #39afd7;
  37         --link-color: #39afd7;
  38         --sidebar-link-color: #53b1db;
  39         --sidebar-current-link-background-color: transparent;
  40         --search-result-link-focus-background-color: #3c3c3c;
  41         --search-result-border-color: #aaa3;
  42         --stab-background-color: #314559;
  43         --stab-code-color: #e6e1cf;
  44         --search-color: #fff;
  45         --code-highlight-kw-color: #ff7733;
  46         --code-highlight-kw-2-color: #ff7733;
  47         --code-highlight-lifetime-color: #ff7733;
  48         --code-highlight-prelude-color: #69f2df;
  49         --code-highlight-prelude-val-color: #ff7733;
  50         --code-highlight-number-color: #b8cc52;
  51         --code-highlight-string-color: #b8cc52;
  52         --code-highlight-literal-color: #ff7733;
  53         --code-highlight-attribute-color: #e6e1cf;
  54         --code-highlight-self-color: #36a3d9;
  55         --code-highlight-macro-color: #a37acc;
  56         --code-highlight-question-mark-color: #ff9011;
  57         --code-highlight-comment-color: #788797;
  58         --code-highlight-doc-comment-color: #a1ac88;
  59         --example-line-numbers-border-color: none;
  60         --src-line-numbers-span-color: #5c6773;
  61         --src-line-number-highlighted-background-color: rgba(255, 236, 164, 0.06);
  62         --test-arrow-color: #788797;
  63         --test-arrow-background-color: rgba(57, 175, 215, 0.09);
  64         --test-arrow-hover-color: #c5c5c5;
  65         --test-arrow-hover-background-color: rgba(57, 175, 215, 0.368);
  66         --target-background-color: rgba(255, 236, 164, 0.06);
  67         --target-border-color: rgba(255, 180, 76, 0.85);
  68         --rust-logo-filter: drop-shadow(1px 0 0px #fff)
  69                 drop-shadow(0 1px 0 #fff)
  70                 drop-shadow(-1px 0 0 #fff)
  71                 drop-shadow(0 -1px 0 #fff);
  72         /* match border-color; uses https://codepen.io/sosuke/pen/Pjoqqp */
  73         --crate-search-div-filter: invert(41%) sepia(12%) saturate(487%) hue-rotate(171deg)
  74                 brightness(94%) contrast(94%);
  75         --crate-search-div-hover-filter: invert(98%) sepia(12%) saturate(81%) hue-rotate(343deg)
  76                 brightness(113%) contrast(76%);
  77         --crate-search-hover-border: #e0e0e0;
  78 }
  79
  80 h1, h2, h3, h4 {
  81         color: white;
  82 }
  83 h1 a {
  84         color: #fff;
  85 }
  86 h4 {
  87         border: none;
  88 }
  89
  90 .docblock code {
  91         color: #ffb454;
  92 }
  93 .code-header {
  94         color: #e6e1cf;
  95 }
  96 .docblock pre > code, pre > code {
  97         color: #e6e1cf;
  98 }
  99 .item-info code {
 100         color: #e6e1cf;
 101 }
 102 .docblock a > code {
 103         color: #39AFD7 !important;
 104 }
 105 pre, .rustdoc.source .example-wrap {
 106         color: #e6e1cf;
 107 }
 108
 109 .sidebar .current,
 110 .sidebar a:hover {
 111         color: #ffb44c;
 112 }
 113
 114 .sidebar-elems .location {
 115         color: #ff7733;
 116 }
 117
 118 .src-line-numbers .line-highlighted {
 119         color: #708090;
 120         padding-right: 4px;
 121         border-right: 1px solid #ffb44c;
 122 }
 123
 124 .search-results a:hover {
 125         color: #fff !important;
 126         background-color: #3c3c3c;
 127 }
 128
 129 .search-results a:focus {
 130         color: #fff !important;
 131         background-color: #3c3c3c;
 132 }
 133 .search-results a {
 134         color: #0096cf;
 135 }
 136 .search-results a div.desc {
 137         color: #c5c5c5;
 138 }
 139
 140 .content .item-info::before { color: #ccc; }
 141
 142 .sidebar h2 a,
 143 .sidebar h3 a {
 144         color: white;
 145 }
 146 body.source .example-wrap pre.rust a {
 147         background: #333;
 148 }
 149
 150 details.rustdoc-toggle > summary::before {
 151         filter: invert(100%);
 152 }
 153
 154 .module-item .stab,
 155 .import-item .stab {
 156         color: #000;
 157 }
 158
 159 .result-name .primitive > i, .result-name .keyword > i {
 160         color: #788797;
 161 }
 162
 163 .tooltip::after {
 164         background-color: #314559;
 165         color: #c5c5c5;
 166 }
 167
 168 .tooltip::before {
 169         border-color: transparent #314559 transparent transparent;
 170 }
 171
 172 #titles > button.selected {
 173         background-color: #141920 !important;
 174         border-bottom: 1px solid #ffb44c !important;
 175         border-top: none;
 176 }
 177
 178 #titles > button:not(.selected) {
 179         background-color: transparent !important;
 180         border: none;
 181 }
 182
 183 #titles > button:hover {
 184         border-bottom: 1px solid rgba(242, 151, 24, 0.3);
 185 }
 186
 187 #titles > button > div.count {
 188         color: #888;
 189 }
 190
 191 /* rules that this theme does not need to set, here to satisfy the rule checker */
 192 /* note that a lot of these are partially set in some way (meaning they are set
 193 individually rather than as a group) */
 194 /* FIXME: these rules should be at the bottom of the file but currently must be
 195 above the `@media (max-width: 700px)` rules due to a bug in the css checker */
 196 /* see https://github.com/rust-lang/rust/pull/71237#issuecomment-618170143 */
 197 pre.rust .lifetime {}
 198 pre.rust .kw {}
 199 #titles > button:hover, #titles > button.selected {}
 200 pre.rust .self, pre.rust .bool-val, pre.rust .prelude-val, pre.rust .attribute {}
 201 pre.rust .kw-2, pre.rust .prelude-ty {}
 202
 203 kbd {
 204         color: #c5c5c5;
 205         background-color: #314559;
 206         box-shadow: inset 0 -1px 0 #5c6773;
 207 }
 208
 209 #settings-menu > a, #help-button > a {
 210         color: #fff;
 211 }
 212
 213 #settings-menu > a img {
 214         filter: invert(100);
 215 }
 216
 217 #settings-menu > a:hover, #settings-menu > a:focus,
 218 #help-button > a:hover, #help-button > a:focus {
 219         border-color: #e0e0e0;
 220 }
 221
 222 .search-results .result-name span.alias {
 223         color: #c5c5c5;
 224 }
 225 .search-results .result-name span.grey {
 226         color: #999;
 227 }
 228
 229 #source-sidebar > .title {
 230         color: #fff;
 231 }
 232 #source-sidebar div.files > a:hover, details.dir-entry summary:hover,
 233 #source-sidebar div.files > a:focus, details.dir-entry summary:focus {
 234         background-color: #14191f;
 235         color: #ffb44c;
 236 }
 237 #source-sidebar div.files > a.selected {
 238         background-color: #14191f;
 239         color: #ffb44c;
 240 }
 241
 242 .scraped-example-list .scrape-help {
 243         border-color: #aaa;
 244         color: #eee;
 245 }
 246 .scraped-example-list .scrape-help:hover {
 247         border-color: white;
 248         color: white;
 249 }
 250 .scraped-example .example-wrap .rust span.highlight {
 251         background: rgb(91, 59, 1);
 252 }
 253 .scraped-example .example-wrap .rust span.highlight.focus {
 254         background: rgb(124, 75, 15);
 255 }
 256 .scraped-example:not(.expanded) .code-wrapper:before {
 257         background: linear-gradient(to bottom, rgba(15, 20, 25, 1), rgba(15, 20, 25, 0));
 258 }
 259 .scraped-example:not(.expanded) .code-wrapper:after {
 260         background: linear-gradient(to top, rgba(15, 20, 25, 1), rgba(15, 20, 25, 0));
 261 }
 262 .toggle-line-inner {
 263         background: #999;
 264 }
 265 .toggle-line:hover .toggle-line-inner {
 266         background: #c5c5c5;
 267 }