From e4c62b85f14f8e1a9e1cfea19fdd2f824ca8f679 Mon Sep 17 00:00:00 2001 From: fen Date: Tue, 11 Mar 2014 20:02:35 +0800 Subject: [PATCH] fixed retina support --- admin/css/style.css | 129 +++++++++++++----- admin/img/icons-2x-se223d6d340.png | Bin 0 -> 4801 bytes .../{icon-delete-2x.png => icon-delete.png} | Bin .../{icon-edit-2x.png => icon-edit.png} | Bin .../{icon-exlink-2x.png => icon-exlink.png} | Bin ...d-active-2x.png => icon-upload-active.png} | Bin .../{icon-upload-2x.png => icon-upload.png} | Bin ...pplication-2x.png => mime-application.png} | Bin .../{mime-archive-2x.png => mime-archive.png} | Bin .../{mime-audio-2x.png => mime-audio.png} | Bin .../{mime-html-2x.png => mime-html.png} | Bin .../{mime-image-2x.png => mime-image.png} | Bin .../{mime-office-2x.png => mime-office.png} | Bin .../{mime-script-2x.png => mime-script.png} | Bin .../{mime-text-2x.png => mime-text.png} | Bin .../{mime-unknow-2x.png => mime-unknow.png} | Bin .../{mime-video-2x.png => mime-video.png} | Bin admin/scss/_icons.scss | 65 ++++++--- admin/scss/components/_editor.scss | 2 +- 19 files changed, 145 insertions(+), 51 deletions(-) create mode 100644 admin/img/icons-2x-se223d6d340.png rename admin/img/icons-2x/{icon-delete-2x.png => icon-delete.png} (100%) rename admin/img/icons-2x/{icon-edit-2x.png => icon-edit.png} (100%) rename admin/img/icons-2x/{icon-exlink-2x.png => icon-exlink.png} (100%) rename admin/img/icons-2x/{icon-upload-active-2x.png => icon-upload-active.png} (100%) rename admin/img/icons-2x/{icon-upload-2x.png => icon-upload.png} (100%) rename admin/img/icons-2x/{mime-application-2x.png => mime-application.png} (100%) rename admin/img/icons-2x/{mime-archive-2x.png => mime-archive.png} (100%) rename admin/img/icons-2x/{mime-audio-2x.png => mime-audio.png} (100%) rename admin/img/icons-2x/{mime-html-2x.png => mime-html.png} (100%) rename admin/img/icons-2x/{mime-image-2x.png => mime-image.png} (100%) rename admin/img/icons-2x/{mime-office-2x.png => mime-office.png} (100%) rename admin/img/icons-2x/{mime-script-2x.png => mime-script.png} (100%) rename admin/img/icons-2x/{mime-text-2x.png => mime-text.png} (100%) rename admin/img/icons-2x/{mime-unknow-2x.png => mime-unknow.png} (100%) rename admin/img/icons-2x/{mime-video-2x.png => mime-video.png} (100%) diff --git a/admin/css/style.css b/admin/css/style.css index c87b5f50..ade4c149 100644 --- a/admin/css/style.css +++ b/admin/css/style.css @@ -1408,112 +1408,177 @@ a.operate-reply { /** * icons */ -/* line 8, ../scss/_icons.scss */ +/* line 29, ../scss/_icons.scss */ .i-edit, .i-delete, .i-exlink, .mime-office, .mime-text, .mime-image, .mime-html, .mime-archive, .mime-application, .mime-audio, .mime-script, .mime-video, .mime-unknow, .i-upload, .i-upload-active { display: inline-block; vertical-align: text-bottom; - background: url('../img/icons-sba2b1299ac.png') no-repeat; - text-indent: -9999em; } - /* line 13, ../scss/_icons.scss */ + text-indent: -9999em; + background-image: url('../img/icons-sba2b1299ac.png'); + background-repeat: no-repeat; } + /* line 35, ../scss/_icons.scss */ .i-edit:hover, .i-delete:hover, .i-exlink:hover, .mime-office:hover, .mime-text:hover, .mime-image:hover, .mime-html:hover, .mime-archive:hover, .mime-application:hover, .mime-audio:hover, .mime-script:hover, .mime-video:hover, .mime-unknow:hover, .i-upload:hover, .i-upload-active:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75); opacity: 0.75; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 29, ../scss/_icons.scss */ + .i-edit, .i-delete, .i-exlink, .mime-office, .mime-text, .mime-image, .mime-html, .mime-archive, .mime-application, .mime-audio, .mime-script, .mime-video, .mime-unknow, .i-upload, .i-upload-active { + -webkit-background-size: auto 256px; + -moz-background-size: auto 256px; + -o-background-size: auto 256px; + background-size: auto 256px; + background-image: url('../img/icons-2x-se223d6d340.png'); } } -/* line 18, ../scss/_icons.scss */ +/* line 47, ../scss/_icons.scss */ .i-edit, .i-delete, .i-exlink, .mime-office, .mime-text, .mime-image, .mime-html, .mime-archive, .mime-application, .mime-audio, .mime-script, .mime-video, .mime-unknow { width: 16px; height: 16px; } -/* line 24, ../scss/_icons.scss */ +/* line 53, ../scss/_icons.scss */ .i-upload, .i-upload-active { width: 24px; height: 24px; } -/* line 30, ../scss/_icons.scss */ +/* line 59, ../scss/_icons.scss */ .i-edit { background-position: 0 -80px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 59, ../scss/_icons.scss */ + .i-edit { + background-position: 0 -80px; } } -/* line 34, ../scss/_icons.scss */ +/* line 63, ../scss/_icons.scss */ .i-delete { background-position: 0 -64px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 63, ../scss/_icons.scss */ + .i-delete { + background-position: 0 -64px; } } -/* line 42, ../scss/_icons.scss */ +/* line 71, ../scss/_icons.scss */ .i-upload { background-position: 0 -24px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 71, ../scss/_icons.scss */ + .i-upload { + background-position: 0 -24px; } } -/* line 47, ../scss/_icons.scss */ +/* line 76, ../scss/_icons.scss */ .i-upload-active { background-position: 0 0; } -/* line 53, ../scss/_icons.scss */ +/* line 82, ../scss/_icons.scss */ .i-caret-up, .i-caret-down, .i-caret-left, .i-caret-right { display: inline-block; border-style: solid; border-color: transparent transparent #BBB transparent; border-width: 3px 4px 5px; } -/* line 59, ../scss/_icons.scss */ +/* line 88, ../scss/_icons.scss */ .i-caret-down { border-color: #BBB transparent transparent transparent; border-width: 5px 4px 3px; } -/* line 63, ../scss/_icons.scss */ +/* line 92, ../scss/_icons.scss */ .i-caret-left { border-color: transparent #BBB transparent transparent; border-width: 4px 5px 4px 3px; } -/* line 67, ../scss/_icons.scss */ +/* line 96, ../scss/_icons.scss */ .i-caret-right { border-color: transparent transparent transparent #BBB; border-width: 4px 3px 4px 5px; } -/* line 72, ../scss/_icons.scss */ +/* line 101, ../scss/_icons.scss */ .i-exlink { background-position: 0 -48px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 101, ../scss/_icons.scss */ + .i-exlink { + background-position: 0 -48px; } } /* 文件类型图标 */ -/* line 80, ../scss/_icons.scss */ +/* line 109, ../scss/_icons.scss */ .mime-office { background-position: 0 -128px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 109, ../scss/_icons.scss */ + .mime-office { + background-position: 0 -112px; } } -/* line 85, ../scss/_icons.scss */ +/* line 114, ../scss/_icons.scss */ .mime-text { background-position: 0 -208px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 114, ../scss/_icons.scss */ + .mime-text { + background-position: 0 -208px; } } -/* line 90, ../scss/_icons.scss */ +/* line 119, ../scss/_icons.scss */ .mime-image { background-position: 0 -96px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 119, ../scss/_icons.scss */ + .mime-image { + background-position: 0 -96px; } } -/* line 95, ../scss/_icons.scss */ +/* line 124, ../scss/_icons.scss */ .mime-html { background-position: 0 -144px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 124, ../scss/_icons.scss */ + .mime-html { + background-position: 0 -144px; } } -/* line 100, ../scss/_icons.scss */ +/* line 129, ../scss/_icons.scss */ .mime-archive { background-position: 0 -224px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 129, ../scss/_icons.scss */ + .mime-archive { + background-position: 0 -224px; } } -/* line 105, ../scss/_icons.scss */ +/* line 134, ../scss/_icons.scss */ .mime-application { background-position: 0 -160px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 134, ../scss/_icons.scss */ + .mime-application { + background-position: 0 -176px; } } -/* line 110, ../scss/_icons.scss */ +/* line 139, ../scss/_icons.scss */ .mime-audio { background-position: 0 -240px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 139, ../scss/_icons.scss */ + .mime-audio { + background-position: 0 -240px; } } -/* line 115, ../scss/_icons.scss */ +/* line 144, ../scss/_icons.scss */ .mime-script { background-position: 0 -176px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 144, ../scss/_icons.scss */ + .mime-script { + background-position: 0 -160px; } } -/* line 120, ../scss/_icons.scss */ +/* line 149, ../scss/_icons.scss */ .mime-video { background-position: 0 -112px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 149, ../scss/_icons.scss */ + .mime-video { + background-position: 0 -128px; } } -/* line 125, ../scss/_icons.scss */ +/* line 154, ../scss/_icons.scss */ .mime-unknow { background-position: 0 -192px; } + @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { + /* line 154, ../scss/_icons.scss */ + .mime-unknow { + background-position: 0 -192px; } } /* Logo 图标 */ -/* line 132, ../scss/_icons.scss */ +/* line 161, ../scss/_icons.scss */ .i-logo, .i-logo-s { width: 169px; height: 40px; @@ -1526,12 +1591,12 @@ a.operate-reply { background-size: auto 40px; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=15); opacity: 0.15; } - /* line 140, ../scss/_icons.scss */ + /* line 169, ../scss/_icons.scss */ .i-logo:hover, .i-logo-s:hover { filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20); opacity: 0.2; } -/* line 144, ../scss/_icons.scss */ +/* line 173, ../scss/_icons.scss */ .i-logo-s { width: 26px; height: 26px; @@ -1589,10 +1654,10 @@ a.operate-reply { /* line 46, ../scss/components/_editor.scss */ #wmd-button-row span { background-image: url(../img/editor@2x.png); - -webkit-background-size: 320px 60px; - -moz-background-size: 320px 60px; - -o-background-size: 320px 60px; - background-size: 320px 60px; } } + -webkit-background-size: 320px auto; + -moz-background-size: 320px auto; + -o-background-size: 320px auto; + background-size: 320px auto; } } /* line 53, ../scss/components/_editor.scss */ .wmd-edittab { float: right; diff --git a/admin/img/icons-2x-se223d6d340.png b/admin/img/icons-2x-se223d6d340.png new file mode 100644 index 0000000000000000000000000000000000000000..71b1f8799d5ec33753dbb8bdc0996081dbe7d87b GIT binary patch literal 4801 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 Hv!H(gw66AZ literal 0 HcmV?d00001 diff --git a/admin/img/icons-2x/icon-delete-2x.png b/admin/img/icons-2x/icon-delete.png similarity index 100% rename from admin/img/icons-2x/icon-delete-2x.png rename to admin/img/icons-2x/icon-delete.png diff --git a/admin/img/icons-2x/icon-edit-2x.png b/admin/img/icons-2x/icon-edit.png similarity index 100% rename from admin/img/icons-2x/icon-edit-2x.png rename to admin/img/icons-2x/icon-edit.png diff --git a/admin/img/icons-2x/icon-exlink-2x.png b/admin/img/icons-2x/icon-exlink.png similarity index 100% rename from admin/img/icons-2x/icon-exlink-2x.png rename to admin/img/icons-2x/icon-exlink.png diff --git a/admin/img/icons-2x/icon-upload-active-2x.png b/admin/img/icons-2x/icon-upload-active.png similarity index 100% rename from admin/img/icons-2x/icon-upload-active-2x.png rename to admin/img/icons-2x/icon-upload-active.png diff --git a/admin/img/icons-2x/icon-upload-2x.png b/admin/img/icons-2x/icon-upload.png similarity index 100% rename from admin/img/icons-2x/icon-upload-2x.png rename to admin/img/icons-2x/icon-upload.png diff --git a/admin/img/icons-2x/mime-application-2x.png b/admin/img/icons-2x/mime-application.png similarity index 100% rename from admin/img/icons-2x/mime-application-2x.png rename to admin/img/icons-2x/mime-application.png diff --git a/admin/img/icons-2x/mime-archive-2x.png b/admin/img/icons-2x/mime-archive.png similarity index 100% rename from admin/img/icons-2x/mime-archive-2x.png rename to admin/img/icons-2x/mime-archive.png diff --git a/admin/img/icons-2x/mime-audio-2x.png b/admin/img/icons-2x/mime-audio.png similarity index 100% rename from admin/img/icons-2x/mime-audio-2x.png rename to admin/img/icons-2x/mime-audio.png diff --git a/admin/img/icons-2x/mime-html-2x.png b/admin/img/icons-2x/mime-html.png similarity index 100% rename from admin/img/icons-2x/mime-html-2x.png rename to admin/img/icons-2x/mime-html.png diff --git a/admin/img/icons-2x/mime-image-2x.png b/admin/img/icons-2x/mime-image.png similarity index 100% rename from admin/img/icons-2x/mime-image-2x.png rename to admin/img/icons-2x/mime-image.png diff --git a/admin/img/icons-2x/mime-office-2x.png b/admin/img/icons-2x/mime-office.png similarity index 100% rename from admin/img/icons-2x/mime-office-2x.png rename to admin/img/icons-2x/mime-office.png diff --git a/admin/img/icons-2x/mime-script-2x.png b/admin/img/icons-2x/mime-script.png similarity index 100% rename from admin/img/icons-2x/mime-script-2x.png rename to admin/img/icons-2x/mime-script.png diff --git a/admin/img/icons-2x/mime-text-2x.png b/admin/img/icons-2x/mime-text.png similarity index 100% rename from admin/img/icons-2x/mime-text-2x.png rename to admin/img/icons-2x/mime-text.png diff --git a/admin/img/icons-2x/mime-unknow-2x.png b/admin/img/icons-2x/mime-unknow.png similarity index 100% rename from admin/img/icons-2x/mime-unknow-2x.png rename to admin/img/icons-2x/mime-unknow.png diff --git a/admin/img/icons-2x/mime-video-2x.png b/admin/img/icons-2x/mime-video.png similarity index 100% rename from admin/img/icons-2x/mime-video-2x.png rename to admin/img/icons-2x/mime-video.png diff --git a/admin/scss/_icons.scss b/admin/scss/_icons.scss index 83beeff8..1992149d 100644 --- a/admin/scss/_icons.scss +++ b/admin/scss/_icons.scss @@ -1,18 +1,47 @@ /** * icons */ +$sprites: sprite-map("icons/*.png"); +$sprites-retina: sprite-map("icons-2x/*.png"); + +@mixin sprite-background($name) { + // background-image: sprite-url($sprites); + background-position: sprite-position($sprites, $name); + // background-repeat: no-repeat; + // display: block; + // height: image-height(sprite-file($sprites, $name)); + // width: image-width(sprite-file($sprites, $name)); + @media + (-webkit-min-device-pixel-ratio: 2), + (min-resolution: 192dpi) { + // Workaround for https://gist.github.com/2140082 + @if (sprite-position($sprites, $name) != sprite-position($sprites-retina, $name)) { + $ypos: round(nth(sprite-position($sprites-retina, $name), 2) / 2); + background-position: 0 $ypos; + } + // Hard coded width of the normal sprite image. There must be a smarter way to do this. + // @include background-size(auto 256px); + // background-image: sprite-url($sprites-retina); + } +} -$icons: sprite-map("icons/*.png"); -$icons-2x: sprite-map("icons-2x/*.png"); %i-base { display: inline-block; vertical-align: text-bottom; - background: $icons no-repeat; text-indent: -9999em; + background-image: sprite-url($sprites); + background-repeat: no-repeat; &:hover { @include opacity(0.75); } + @media + (-webkit-min-device-pixel-ratio: 2), + (min-resolution: 192dpi) { + // Hard coded width of the normal sprite image. There must be a smarter way to do this. + @include background-size(auto 256px); + background-image: sprite-url($sprites-retina); + } } %i-16 { @@ -29,11 +58,11 @@ $icons-2x: sprite-map("icons-2x/*.png"); .i-edit { @extend %i-16; - background-position: sprite-position($icons, icon-edit); + @include sprite-background(icon-edit); } .i-delete { @extend %i-16; - background-position: sprite-position($icons, icon-delete); + @include sprite-background(icon-delete); } @@ -41,12 +70,12 @@ $icons-2x: sprite-map("icons-2x/*.png"); .i-upload { @extend %i-24; - background-position: sprite-position($icons, icon-upload); + @include sprite-background(icon-upload); } .i-upload-active { @extend %i-24; - background-position: sprite-position($icons, icon-upload-active); + @include sprite-background(icon-upload-active); } // 小箭头 @@ -71,7 +100,7 @@ $icons-2x: sprite-map("icons-2x/*.png"); .i-exlink { @extend %i-16; - background-position: sprite-position($icons, icon-exlink); + @include sprite-background(icon-exlink); } @@ -79,52 +108,52 @@ $icons-2x: sprite-map("icons-2x/*.png"); .mime-office { @extend %i-16; - background-position: sprite-position($icons, mime-office); + @include sprite-background(mime-office); } .mime-text { @extend %i-16; - background-position: sprite-position($icons, mime-text); + @include sprite-background(mime-text); } .mime-image { @extend %i-16; - background-position: sprite-position($icons, mime-image); + @include sprite-background(mime-image); } .mime-html { @extend %i-16; - background-position: sprite-position($icons, mime-html); + @include sprite-background(mime-html); } .mime-archive { @extend %i-16; - background-position: sprite-position($icons, mime-archive); + @include sprite-background(mime-archive); } .mime-application { @extend %i-16; - background-position: sprite-position($icons, mime-application); + @include sprite-background(mime-application); } .mime-audio { @extend %i-16; - background-position: sprite-position($icons, mime-audio); + @include sprite-background(mime-audio); } .mime-script { @extend %i-16; - background-position: sprite-position($icons, mime-script); + @include sprite-background(mime-script); } .mime-video { @extend %i-16; - background-position: sprite-position($icons, mime-video); + @include sprite-background(mime-video); } .mime-unknow { @extend %i-16; - background-position: sprite-position($icons, mime-unknow); + @include sprite-background(mime-unknow); } diff --git a/admin/scss/components/_editor.scss b/admin/scss/components/_editor.scss index 96adabec..2d9b68f4 100644 --- a/admin/scss/components/_editor.scss +++ b/admin/scss/components/_editor.scss @@ -45,7 +45,7 @@ (min-resolution: 192dpi) { #wmd-button-row span { background-image: url(../img/editor@2x.png); - @include background-size(320px 60px); + @include background-size(320px auto); } }