fe / yohoblk-wap · Commits

Go to a project

Authored by 郭成尧
Commit 25c1fd4fe75568e80142dc89bc566d34aac67ebe 1 parent eb8549db

brand-iconfont

Inline Side-by-side
Showing 9 changed files with 110 additions and 73 deletions
@@ -28,7 +28,9 @@ const handleBrandList = origin => { @@ -28,7 +28,9 @@ const handleBrandList = origin => {
28 _.forEach(value, (subValue) => { 28 _.forEach(value, (subValue) => {
29 brands.push({ 29 brands.push({
30 name: subValue.brand_name, 30 name: subValue.brand_name,
31 - link: helpers.urlFormat('', null, subValue.brand_domain), 31 +
  32 + // link: helpers.urlFormat('/brand', {domain: subValue.brand_domain}),
  33 + link: '/brand?domain=' + subValue.brand_domain,
32 logo: subValue.brand_ico 34 logo: subValue.brand_ico
33 }); 35 });
34 }); 36 });
No preview for this file type
1 <?xml version="1.0" standalone="no"?> 1 <?xml version="1.0" standalone="no"?>
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>Generated by IcoMoon</metadata> 4 +<metadata>
  5 +Created by FontForge 20120731 at Fri Jul 22 16:52:28 2016
  6 + By admin
  7 +</metadata>
5 <defs> 8 <defs>
6 -<font id="iconfont" horiz-adv-x="1024">  
7 -<font-face units-per-em="1024" ascent="896" descent="-128" />  
8 -<missing-glyph horiz-adv-x="1024" />  
9 -<glyph unicode="&#x20;" horiz-adv-x="0" d="" />  
10 -<glyph unicode="&#xe600;" glyph-name="delete" d="M911 809h-242v123q0 21-13.5 34.5t-34.5 13.5h-246q-20 0-33.5-13.5t-13.5-34.5v-123h-246q-21 0-34.5-13.5t-13.5-34 13.5-34 34.5-13.5h829q21 0 34.5 13.5t13.5 34-13.5 34-34.5 13.5zM423 809v72h147v-72h-147zM765 663q-21 0-34.5-14t-13.5-34v-560h-441v560q0 20-13.5 34t-34 14-34-14-13.5-34v-611q0-21 13.5-34.5t34.5-13.5h536q20 0 33.5 13.5t13.5 34.5v611q3 20-11.5 34t-35.5 14zM447 151v389q0 20-13.5 33.5t-34 13.5-34-13.5-13.5-33.5v-389q0-21 13.5-34.5t34-13.5 34 13.5 13.5 34.5zM645 151v389q0 20-13.5 33.5t-34.5 13.5q-20 0-35.5-13.5t-15.5-33.5v-389q0-21 13.5-34.5t34.5-13.5 36 13.5 15 34.5z" />  
11 -<glyph unicode="&#xe601;" glyph-name="bag" d="M512 896q43 0 82.5-17t68-45.5 45.5-68 17-82.5v-43h171v-640q0-53-37.5-90.5t-90.5-37.5h-512q-53 0-90.5 37.5t-37.5 90.5v640h171v43q0 43 17 82.5t45.5 68 68 45.5 82.5 17zM811 0v555h-598v-555q0-18 12.5-30.5t30.5-12.5h512q18 0 30.5 12.5t12.5 30.5zM512 811q-53 0-90.5-37.5t-37.5-90.5v-43h256v43q0 53-37.5 90.5t-90.5 37.5z" />  
12 -<glyph unicode="&#xe602;" glyph-name="down" d="M516 340l409 404q2 1 6 6t7 8 8 7 9 5.5 8.5 2 8.5-2.5l38-21q7-7 7.5-17.5t-6.5-17.5l-476-471q-7-8-17.5-8t-17.5 7zM531 242q-8-7-18.5-7t-17.5 8l-475 471q-7 7-7 17.5t7 17.5l38 21q4 3 8.5 2.5t8.5-2 9-5.5 8-7 7-8 6-6l415-407z" />  
13 -<glyph unicode="&#xe603;" glyph-name="check" d="M998.5 808.5q-12.5 11.5-29.5 11t-29-12.5l-552-588-302 297q-12 12-29.5 12t-29.5-12.5-12-29.5 13-29l332-327v-1q2-1 9-5 1-1 2.5-2t2.5-1q7-3 15-3t16 3q1 1 3 2l1 1q7 5 9 6l1 1 581 619q12 13 11.5 30t-13 28.5z" />  
14 -<glyph unicode="&#xe605;" glyph-name="close" d="M512 499l360 360 45-45-360-360 360-359-45-45-360 359-360-359-45 45 360 359-360 360 45 45z" />  
15 -<glyph unicode="&#xe606;" glyph-name="left" d="M245 468l-9 9 472 472 80-80-400-401 400-401-80-80-472 472z" />  
16 -<glyph unicode="&#xe607;" glyph-name="right" d="M785 468l13 13-488 487-84-84 416-416-416-416 84-84 488 487z" />  
17 -<glyph unicode="&#xe608;" glyph-name="search" d="M682 158q-108-89-249-89-107 0-197.5 53t-143.5 143.5-53 197.5 53 197.5 143.5 143.5 197.5 53 197.5-53 143.5-143.5 53-197.5q0-141-89-249l286-286-56-56zM433.5 148q130.5 0 222.5 92t92 222.5-92 223-222.5 92.5-223-92.5-92.5-223 92.5-222.5 223-92z" />  
18 -<glyph unicode="&#xe609;" glyph-name="print" horiz-adv-x="1001" d="M281 627q-27-1-53-1h-83q-18 0-36.5-6t-32.5-18.5-23-32-9-45.5v-76h912v41q0 16-0.5 30t-0.5 18q0 13-5 29t-17 29.5-31.5 22.5-49.5 9h-133v-97h-438v97zM955 394v-52q0-23 0.5-52t0.5-58-10.5-47.5-26-30-33-16-31.5-4.5q-14-1-29.5-0.5t-29.5 0.5h-32l-45 128h-439l-44-128h-63q-20 0-45 1-25 0-41 9.5t-25.5 23-13.5 29.5-4 30v167h911zM163 331q-12 0-21-8.5t-9-21.5 9-21.5 21-8.5q13 0 22 8.5t9 21.5-9 21.5-22 8.5zM316 207q-8-26-14-48-5-19-10.5-37t-7.5-25-3-15 1-14.5 9.5-10.5 21.5-4h365q23 0 34 12t2 38q-5 13-9.5 30.5t-9.5 34.5q-5 19-11 39h-368zM336 582v228q0 11 2.5 23t10 21.5 20.5 15.5 34 6h188q31 0 51.5-14.5t20.5-52.5v-227h-327z" />  
19 -<glyph unicode="&#xe60d;" glyph-name="love" d="M734 944q-65 0-123.5-31t-99.5-85q-41 54-99.5 85t-124.5 31q-118 0-202.5-92t-84.5-222q0-37 7-70.5t21.5-65 25-50 29.5-48.5q31-48 82.5-105.5t98-101.5 100-90 75-63.5 35.5-28.5q17-13 37-13t37 13q13 11 35 28.5t75.5 63.5 100 90 98 101.5 81.5 105.5q19 30 29.5 48.5t25.5 50 22 65 7 70.5q0 130-84.5 222t-203.5 92zM886 436q-29-45-78-100t-98.5-101-95.5-85.5-74-62.5l-29-23q-11 9-30 24t-71.5 60-98 88-96 99-79.5 101q-24 37-37 60.5t-24 60-11 73.5q0 101 65.5 172.5t157.5 71.5q68 0 123-40t82-105v0q4-15 19-15t19 15q27 65 82 105t122 40q93 0 158.5-71.5t65.5-172.5q0-37-11.5-73.5t-24-60-36.5-60.5z" />  
20 -<glyph unicode="&#xe617;" glyph-name="up" d="M24 178l22-22q9-10 22-10t23 10l424 430 420-426q9-9 21.5-9t21.5 9l22 22q9 9 9 22t-9 23l-458 464q-5 5-12 7-9 7-20.5 6t-20.5-9l-465-472q-9-9-9-22t9-23z" />  
21 -<glyph unicode="&#xe900;" glyph-name="sort-asc" horiz-adv-x="585" d="M585.143 475.428q0-14.857-10.857-25.714t-25.714-10.857h-512q-14.857 0-25.714 10.857t-10.857 25.714 10.857 25.714l256 256q10.857 10.857 25.714 10.857t25.714-10.857l256-256q10.857-10.857 10.857-25.714z" />  
22 -<glyph unicode="&#xe901;" glyph-name="sort-desc" horiz-adv-x="585" d="M585.143 256q0-14.857-10.857-25.714l-256-256q-10.857-10.857-25.714-10.857t-25.714 10.857l-256 256q-10.857 10.857-10.857 25.714t10.857 25.714 25.714 10.857h512q14.857 0 25.714-10.857t10.857-25.714z" />  
23 -</font></defs></svg>  
  9 +<font id="iconfont" horiz-adv-x="1024" >
  10 + <font-face
  11 + font-family="iconfont"
  12 + font-weight="500"
  13 + font-stretch="normal"
  14 + units-per-em="1024"
  15 + panose-1="2 0 6 3 0 0 0 0 0 0"
  16 + ascent="896"
  17 + descent="-128"
  18 + x-height="792"
  19 + bbox="13 -221.6 1457 896"
  20 + underline-thickness="50"
  21 + underline-position="-100"
  22 + unicode-range="U+0078-E617"
  23 + />
  24 +<missing-glyph horiz-adv-x="374"
  25 +d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
  26 + <glyph glyph-name=".notdef" horiz-adv-x="374"
  27 +d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
  28 + <glyph glyph-name=".null" horiz-adv-x="0"
  29 + />
  30 + <glyph glyph-name="nonmarkingreturn" horiz-adv-x="341"
  31 + />
  32 + <glyph glyph-name="x" unicode="x" horiz-adv-x="1001"
  33 +d="M281 543q-27 -1 -53 -1h-83q-18 0 -36.5 -6t-32.5 -18.5t-23 -32t-9 -45.5v-76h912v41q0 16 -0.5 30t-0.5 18q0 13 -5 29t-17 29.5t-31.5 22.5t-49.5 9h-133v-97h-438v97zM955 310v-52q0 -23 0.5 -52t0.5 -58t-10.5 -47.5t-26 -30t-33 -16t-31.5 -4.5q-14 -1 -29.5 -0.5
  34 +t-29.5 0.5h-32l-45 128h-439l-44 -128h-29h-34q-20 0 -45 1q-25 0 -41 9.5t-25.5 23t-13.5 29.5t-4 30v167h911zM163 247q-12 0 -21 -8.5t-9 -21.5t9 -21.5t21 -8.5q13 0 22 8.5t9 21.5t-9 21.5t-22 8.5zM316 123q-8 -26 -14 -48q-5 -19 -10.5 -37t-7.5 -25t-3 -15t1 -14.5
  35 +t9.5 -10.5t21.5 -4h37h67h81h80h64h36q23 0 34 12t2 38q-5 13 -9.5 30.5t-9.5 34.5q-5 19 -11 39h-368zM336 498v228q0 11 2.5 23t10 21.5t20.5 15.5t34 6h188q31 0 51.5 -14.5t20.5 -52.5v-227h-327z" />
  36 + <glyph glyph-name="uniE600" unicode="&#xe600;"
  37 +d="M911 725h-242v123q0 21 -13.5 34.5t-34.5 13.5h-246q-20 0 -33.5 -13.5t-13.5 -34.5v-123h-246q-21 0 -34.5 -13.5t-13.5 -34t13.5 -34t34.5 -13.5h829q21 0 34.5 13.5t13.5 34t-13.5 34t-34.5 13.5zM423 725v72h147v-72h-147zM765 579q-21 0 -34.5 -14t-13.5 -34v-560
  38 +h-441v560q0 20 -13.5 34t-34 14t-34 -14t-13.5 -34v-611q0 -21 13.5 -34.5t34.5 -13.5h536q20 0 33.5 13.5t13.5 34.5v611q3 20 -11.5 34t-35.5 14zM447 67v389q0 20 -13.5 33.5t-34 13.5t-34 -13.5t-13.5 -33.5v-389q0 -21 13.5 -34.5t34 -13.5t34 13.5t13.5 34.5zM645 67
  39 +v389q0 20 -13.5 33.5t-34.5 13.5q-20 0 -35.5 -13.5t-15.5 -33.5v-389q0 -21 13.5 -34.5t34.5 -13.5t36 13.5t15 34.5z" />
  40 + <glyph glyph-name="uniE601" unicode="&#xe601;"
  41 +d="M512 812q43 0 82.5 -17t68 -45.5t45.5 -68t17 -82.5v-43h171v-640q0 -53 -37.5 -90.5t-90.5 -37.5h-512q-53 0 -90.5 37.5t-37.5 90.5v640h171v43q0 43 17 82.5t45.5 68t68 45.5t82.5 17zM811 -84v555h-598v-555q0 -18 12.5 -30.5t30.5 -12.5h512q18 0 30.5 12.5
  42 +t12.5 30.5zM512 727q-53 0 -90.5 -37.5t-37.5 -90.5v-43h256v43q0 53 -37.5 90.5t-90.5 37.5z" />
  43 + <glyph glyph-name="uniE602" unicode="&#xe602;"
  44 +d="M516 256l409 404q2 1 6 6t7 8t8 7t9 5.5t8.5 2t8.5 -2.5l38 -21q7 -7 7.5 -17.5t-6.5 -17.5l-476 -471q-7 -8 -17.5 -8t-17.5 7zM86 669zM531 158q-8 -7 -18.5 -7t-17.5 8l-475 471q-7 7 -7 17.5t7 17.5l38 21q4 3 8.5 2.5t8.5 -2t9 -5.5t8 -7t7 -8t6 -6l415 -407z
  45 +M945 669z" />
  46 + <glyph glyph-name="uniE603" unicode="&#xe603;"
  47 +d="M998.5 724.5q-12.5 11.5 -29.5 11t-29 -12.5l-552 -588l-302 297q-12 12 -29.5 12t-29.5 -12.5t-12 -29.5t13 -29l332 -327v-1q2 -1 9 -5q1 -1 2.5 -2t2.5 -1q7 -3 15 -3t16 3q1 1 3 2l1 1q7 5 9 6l1 1l581 619q12 13 11.5 30t-13 28.5z" />
  48 + <glyph glyph-name="uniE604" unicode="&#xe604;"
  49 +d="M887 653q-19 24 -31 33l-4 4l-4 4q-53 51 -126 51q-103 0 -211 -106q-107 106 -210 106q-74 0 -126 -51l-5 -4l-3 -4q-12 -9 -31 -33q-74 -93 -60 -191q7 -48 33.5 -98.5t61.5 -92t80 -82.5t84 -70t77.5 -54.5t57.5 -36.5t28 -15l13 -7l14 7q8 4 27 15t58 36.5t78 54.5
  50 +t84 70t80 82.5t61.5 92t33.5 98.5q14 98 -60 191zM893 470q-7 -52 -43.5 -109t-81.5 -101t-100 -86.5t-91.5 -66t-65.5 -38.5q-28 15 -64.5 38.5t-92 66t-100 86.5t-81 101t-43.5 109q-13 92 75 176q4 5 11.5 12.5t32 20t52.5 12.5q87 0 189 -111l21 -23l22 23
  51 +q102 111 189 111q27 0 52 -12.5t32.5 -20t11.5 -12.5q88 -84 75 -176z" />
  52 + <glyph glyph-name="uniE605" unicode="&#xe605;"
  53 +d="M512 415l360 360l45 -45l-360 -360l360 -359l-45 -45l-360 359l-360 -359l-45 45l360 359l-360 360l45 45z" />
  54 + <glyph glyph-name="uniE606" unicode="&#xe606;"
  55 +d="M245 384l-9 9l472 472l80 -80l-400 -401l400 -401l-80 -80l-472 472z" />
  56 + <glyph glyph-name="uniE607" unicode="&#xe607;"
  57 +d="M785 384l13 13l-488 487l-84 -84l416 -416l-416 -416l84 -84l488 487z" />
  58 + <glyph glyph-name="uniE608" unicode="&#xe608;"
  59 +d="M682 74q-108 -89 -249 -89q-107 0 -197.5 53t-143.5 143.5t-53 197.5t53 197.5t143.5 143.5t197.5 53t197.5 -53t143.5 -143.5t53 -197.5q0 -141 -89 -249l286 -286l-56 -56zM433.5 64q130.5 0 222.5 92t92 222.5t-92 223t-222.5 92.5t-223 -92.5t-92.5 -223t92.5 -222.5
  60 +t223 -92z" />
  61 + <glyph glyph-name="uniE609" unicode="&#xe609;"
  62 +d="M513 17q-15 0 -121 93t-168 161q-37 40 -64 95.5t-27 99.5q0 97 61.5 166.5t149.5 69.5q49 0 93 -34.5t76 -86.5q31 52 75 86.5t93 34.5q88 0 150 -69.5t62 -166.5q0 -47 -27 -104t-65 -92q-20 -18 -61.5 -57t-74 -68.5t-67 -61t-57 -49t-28.5 -17.5z" />
  63 + <glyph glyph-name="uniE60A" unicode="&#xe60a;" horiz-adv-x="1463"
  64 +d="M798 -160q0 -46 25 -58t61 16l537 420q36 28 36 68t-36 68l-537 424q-36 29 -61 16.5t-25 -57.5v-238q-138 0 -252.5 -24.5t-192 -63t-137.5 -94t-94.5 -109.5t-57.5 -117t-31.5 -109.5t-11 -94t-1.5 -63.5t2 -25q47 62 87 104t90 78t103.5 57.5t127 36.5t161.5 21t207 6
  65 +v-262z" />
  66 + <glyph glyph-name="uniE617" unicode="&#xe617;"
  67 +d="M24 94l22 -22q9 -10 22 -10t23 10l424 430l420 -426q9 -9 21.5 -9t21.5 9l22 22q9 9 9 22t-9 23l-458 464q-5 5 -12 7q-9 7 -20.5 6t-20.5 -9l-465 -472q-9 -9 -9 -22t9 -23z" />
  68 + </font>
  69 +</defs></svg>
No preview for this file type
No preview for this file type
@@ -21,55 +21,50 @@ @@ -21,55 +21,50 @@
21 -moz-osx-font-smoothing: grayscale; 21 -moz-osx-font-smoothing: grayscale;
22 } 22 }
23 23
24 -.icon-sort-asc:before {  
25 - content: "\e900";  
26 -}  
27 -  
28 -.icon-sort-desc:before {  
29 - content: "\e901";  
30 -}  
31 -  
32 -.icon-print:before {  
33 - content: "\e609";  
34 -}  
35 -  
36 -.icon-delete:before {  
37 - content: "\e600";  
38 -}  
39 -  
40 -.icon-bag:before { 24 +.icon-bag: before {
41 content: "\e601"; 25 content: "\e601";
42 } 26 }
43 27
44 -.icon-down:before {  
45 - content: "\e602"; 28 +.icon-check: before {
  29 + content: "\e603";
46 } 30 }
47 31
48 -.icon-check:before {  
49 - content: "\e603"; 32 +.icon-yoho-share: before {
  33 + content: "\e60a";
50 } 34 }
51 35
52 -.icon-close:before { 36 +.icon-close: before {
53 content: "\e605"; 37 content: "\e605";
54 } 38 }
55 39
56 -.icon-left:before { 40 +.icon-left: before {
57 content: "\e606"; 41 content: "\e606";
58 } 42 }
59 43
60 -.icon-right:before { 44 +.icon-right: before {
61 content: "\e607"; 45 content: "\e607";
62 } 46 }
63 47
64 -.icon-search:before { 48 +.icon-search: before {
65 content: "\e608"; 49 content: "\e608";
66 } 50 }
67 51
68 -.icon-love:before {  
69 - content: "\e60d"; 52 +.icon-down: before {
  53 + content: "\e602";
70 } 54 }
71 55
72 -.icon-up:before { 56 +.icon-up: before {
73 content: "\e617"; 57 content: "\e617";
74 } 58 }
75 59
  60 +.icon-delete: before {
  61 + content: "\e600";
  62 +}
  63 +
  64 +.icon-love: before {
  65 + content: "\e604";
  66 +}
  67 +
  68 +.icon-love-solid: before {
  69 + content: "\e609";
  70 +}
