Authored by unknown

guang detail iconfont modify

@@ -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">&#xe626;</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">&#xe616;</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">&#xe624;</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}}
@@ -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="&#xe623;" horiz-adv-x="1000" 122 <glyph glyph-name="uniE623" unicode="&#xe623;" 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="&#xe624;" 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="&#xe625;" 127 <glyph glyph-name="uniE625" unicode="&#xe625;"
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" />
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