Explorar o código

pc单机云玩分栏

PC-20180523CIYM\Administrator %!s(int64=6) %!d(string=hai) anos
pai
achega
7feb374b27
Modificáronse 2 ficheiros con 90 adicións e 79 borrados
  1. 8 8
      2017专区/PC单机/src/_index.html
  2. 82 71
      2017专区/PC单机/src/sass/global.scss

+ 8 - 8
2017专区/PC单机/src/_index.html

@@ -763,7 +763,7 @@
                         </div>
                     </div>
                     <div class="g-tab__bd clearfix mt-25">
-                        <div class="zq-col-661">
+                        <div class="zq-col-670">
                             <div class="cloudplay-list">
                                 <ul>
                                     <li class="g-col-gItem">
@@ -897,16 +897,16 @@
                                 </ul>
                             </div>
                         </div>
-                        <div class="zq-col-503">
+                        <div class="zq-col-504">
                             <div class="cloudplay-hot">
                                 <ul>
                                     <li>
                                         <div class="imgbox">
-                                            <a href="//yun.duowan.com/up_543/76799.html" target="_blank">
+                                            <a href="//yun.duowan.com/up_543/76799.html" target="_blank" class="cover-img">
                                                 <img data-original="http://screenshot.dwstatic.com/ojiastoreimage/92a0ba56c39cc57e85566e4b3382dd4a_size800x998_len129505.jpg" alt="" />
                                                 <p class="setnum">78</p>
                                             </a>
-                                            <a href="//yun.duowan.com/up_543/76815.html" target="_blank">
+                                            <a href="//yun.duowan.com/up_543/76815.html" target="_blank" class="date-box">
                                                 <div class="to-update">
                                                     <p>07月25日更新至</p>
                                                     <em>9</em>
@@ -927,11 +927,11 @@
                                     </li>
                                     <li>
                                         <div class="imgbox">
-                                            <a href="//yun.duowan.com/up_543/76799.html" target="_blank">
+                                            <a href="//yun.duowan.com/up_543/76799.html" target="_blank" class="cover-img">
                                                 <img data-original="http://screenshot.dwstatic.com/ojiastoreimage/92a0ba56c39cc57e85566e4b3382dd4a_size800x998_len129505.jpg" alt="" />
                                                 <p class="setnum">78</p>
                                             </a>
-                                            <a href="//yun.duowan.com/up_543/76815.html" target="_blank">
+                                            <a href="//yun.duowan.com/up_543/76815.html" target="_blank" class="date-box">
                                                 <div class="to-update">
                                                     <p>07月25日更新至</p>
                                                     <em>9</em>
@@ -952,11 +952,11 @@
                                     </li>
                                     <li>
                                         <div class="imgbox">
-                                            <a href="//yun.duowan.com/up_543/76799.html" target="_blank">
+                                            <a href="//yun.duowan.com/up_543/76799.html" target="_blank" class="cover-img">
                                                 <img data-original="http://screenshot.dwstatic.com/ojiastoreimage/92a0ba56c39cc57e85566e4b3382dd4a_size800x998_len129505.jpg" alt="" />
                                                 <p class="setnum">78</p>
                                             </a>
-                                            <a href="//yun.duowan.com/up_543/76815.html" target="_blank">
+                                            <a href="//yun.duowan.com/up_543/76815.html" target="_blank" class="date-box">
                                                 <div class="to-update">
                                                     <p>07月25日更新至</p>
                                                     <em>9</em>

+ 82 - 71
2017专区/PC单机/src/sass/global.scss