@@ -7,6 +7,7 @@ @@ -7,6 +7,7 @@
7 <div class="arrow">i</div> 7 <div class="arrow">i</div>
8 <img v-lazy="brandBg | resize 752 365"> 8 <img v-lazy="brandBg | resize 752 365">
9 </div> 9 </div>
  10 + <share-bottom></share-bottom>
10 </template> 11 </template>
11 <style> 12 <style>
12 .brand-share { 13 .brand-share {
@@ -53,6 +54,7 @@ @@ -53,6 +54,7 @@
53 </style> 54 </style>
54 <script> 55 <script>
55 const brandShopTop = require('channel/brand-shop-top.vue'); 56 const brandShopTop = require('channel/brand-shop-top.vue');
  57 + const shareBottom = require('channel/share-bottom.vue');
56 58
57 module.exports = { 59 module.exports = {
58 data() { 60 data() {
@@ -64,7 +66,8 @@ @@ -64,7 +66,8 @@
64 }; 66 };
65 }, 67 },
66 components: { 68 components: {
67 - brandShopTop 69 + brandShopTop,
  70 + shareBottom
68 } 71 }
69 }; 72 };
70 </script> 73 </script>
@@ -6,8 +6,8 @@ @@ -6,8 +6,8 @@
6 <hr> 6 <hr>
7 <div v-show="showMore" transition="brand-intro" v-bind:class="{ 'brand-short': !showMore }">{{ brandIntro.brandIntro }}</div> 7 <div v-show="showMore" transition="brand-intro" v-bind:class="{ 'brand-short': !showMore }">{{ brandIntro.brandIntro }}</div>
8 </div> 8 </div>
9 - <div v-if="!showMore" class="showmore expand" @click="introTrans()"></div>  
10 - <div v-else class="showmore collapse" @click="introTrans()"></div> 9 + <div v-if="!showMore" class="showmore expand" @click="introTrans()"><span class="icon">&#xe602;</span></div>
  10 + <div v-else class="showmore collapse" @click="introTrans()"><span class="icon">&#xe617;</span></div>
