updated 添加扫码

static/style/index.css

@@ -202,7 +202,7 @@ a:hover{
 .mod-panel .hd p.text-gray{
     color: rgba(0,0,0,0.25);
 }
-.mod-panel .hd .picture{
+.mod-panel .hd .picture,.mod-panel .hd .mobile{
     position: relative;
     width: 400px;
     text-align: center;
@@ -210,7 +210,8 @@ a:hover{
 .mod-panel .hd .picture img{
     margin-left: -56px;
 }
-.mod-panel .hd .picture .btn{
+.mod-panel .hd .btn{
+    position: relative;
     display: inline-block;
     height: 36px;
     margin-top: -20px;
@@ -223,15 +224,53 @@ a:hover{
     text-align: center;
     font-size: 15px;
     color: #fff;
-    overflow: hidden;
     transition: color .2s,opacity .2s;
     font-family: Tahoma,Arial, Helvetica,"Microsoft YaHei";
     outline: none;
     -webkit-appearance: none;
 }
-.mod-panel .hd .picture .btn:hover {
+.mod-panel .hd .btn span.name{
+    display: inline-block;
+    padding-right: 30px;
+    background: url('../image/scan.png') right center / 16px 16px no-repeat;
+}
+.mod-panel .hd .btn span.qrcode{
+    display: none;
+    position: absolute;
+    right: -160px;
+    top: 50%;
+    z-index:999;
+    width: 150px;
+    height: 150px;
+    padding: 5px;
+    background: #fff;
+    margin-top: -85px;
+    border: 2px solid rgba(0,0,0,0.1);
+}
+.mod-panel .hd .btn span.qrcode img{
+    width: 150px;
+    height: 150px;
+}
+.mod-panel .hd .btn span.qrcode::after{
+    position: absolute;
+    left: -8px;
+    top: 50%;
+    margin-top: -6px;
+    display: block;
+    content: '';
+    width: 12px;
+    height: 12px;
+    background: #fff;
+    border-left: 2px solid rgba(0,0,0,0.1);
+    border-bottom: 2px solid rgba(0,0,0,0.1);
+    transform: rotate(45deg);
+}
+.mod-panel .hd .btn:hover {
     background: #207fcc;
 }
+.mod-panel .hd .btn:hover span.qrcode{
+    display: block;
+}
 .mod-panel .hd b{
 	margin: 0 3px;
 	color: #fd7474;