History

Grayscale + brighten dark doc icons in dark theme

Fixes #160.

Thibaut committed 11 years ago

Commit 65a3db71 parent 34c987c1 file · +18 −11Browse files

Unified · Split

assets/stylesheets/global/_icons.scss+18−11
@@ -11,6 +11,13 @@ · 10 unmodified lines
11 %icon { background-image: image-url('icons@2x.png'); }11 %icon { background-image: image-url('icons@2x.png'); }
12}12}
13 13
14%darkIconFix {
15 @if $style == 'dark' {
16 filter: invert(100%) grayscale(100%);
17 -webkit-filter: invert(100%) grayscale(100%);
18 }
19}
20
14%icon-dir { background-position: 0 0; }21%icon-dir { background-position: 0 0; }
15%icon-search { background-position: -1rem 0; }22%icon-search { background-position: -1rem 0; }
16%icon-link { background-position: -2.25rem -.25rem; }23%icon-link { background-position: -2.25rem -.25rem; }
@@ -18,20 +25,20 @@ · 1 unmodified line
18%icon-close-white { background-position: -4rem 0; }25%icon-close-white { background-position: -4rem 0; }
19%icon-settings { background-position: -5rem 0; }26%icon-settings { background-position: -5rem 0; }
20%icon-check { background-position: -6rem 0; }27%icon-check { background-position: -6rem 0; }
21._icon-http:before { background-position: -7rem 0; }28._icon-http:before { background-position: -7rem 0; @extend %darkIconFix !optional; }
22._icon-jquery:before { background-position: -8rem 0; }29._icon-jquery:before { background-position: -8rem 0; @extend %darkIconFix !optional; }
23._icon-underscore:before { background-position: -9rem 0; }30._icon-underscore:before { background-position: -9rem 0; @extend %darkIconFix !optional; }
24._icon-html:before { background-position: 0 -1rem; }31._icon-html:before { background-position: 0 -1rem; }
25._icon-css:before { background-position: -1rem -1rem; }32._icon-css:before { background-position: -1rem -1rem; }
26._icon-dom:before { background-position: -2rem -1rem; }33._icon-dom:before { background-position: -2rem -1rem; }
27._icon-dom_events:before { background-position: -3rem -1rem; }34._icon-dom_events:before { background-position: -3rem -1rem; }
28._icon-javascript:before { background-position: -4rem -1rem; }35._icon-javascript:before { background-position: -4rem -1rem; }
29._icon-backbone:before { background-position: -5rem -1rem; }36._icon-backbone:before { background-position: -5rem -1rem; @extend %darkIconFix !optional; }
30._icon-node:before { background-position: -6rem -1rem; }37._icon-node:before { background-position: -6rem -1rem; }
31._icon-sass:before { background-position: -7rem -1rem; }38._icon-sass:before { background-position: -7rem -1rem; }
32._icon-less:before { background-position: -8rem -1rem; }39._icon-less:before { background-position: -8rem -1rem; }
33._icon-angular:before { background-position: -9rem -1rem; }40._icon-angular:before { background-position: -9rem -1rem; }
34._icon-coffeescript:before { background-position: 0 -2rem; }41._icon-coffeescript:before { background-position: 0 -2rem; @extend %darkIconFix !optional; }
35._icon-ember:before { background-position: -1rem -2rem; }42._icon-ember:before { background-position: -1rem -2rem; }
36%icon-menu { background-position: -2rem -2rem; }43%icon-menu { background-position: -2rem -2rem; }
37%icon-home { background-position: -3rem -2rem; }44%icon-home { background-position: -3rem -2rem; }
@@ -49,7 +56,7 @@ · 11 unmodified lines
49._icon-postgresql:before { background-position: -3rem -3rem; }56._icon-postgresql:before { background-position: -3rem -3rem; }
50._icon-d3:before { background-position: -4rem -3rem; }57._icon-d3:before { background-position: -4rem -3rem; }
51._icon-knockout:before { background-position: -5rem -3rem; }58._icon-knockout:before { background-position: -5rem -3rem; }
52._icon-moment:before { background-position: -6rem -3rem; }59._icon-moment:before { background-position: -6rem -3rem; @extend %darkIconFix !optional; }
53._icon-c:before { background-position: -7rem -3rem; }60._icon-c:before { background-position: -7rem -3rem; }
54%icon-path { background-position: -8rem -3rem; }61%icon-path { background-position: -8rem -3rem; }
55._icon-yii:before,62._icon-yii:before,
@@ -63,9 +70,9 @@ · 7 unmodified lines
63._icon-haskell:before { background-position: -6rem -4rem; }70._icon-haskell:before { background-position: -6rem -4rem; }
64._icon-requirejs:before { background-position: -7rem -4rem; }71._icon-requirejs:before { background-position: -7rem -4rem; }
65._icon-chai:before { background-position: -8rem -4rem; }72._icon-chai:before { background-position: -8rem -4rem; }
66._icon-sinon:before { background-position: -9rem -4rem; }73._icon-sinon:before { background-position: -9rem -4rem; @extend %darkIconFix !optional; }
67._icon-cordova:before { background-position: 0 -5rem; }74._icon-cordova:before { background-position: 0 -5rem; }
68._icon-markdown:before { background-position: -1rem -5rem; }75._icon-markdown:before { background-position: -1rem -5rem; @extend %darkIconFix !optional; }
69._icon-django:before { background-position: -2rem -5rem; }76._icon-django:before { background-position: -2rem -5rem; }
70._icon-xpath:before { background-position: -3rem -5rem; }77._icon-xpath:before { background-position: -3rem -5rem; }
71._icon-nginx:before { background-position: -4rem -5rem; }78._icon-nginx:before { background-position: -4rem -5rem; }
@@ -73,7 +80,7 @@ · 1 unmodified line
73._icon-marionette:before { background-position: -6rem -5rem; }80._icon-marionette:before { background-position: -6rem -5rem; }
74._icon-mongoose:before { background-position: -7rem -5rem; }81._icon-mongoose:before { background-position: -7rem -5rem; }
75._icon-phpunit:before { background-position: -8rem -5rem; }82._icon-phpunit:before { background-position: -8rem -5rem; }
76._icon-nokogiri:before { background-position: -9rem -5rem; }83._icon-nokogiri:before { background-position: -9rem -5rem; @extend %darkIconFix !optional; }
77._icon-rethinkdb:before { background-position: 0 -6rem; }84._icon-rethinkdb:before { background-position: 0 -6rem; }
78._icon-react:before { background-position: -1rem -6rem; }85._icon-react:before { background-position: -1rem -6rem; }
79._icon-socketio:before { background-position: -2rem -6rem; }86._icon-socketio:before { background-position: -2rem -6rem; }
@@ -86,7 +93,7 @@ · 6 unmodified lines
86%icon-check-white { background-position: -9rem -6rem; }93%icon-check-white { background-position: -9rem -6rem; }
87%icon-light { background-position: 0 -7rem; }94%icon-light { background-position: 0 -7rem; }
88%icon-light-white { background-position: -1rem -7rem; }95%icon-light-white { background-position: -1rem -7rem; }
89._icon-iojs:before { background-position: -2rem -7rem; }96._icon-iojs:before { background-position: -2rem -7rem; @extend %darkIconFix !optional; }
90._icon-lua:before { background-position: -3rem -7rem; }97._icon-lua:before { background-position: -3rem -7rem; @extend %darkIconFix !optional; }
91._icon-clojure:before { background-position: -4rem -7rem; }98._icon-clojure:before { background-position: -4rem -7rem; }
92._icon-symfony:before { background-position: -5rem -7rem; }99._icon-symfony:before { background-position: -5rem -7rem; }