11 </div> 11 </div>
12 </template> 12 </template>
13 <style> 13 <style>
@@ -68,16 +68,9 @@ @@ -68,16 +68,9 @@
68 width: 60px; 68 width: 60px;
69 height: 60px; 69 height: 60px;
70 position: absolute; 70 position: absolute;
71 - bottom: 20px; 71 + bottom: 10px;
72 right: 30px; 72 right: 30px;
73 - }  
74 -  
75 - .expand {  
76 - background: url("/channel/expand.png") no-repeat;  
77 - }  
78 -  
79 - .collapse {  
80 - background: url("/channel/collapse.png") no-repeat; 73 + font-size: 32px;
81 } 74 }
82 } 75 }
83 </style> 76 </style>
1 <template> 1 <template>
2 <div class="top-box clearfix"> 2 <div class="top-box clearfix">
3 - <i class="back" @click="goBack()"></i> 3 + <span class="icon back" @click="goBack()">&#xe606;</span>
4 <div class="right"> 4 <div class="right">
5 - <i class="favorite"></i>  
6 - <i class="share" @click="goShare()"></i>  
7 - <i class="filter"></i> 5 + <span class="icon favorite">&#xe609;</span>
  6 + <span class="icon share" @click="goShare()">&#xe60a;</span>
  7 + <span class="icon filter"></span>