@@ -892,25 +892,27 @@ body {
 }
 
 .pc-index-cloudplay{
-    .zq-col-661{
-        width: 661px;
+    .zq-col-670{
+        width: 670px;
         float: left;
     }
-    .zq-col-503{
-        width: 505px;
+    .zq-col-504{
+        width: 504px;
         float: right;
     }
-    a:hover{
-        text-decoration: none;
+    li{
+        a:hover{
+            text-decoration: none;
+        }
     }
     .cloudplay-list{
         ul{
             width: 700px;
             li{
                 height: 140px;
-                width: 154px;
+                width: 157px;
                 float: left;
-                margin-right: 15px;
+                margin-right: 14px;
                 vertical-align: top;
                 font-size: 12px;
                 a{
@@ -1042,92 +1044,102 @@ body {
         ul{
             width: 520px;
             li{
-                height: 268px;
-                width: 155px;
+                height: 276px;
+                width: 158px;
+                background: #223c4d;
+                border-radius: 3px;
+                overflow: hidden;
                 float: left;
-                padding: 3px;
-                margin-right: 10px;
+                margin-right: 15px;
                 .imgbox{
-                    height: 193px;
+                    height: 219px;
                     width: 100%;
-                    border-radius: 2px;
                     overflow: hidden;
                     position: relative;
-                    transition: transform 0.35s,box-shadow 0.35s;
+                    background: #000402;
+                    a{
+                        transition: opacity ease 0.2s;
+                    }
                     &:hover{
-                        transform: translate(-1px,-4px);
-                        box-shadow: 0 12px 30px -8px rgba(0,0,0,0.4);
+                        a{
+                            opacity: 0.9;
+                            filter: alpha(opacity=90);
+                        }
                     }
-                    img{
-                        height: 100%;
-                        width: 100%;
+                    .cover-img{
+                        height: 193px;
                         display: block;
-                    }
-                    .setnum{
-                        height: 28px;
-                        width: 24px;
-                        background: url(/src/img/bg-setnum.png?__sprite) no-repeat;
-                        position: absolute;
-                        top: 7px;
-                        left: 8px;
-                        font-size: 12px;
-                        color: #fff;
-                        line-height: 28px;
-                        text-align: center;
-                        text-shadow: 0 2px 3px rgba(0,0,0,0.69);
-                    }
-                    .to-update{
-                        width: 145px;
-                        position: absolute;
-                        left: 5px;
-                        bottom: 5px;
-                        font-size: 12px;
-                        line-height: 26px;
-                        text-align: center;
-                        color: #fff;
-                        border-radius: 2px;
-                        overflow: hidden;
-                        p{
+                        img{
                             height: 100%;
-                            width: 110px;
-                            background: #000;
-                            background: rgba(0,0,0,0.8);
-                            float: left;
-                        }
-                        em{
-                            width: 35px;
-                            float: left;
+                            width: 100%;
                             display: block;
+                        }
+                        .setnum{
+                            height: 28px;
+                            width: 24px;
+                            background: url(/src/img/bg-setnum.png?__sprite) no-repeat;
+                            position: absolute;
+                            top: 7px;
+                            left: 8px;
+                            font-size: 12px;
+                            color: #fff;
+                            line-height: 28px;
+                            text-align: center;
+                            text-shadow: 0 2px 3px rgba(0,0,0,0.69);
+                        }
+                    }
+                    .date-box{
+                        display: block;
+                        background: #000402;
+                        .to-update{
+                            width: 145px;
+                            margin: 0 auto;
+                            font-size: 12px;
+                            line-height: 26px;
+                            text-align: center;
                             color: #fff;
-                            background: #FF263A;
-                            background: rgba(255,38,58,0.9);
-                            transition: background 0.35s;
-                            &:hover{
+                            border-radius: 2px;
+                            overflow: hidden;
+                            p{
+                                height: 100%;
+                                width: 110px;
+                                background: #000;
+                                background: rgba(0,0,0,0.8);
+                                float: left;
+                            }
+                            em{
+                                width: 35px;
+                                float: left;
+                                display: block;
+                                color: #fff;
                                 background: #FF263A;
+                                background: rgba(255,38,58,0.9);
+                                transition: background 0.35s;
+                                &:hover{
+                                    background: #FF263A;
+                                }
                             }
                         }
                     }
                 }
                 .txtbox{
-                    margin-top: 7px;
-                    padding: 0 3px;
+                    padding: 2px 6px 0 8px;
                     h3,em{
                         @include ellipsis;
+                        color: #97c8e6;
                     }
                     h3{
-                        font-size: 16px;
-                        color: #fff;
-                        line-height: 28px;
-                        margin-bottom: 3px;
+                        font-size: 14px;
+                        line-height: 30px;
                         &:hover{
-                            color: #e94646;
+                            color: #ff6600;
                         }
                     }
                     .release-info{
                         overflow: hidden;
                         p{
-                            height: 30px;
-                            width: 30px;
+                            height: 16px;
+                            width: 16px;
                             float: left;
                             overflow: hidden;
                             border-radius: 100%;
@@ -1139,12 +1151,11 @@ body {
                             }
                         }
                         em{
-                            width: 109px;
+                            width: 103px;
                             float: left;
                             display: block;
-                            font-size: 14px;
-                            color: #aaa;
-                            line-height: 30px;
+                            font-size: 12px;
+                            line-height: 16px;
                         }
                     }
                 }