Split doc icon sprite

This commit is contained in:
Thibaut Courouble 2017-05-14 15:41:00 -04:00
parent aa1be2f49d
commit c13877f833
8 changed files with 42 additions and 33 deletions

Binary file not shown.

Before

Width:  |  Height:  |  Size: 55 KiB

After

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 143 KiB

After

Width:  |  Height:  |  Size: 119 KiB

BIN
assets/images/docs-2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
assets/images/docs-2@2x.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 25 KiB

View file

@ -1,7 +1,9 @@
//= depend_on icons.png
//= depend_on icons@2x.png
//= depend_on docs.png
//= depend_on docs@2x.png
//= depend_on docs-1.png
//= depend_on docs-1@2x.png
//= depend_on docs-2.png
//= depend_on docs-2@2x.png
/*!
* Copyright 2013-2017 Thibaut Courouble and other contributors

View file

@ -1,7 +1,9 @@
//= depend_on icons.png
//= depend_on icons@2x.png
//= depend_on docs.png
//= depend_on docs@2x.png
//= depend_on docs-1.png
//= depend_on docs-1@2x.png
//= depend_on docs-2.png
//= depend_on docs-2@2x.png
/*!
* Copyright 2013-2017 Thibaut Courouble and other contributors

View file

@ -7,21 +7,23 @@
background-size: 4rem 3rem;
}
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
%icon { background-image: image-url('icons@2x.png'); }
}
%doc-icon {
content: '';
display: block;
width: 1rem;
height: 1rem;
background-image: image-url('docs.png');
background-size: 10rem 12rem;
background-image: image-url('docs-1.png');
background-size: 10rem 10rem;
}
%doc-icon-2 {
background-image: image-url('docs-2.png');
}
@media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) {
%doc-icon { background-image: image-url('docs@2x.png'); }
%icon { background-image: image-url('icons@2x.png'); }
%doc-icon { background-image: image-url('docs-1@2x.png'); }
%doc-icon-2 { background-image: image-url('docs-2@2x.png'); }
}
%darkIconFix {
@ -148,23 +150,24 @@
._icon-flow:before { background-position: -7rem -9rem; }
._icon-relay:before { background-position: -8rem -9rem; }
._icon-phoenix:before { background-position: -9rem -9rem; }
._icon-tcl_tk:before { background-position: 0 -10rem; }
._icon-erlang:before { background-position: -1rem -10rem; }
._icon-chef:before { background-position: -2rem -10rem; }
._icon-ramda:before { background-position: -3rem -10rem; @extend %darkIconFix !optional; }
._icon-codeigniter:before { background-position: -4rem -10rem; @extend %darkIconFix !optional; }
._icon-influxdata:before { background-position: -5rem -10rem; @extend %darkIconFix !optional; }
._icon-tensorflow:before { background-position: -6rem -10rem; }
._icon-haxe:before { background-position: -7rem -10rem; }
._icon-ansible:before { background-position: -8rem -10rem; @extend %darkIconFix !optional; }
._icon-typescript:before { background-position: -9rem -10rem; }
._icon-browser_support_tables:before { background-position: 0rem -11rem; }
._icon-gnu_fortran:before { background-position: -1rem -11rem; }
._icon-gcc:before { background-position: -2rem -11rem; }
._icon-perl:before { background-position: -3rem -11rem; }
._icon-apache_pig:before { background-position: -4rem -11rem; }
._icon-numpy:before { background-position: -5rem -11rem; }
._icon-kotlin:before { background-position: -6rem -11rem; }
._icon-padrino:before { background-position: -7rem -11rem; }
._icon-angular:before { background-position: -8rem -11rem; }
._icon-love:before { background-position: -9rem -11rem; }
._icon-tcl_tk:before { background-position: 0 0; @extend %doc-icon-2; }
._icon-erlang:before { background-position: -1rem 0; @extend %doc-icon-2; }
._icon-chef:before { background-position: -2rem 0; @extend %doc-icon-2; }
._icon-ramda:before { background-position: -3rem 0; @extend %doc-icon-2; @extend %darkIconFix !optional; }
._icon-codeigniter:before { background-position: -4rem 0; @extend %doc-icon-2; @extend %darkIconFix !optional; }
._icon-influxdata:before { background-position: -5rem 0; @extend %doc-icon-2; @extend %darkIconFix !optional; }
._icon-tensorflow:before { background-position: -6rem 0; @extend %doc-icon-2; }
._icon-haxe:before { background-position: -7rem 0; @extend %doc-icon-2; }
._icon-ansible:before { background-position: -8rem 0; @extend %doc-icon-2; @extend %darkIconFix !optional; }
._icon-typescript:before { background-position: -9rem 0; @extend %doc-icon-2; }
._icon-browser_support_tables:before { background-position: 0rem -1rem; @extend %doc-icon-2; }
._icon-gnu_fortran:before { background-position: -1rem -1rem; @extend %doc-icon-2; }
._icon-gcc:before { background-position: -2rem -1rem; @extend %doc-icon-2; }
._icon-perl:before { background-position: -3rem -1rem; @extend %doc-icon-2; }
._icon-apache_pig:before { background-position: -4rem -1rem; @extend %doc-icon-2; }
._icon-numpy:before { background-position: -5rem -1rem; @extend %doc-icon-2; }
._icon-kotlin:before { background-position: -6rem -1rem; @extend %doc-icon-2; }
._icon-padrino:before { background-position: -7rem -1rem; @extend %doc-icon-2; }
._icon-angular:before { background-position: -8rem -1rem; @extend %doc-icon-2; }
._icon-love:before { background-position: -9rem -1rem; @extend %doc-icon-2; }

View file

@ -8,8 +8,10 @@ CACHE:
<%= stylesheet_path 'application-dark' %>
<%= image_path 'icons.png' %>
<%= image_path 'icons@2x.png' %>
<%= image_path 'docs.png' %>
<%= image_path 'docs@2x.png' %>
<%= image_path 'docs-1.png' %>
<%= image_path 'docs-1@2x.png' %>
<%= image_path 'docs-2.png' %>
<%= image_path 'docs-2@2x.png' %>
<%= asset_path 'docs.js' %>
<%= doc_index_urls.join "\n" %>