8 </div> 8 </div>
9 </div> 9 </div>
10 </template> 10 </template>
@@ -17,35 +17,33 @@ @@ -17,35 +17,33 @@
17 top: 60px; 17 top: 60px;
18 left: 0; 18 left: 0;
19 z-index: 99; 19 z-index: 99;
  20 + color: #fff;
20 21
21 .back { 22 .back {
22 width: 60px; 23 width: 60px;
23 height: 60px; 24 height: 60px;
24 float: left; 25 float: left;
25 - background: url("/channel/back.png") no-repeat; 26 + font-size: 36px;
26 } 27 }
27 28
28 .right { 29 .right {
29 height: 60px; 30 height: 60px;
30 float: right; 31 float: right;
  32 + margin: 0;
  33 + padding: 0;
31 34
32 - i { 35 + span {
33 width: 60px; 36 width: 60px;
34 height: 60px; 37 height: 60px;
35 margin: 0 5px; 38 margin: 0 5px;
36 - display: inline-block;  
37 } 39 }
38 40
39 .favorite { 41 .favorite {
40 - background: url("/channel/favorite.png") no-repeat; 42 + font-size: 48px;
41 } 43 }
42 44
43 .share { 45 .share {
44 - background: url("/channel/share.png") no-repeat;  
45 - }  
46 -  
47 - .filter {  
48 - background: url("/channel/filter.png") no-repeat; 46 + font-size: 32px;
49 } 47 }
50 } 48 }
51 } 49 }