add icon

@@ -52,25 +52,22 @@
                     </span>
                     </span>
             </li>
             </li>
 
 
-            <li class="third-party-login">
-                <a href="{{weixinLogin}}">
-                    <span class="icon weixin"></span>
-                </a>
-                <a href="{{qqLogin}}">
-                    <span class="icon qq"></span>
-                </a>
-                <a href="{{weiboLogin}}">
-                    <span class="icon weibo"></span>
-                </a>
-                <a href="{{alipayLogin}}">
-                    <span class="icon alipay"></span>
-                </a>
-                <a href="{{doubanLogin}}">
-                    <span class="icon douban"></span>
-                </a>
-                <a href="{{renrenLogin}}">
-                    <span class="icon renren"></span>
-                </a>
+            <li class="clearfix" >
+                <div class="third-party-login">
+
+                    <a href="{{weixinLogin}}">
+                        <span class="iconfont weixin">&#xe622;</span>
+                    </a>
+                    <a href="{{qqLogin}}">
+                        <span class="iconfont qq">&#xe626;</span>
+                    </a>
+                    <a href="{{weiboLogin}}">
+                        <span class="iconfont weibo">&#xe62e;</span>
+                    </a>
+                    <a href="{{alipayLogin}}">
+                        <span class="iconfont alipay">&#xe63e;</span>
+                    </a>
+                </div>
             </li>
             </li>
 
 
             <li class="clearfix other-opts">
             <li class="clearfix other-opts">

 @import "config";
 @import "config";
 
 
 .login-page {
 .login-page {
-    @mixin passport-page
-;
+    @mixin passport-page;
 
 
     li {
     li {
-        @mixin li-setting
-    ;
+        @mixin li-setting;
     }
     }
 
 
     .login-fail-tip {
     .login-fail-tip {
@@ -93,8 +91,7 @@
         cursor: pointer;
         cursor: pointer;
 
 
         .small {
         .small {
-            @mixin small
-        ;
+            @mixin small;
         }
         }
 
 
     }
     }
@@ -107,42 +104,14 @@
 
 
     .third-party-login {
     .third-party-login {
         display: table;
         display: table;
+        margin: 0 40px;
 
 
-        a {
+        span {
             display: table-cell;
             display: table-cell;
-            width: 45px;
+            width: 55px;
             background-size: 100% 100%;
             background-size: 100% 100%;
-        }
-
-        .icon {
-            display: block;
-            width: 30px;
-            height: 30px;
-            margin: 0 auto;
-        }
-
-        .weixin {
-            background: url(/passport/third/weixin.png) no-repeat;
-        }
-
-        .qq {
-            background: url(/passport/third/qq.png) no-repeat;
-        }
-
-        .weibo {
-            background: url(/passport/third/weibo.png) no-repeat;
-        }
-
-        .alipay {
-            background: url(/passport/third/alipay.png) no-repeat;
-        }
-
-        .douban {
-            background: url(/passport/third/douban.png) no-repeat;
-        }
-
-        .renren {
-            background: url(/passport/third/renren.png) no-repeat;
+            font-size: 20px;
+            text-align: center;
         }
         }
     }
     }
 }
 }