guang detail iconfont modify
Showing
12 changed files
with
32 additions
and
32 deletions
@@ -119,13 +119,13 @@ | @@ -119,13 +119,13 @@ | ||
119 | <ul class="clearfix"> | 119 | <ul class="clearfix"> |
120 | <li id="prise-btn" class="like-status{{#isLike}} liked{{/isLike}}"> | 120 | <li id="prise-btn" class="like-status{{#isLike}} liked{{/isLike}}"> |
121 | <a href="javascript:;"> | 121 | <a href="javascript:;"> |
122 | - <i></i> | 122 | + <i class="iconfont"></i> |
123 | <span class="like-num">{{likeNum}}</span> | 123 | <span class="like-num">{{likeNum}}</span> |
124 | </a> | 124 | </a> |
125 | </li> | 125 | </li> |
126 | <li id="collect-btn" class="sort-collect{{#isCollected}} collected{{/isCollected}}"> | 126 | <li id="collect-btn" class="sort-collect{{#isCollected}} collected{{/isCollected}}"> |
127 | <a href="javascript:;"> | 127 | <a href="javascript:;"> |
128 | - <i></i> | 128 | + <i class="iconfont"></i> |
129 | <span>收藏</span> | 129 | <span>收藏</span> |
130 | <span class="cancel-collect">取消收藏</span> | 130 | <span class="cancel-collect">取消收藏</span> |
131 | </a> | 131 | </a> |
@@ -135,7 +135,8 @@ | @@ -135,7 +135,8 @@ | ||
135 | {{/ userInfo}} | 135 | {{/ userInfo}} |
136 | <div class="article-bottom-info clearfix"> | 136 | <div class="article-bottom-info clearfix"> |
137 | {{#if tag}} | 137 | {{#if tag}} |
138 | - <div class="article-tag"> | 138 | + <div class="article-tag clearfix"> |
139 | + <i class="tag-icon iconfont"></i> | ||
139 | <ul class="clearfix"> | 140 | <ul class="clearfix"> |
140 | {{# tag}} | 141 | {{# tag}} |
141 | <li> | 142 | <li> |
@@ -220,4 +221,4 @@ | @@ -220,4 +221,4 @@ | ||
220 | </div> | 221 | </div> |
221 | {{/ detail}} | 222 | {{/ detail}} |
222 | 223 | ||
223 | -{{> layout/footer}} | ||
224 | +{{> layout/footer}} |
No preview for this file type
@@ -2,7 +2,7 @@ | @@ -2,7 +2,7 @@ | ||
2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" > | 2 | <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" > |
3 | <svg xmlns="http://www.w3.org/2000/svg"> | 3 | <svg xmlns="http://www.w3.org/2000/svg"> |
4 | <metadata> | 4 | <metadata> |
5 | -Created by FontForge 20120731 at Tue Dec 15 13:44:11 2015 | 5 | +Created by FontForge 20120731 at Wed Dec 16 11:17:36 2015 |
6 | By Ads | 6 | By Ads |
7 | </metadata> | 7 | </metadata> |
8 | <defs> | 8 | <defs> |
@@ -121,6 +121,9 @@ d="M384 556v-513l321 257z" /> | @@ -121,6 +121,9 @@ d="M384 556v-513l321 257z" /> | ||
121 | d="M662 566v-499l-299 250zM662 566z" /> | 121 | d="M662 566v-499l-299 250zM662 566z" /> |
122 | <glyph glyph-name="uniE623" unicode="" horiz-adv-x="1000" | 122 | <glyph glyph-name="uniE623" unicode="" horiz-adv-x="1000" |
123 | d="M744 502h-488q-25 0 -46 -12t-33 -33t-12 -46v-290q0 -38 26.5 -64.5t64.5 -26.5h227l200 -138v138h61q38 0 64.5 26.5t26.5 64.5v290q0 15 -4.5 29t-13 25t-19.5 19.5t-25 13t-29 4.5zM744 262z" /> | 123 | d="M744 502h-488q-25 0 -46 -12t-33 -33t-12 -46v-290q0 -38 26.5 -64.5t64.5 -26.5h227l200 -138v138h61q38 0 64.5 26.5t26.5 64.5v290q0 15 -4.5 29t-13 25t-19.5 19.5t-25 13t-29 4.5zM744 262z" /> |
124 | + <glyph glyph-name="uniE624" unicode="" horiz-adv-x="1025" | ||
125 | +d="M1024 396v338q0 32 -23 55t-55 23h-331h-14q-55 0 -76 -21l-506 -506q-19 -19 -19 -46t19 -45l387 -387q18 -19 45 -19t46 19l506 506q10 10 15 25.5t5.5 26.5t0.5 31zM764 465q-36 0 -61.5 25.5t-25.5 61.5q0 17 7 33t18.5 28t27.5 18.5t34 6.5q36 0 61 -25t25 -61 | ||
126 | +t-25 -61.5t-61 -25.5z" /> | ||
124 | <glyph glyph-name="uniE625" unicode="" | 127 | <glyph glyph-name="uniE625" unicode="" |
125 | d="M511 748q-91 0 -173.5 -35.5t-142 -95t-95 -142t-35.5 -173.5q0 -61 16 -118.5t45 -106.5t70 -90t90 -70t106.5 -45t118.5 -16q91 0 173.5 35.5t142.5 95t95 142t35 173.5q0 185 -130.5 315.5t-315.5 130.5zM734 253h-237q-7 0 -14 3q-22 9 -22 33v237q0 10 5 18.5 | 128 | d="M511 748q-91 0 -173.5 -35.5t-142 -95t-95 -142t-35.5 -173.5q0 -61 16 -118.5t45 -106.5t70 -90t90 -70t106.5 -45t118.5 -16q91 0 173.5 35.5t142.5 95t95 142t35 173.5q0 185 -130.5 315.5t-315.5 130.5zM734 253h-237q-7 0 -14 3q-22 9 -22 33v237q0 10 5 18.5 |
126 | t13 13.5t18 5q8 0 14.5 -3t11.5 -8t8 -11.5t3 -14.5v-200h200q10 0 18.5 -5t13.5 -13.5t5 -18.5t-5 -18t-13.5 -13t-18.5 -5zM734 253z" /> | 129 | t13 13.5t18 5q8 0 14.5 -3t11.5 -8t8 -11.5t3 -14.5v-200h200q10 0 18.5 -5t13.5 -13.5t5 -18.5t-5 -18t-13.5 -13t-18.5 -5zM734 253z" /> |
No preview for this file type
No preview for this file type
1.22 KB
1.13 KB
1.18 KB
1.12 KB
1.13 KB
1.16 KB
1 | -$icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | ||
2 | - | ||
3 | -/**/ | ||
4 | .guang-detail-page { | 1 | .guang-detail-page { |
5 | width: 1150px; | 2 | width: 1150px; |
6 | margin: 0 auto 95px; | 3 | margin: 0 auto 95px; |
@@ -146,33 +143,27 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | @@ -146,33 +143,27 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | ||
146 | height: 36px; | 143 | height: 36px; |
147 | line-height: 36px; | 144 | line-height: 36px; |
148 | color: #535353; | 145 | color: #535353; |
149 | - font-size: 14px; | 146 | + font-size: 0; |
150 | background: #efefef; | 147 | background: #efefef; |
151 | text-align: left; | 148 | text-align: left; |
152 | - i { | ||
153 | - position: absolute; | ||
154 | - top: 50%; | ||
155 | - left: 8px; | ||
156 | - width: 20px; | ||
157 | - height: 20px; | ||
158 | - margin-top: -10px; | 149 | + i, span{ |
150 | + @include inline-block; | ||
151 | + font-style: normal; | ||
152 | + font-size: 14px; | ||
159 | } | 153 | } |
160 | - span { | ||
161 | - margin-left: 30px; | 154 | + i { |
155 | + margin: 0 5px 0 0; | ||
156 | + @include opacity(0.5); | ||
157 | + font-size: 18px; | ||
162 | } | 158 | } |
163 | .cancel-collect { | 159 | .cancel-collect { |
164 | display: none; | 160 | display: none; |
165 | } | 161 | } |
166 | } | 162 | } |
167 | } | 163 | } |
168 | - .like-status a { | ||
169 | - i { | ||
170 | - background: sprite($icons, like); | ||
171 | - } | ||
172 | - } | ||
173 | .like-status.liked i, | 164 | .like-status.liked i, |
174 | .like-status.hover i{ | 165 | .like-status.hover i{ |
175 | - background: sprite($icons, like-click); | 166 | + @include opacity(1); |
176 | } | 167 | } |
177 | .like-statis.hover .like-num { | 168 | .like-statis.hover .like-num { |
178 | color: #000; | 169 | color: #000; |
@@ -180,12 +171,12 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | @@ -180,12 +171,12 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | ||
180 | .sort-collect a { | 171 | .sort-collect a { |
181 | i { | 172 | i { |
182 | width: 21px; | 173 | width: 21px; |
183 | - background: sprite($icons, collect); | 174 | + |
184 | } | 175 | } |
185 | } | 176 | } |
186 | .sort-collect.collected a { | 177 | .sort-collect.collected a { |
187 | i { | 178 | i { |
188 | - background: sprite($icons, collect-click); | 179 | + @include opacity(1); |
189 | } | 180 | } |
190 | span { | 181 | span { |
191 | display: none; | 182 | display: none; |
@@ -195,7 +186,7 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | @@ -195,7 +186,7 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | ||
195 | } | 186 | } |
196 | } | 187 | } |
197 | .sort-collect.hover i { | 188 | .sort-collect.hover i { |
198 | - background: sprite($icons, collect-click); | 189 | + @include opacity(1); |
199 | } | 190 | } |
200 | .sort-collect.hover span { | 191 | .sort-collect.hover span { |
201 | color: #000; | 192 | color: #000; |
@@ -211,11 +202,16 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | @@ -211,11 +202,16 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | ||
211 | 202 | ||
212 | .article-tag { | 203 | .article-tag { |
213 | float: left; | 204 | float: left; |
214 | - background: sprite($icons, tag); | ||
215 | - background-repeat: no-repeat; | ||
216 | - padding-left: 32px; | ||
217 | - max-width: 555px; | 205 | + width: 588px; |
206 | + .tag-icon { | ||
207 | + float: left; | ||
208 | + margin: 0 12px 0 0; | ||
209 | + font-size: 20px; | ||
210 | + font-style: normal; | ||
211 | + } | ||
218 | ul { | 212 | ul { |
213 | + float: left; | ||
214 | + max-width: 555px; | ||
219 | li { | 215 | li { |
220 | float: left; | 216 | float: left; |
221 | margin: 0 10px 10px 0; | 217 | margin: 0 10px 10px 0; |
@@ -361,7 +357,7 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | @@ -361,7 +357,7 @@ $icons: sprite-map("guang/detail/icons/*.png", $spacing: 5px); | ||
361 | height: 7px; | 357 | height: 7px; |
362 | left: 30px; | 358 | left: 30px; |
363 | bottom: -7px; | 359 | bottom: -7px; |
364 | - background: image-url('detail/comment-icon.png') no-repeat; | 360 | + background: image-url('guang/detail/comment-icon.png') no-repeat; |
365 | } | 361 | } |
366 | } | 362 | } |
367 | 363 |
-
Please register or login to post a comment