Authored by htoooth

add icon

@@ -52,25 +52,22 @@ @@ -52,25 +52,22 @@
52 </span> 52 </span>
53 </li> 53 </li>
54 54
55 - <li class="third-party-login"> 55 + <li class="clearfix" >
  56 + <div class="third-party-login">
  57 +
56 <a href="{{weixinLogin}}"> 58 <a href="{{weixinLogin}}">
57 - <span class="icon weixin"></span> 59 + <span class="iconfont weixin">&#xe622;</span>
58 </a> 60 </a>
59 <a href="{{qqLogin}}"> 61 <a href="{{qqLogin}}">
60 - <span class="icon qq"></span> 62 + <span class="iconfont qq">&#xe626;</span>
61 </a> 63 </a>
62 <a href="{{weiboLogin}}"> 64 <a href="{{weiboLogin}}">
63 - <span class="icon weibo"></span> 65 + <span class="iconfont weibo">&#xe62e;</span>
64 </a> 66 </a>
65 <a href="{{alipayLogin}}"> 67 <a href="{{alipayLogin}}">
66 - <span class="icon alipay"></span>  
67 - </a>  
68 - <a href="{{doubanLogin}}">  
69 - <span class="icon douban"></span>  
70 - </a>  
71 - <a href="{{renrenLogin}}">  
72 - <span class="icon renren"></span> 68 + <span class="iconfont alipay">&#xe63e;</span>
73 </a> 69 </a>
  70 + </div>
74 </li> 71 </li>
75 72
76 <li class="clearfix other-opts"> 73 <li class="clearfix other-opts">

6.52 KB | W: | H:

904 Bytes | W: | H:

  • 2-up
  • Swipe
  • Onion skin
1 @import "config"; 1 @import "config";
2 2
3 .login-page { 3 .login-page {
4 - @mixin passport-page  
5 -; 4 + @mixin passport-page;
6 5
7 li { 6 li {
8 - @mixin li-setting  
9 - ; 7 + @mixin li-setting;
10 } 8 }
11 9
12 .login-fail-tip { 10 .login-fail-tip {
@@ -93,8 +91,7 @@ @@ -93,8 +91,7 @@
93 cursor: pointer; 91 cursor: pointer;
94 92
95 .small { 93 .small {
96 - @mixin small  
97 - ; 94 + @mixin small;
98 } 95 }
99 96
100 } 97 }
@@ -107,42 +104,14 @@ @@ -107,42 +104,14 @@
107 104
108 .third-party-login { 105 .third-party-login {
109 display: table; 106 display: table;
  107 + margin: 0 40px;
110 108
111 - a { 109 + span {
112 display: table-cell; 110 display: table-cell;
113 - width: 45px; 111 + width: 55px;
114 background-size: 100% 100%; 112 background-size: 100% 100%;
115 - }  
116 -  
117 - .icon {  
118 - display: block;  
119 - width: 30px;  
120 - height: 30px;  
121 - margin: 0 auto;  
122 - }  
123 -  
124 - .weixin {  
125 - background: url(/passport/third/weixin.png) no-repeat;  
126 - }  
127 -  
128 - .qq {  
129 - background: url(/passport/third/qq.png) no-repeat;  
130 - }  
131 -  
132 - .weibo {  
133 - background: url(/passport/third/weibo.png) no-repeat;  
134 - }  
135 -  
136 - .alipay {  
137 - background: url(/passport/third/alipay.png) no-repeat;  
138 - }  
139 -  
140 - .douban {  
141 - background: url(/passport/third/douban.png) no-repeat;  
142 - }  
143 -  
144 - .renren {  
145 - background: url(/passport/third/renren.png) no-repeat; 113 + font-size: 20px;
  114 + text-align: center;
146 } 115 }
147 } 116 }
148 } 117 }