Merge branch 'master' of http://120.78.169.79:3000/zhengxiaoyu/datiGame

public/plugins/layui/css/main.css

@@ -23,8 +23,8 @@ article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,su
 audio,canvas,video,progress{display:inline-block;}
 
 .loader {
-    width: 20em;
-    height: 20em;
+    width: 4rem;
+    height: 4rem;
     font-size: 10px;
     position: relative;
     display: flex;
@@ -98,16 +98,16 @@ body{
 }
 .cov{ position: absolute; }
 .g-inner{margin: 0 auto;width: 7.5rem;}
-.cov1{left: 50%;top: 3.1rem;width: 2.4rem;margin-left: -1.3rem;border: solid #71a3fd .1rem;border-radius: 50%;}
+.cov1{left: 50%;top: 3.3rem;width: 2.4rem;margin-left: -1.2rem;/* border: solid #71a3fd 2px; */border-radius: 50%;}
 .cov2{left: 50%;top: 10.5rem;margin-left: -1.5rem;width: 3rem;font-size: .3rem;text-align: center;}
-.cov1 .userface{width: 2.4rem;height: 2.4rem;}
+.cov1 .userface{width: 2.2rem;height: 2.2rem;margin: 0 auto;}
 .cov3{left: 50%;top: 7rem;width: 2rem;height: 1rem;line-height: 1rem;margin-left: -1rem;text-align: center;font-size: .5rem;color: #FFF;font-weight: bold;border-radius: .2rem;}
 .cov4{right: 50%;top: 8.5rem;width: 2rem;margin-right: -1rem;}
  .userface{border-radius: 50%;overflow: hidden;background-color: #000;display: block;}
 .cov4 .userface{width: 2.0rem;height: 2.0rem;float: right;opacity: 0;}
 .doing .cov1{left: -.5rem;margin: 0;top: 1rem;background: #32deec;border-radius: 1rem;width: 4.3rem;border: 0;background: url(../img/user0.png);background-size: 4.3rem;height: 1rem;}
 .num{opacity: 0;color: #FFF;FONT-SIZE: 0.6REM;position: absolute;top: 0;text-shadow: 0px 0px 6px #7f8dde;}
-.doing .num{opacity: 1;line-height: .8rem;text-align: center;}
+.doing .num{opacity: 1;line-height: .8rem;text-align: center;text-shadow: 2px 2px 0px #820b3e;}
 .doing .cov1 .num{
     /* color: #FFF; */
     /* FONT-SIZE: 0.5REM; */
@@ -133,9 +133,10 @@ body{
     left: .2rem;
     width: 2rem;
     text-align: center;
+    text-shadow: 2px 2px 0px #820b3e;
 }
 .cov4 .name{left: 1.7rem;top: -1.2rem;}
-.gstart .name{top: 3rem;width: 2rem;left: 50%;margin-left: -1rem;text-align: center;}
+.gstart .name{top: 3.4rem;width: 2rem;left: 50%;margin-left: -1rem;text-align: center;}
 .gstart .cov4  .name{ left: 46%;  }
 .doing.gstart .name{ top:inherit; }
 .doing.gstart .cov4  .name{ left:inherit;  }
@@ -162,6 +163,23 @@ body{
     line-height: 1.15rem;
     margin-bottom: .5rem;
     overflow: hidden;
+    
+}
+.qs-item li:nth-child(2n){
+    -webkit-animation-name: bounceInLeft;
+    animation-name: bounceInLeft;
+    -webkit-animation-duration: .5s;
+    animation-duration: .5s;
+    -webkit-animation-fill-mode: both;
+    animation-fill-mode: both;
+}
+.qs-item li:nth-child(2n-1){
+    -webkit-animation-name: bounceInRight;
+    animation-name: bounceInRight;
+    -webkit-animation-duration: .5s;
+    animation-duration: .5s;
+    -webkit-animation-fill-mode: both;
+    animation-fill-mode: both;
 }
 .qs-item li .answer {
     width: 100%;
@@ -222,6 +240,13 @@ body{
         transition: all .3s;
         -webkit-transition: all .3s;
 }
+.loading{
+    position: absolute;
+    left: 50%;
+    top: .4rem;
+    width: 4rem;
+    margin-left: -2rem;
+}
 #start_game.layui-btn {
     display:inline-block;
     width: 2.66rem;
@@ -241,7 +266,16 @@ body{
     overflow: hidden;
     position: absolute;
     left: 2.46rem;
-    top: 7.45rem;
+    top: 7.4rem;
+    z-index: 9;
+    -webkit-animation-name: swing;
+    animation-name: swing;
+    -webkit-animation-duration: 2s;
+    animation-duration: 2s;
+    -webkit-animation-fill-mode: both;
+    animation-fill-mode: both;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count: infinite;
 }
 .layui-btn:hover {
     opacity:.8;
@@ -255,9 +289,41 @@ body{
 .layui-btn+.layui-btn {
     margin-left:10px
 }
-.welcome{background: url(../img/bg1.jpg) no-repeat center;height: 13.4rem;background-size: 7.5rem;}
+.welcome{background: url(../img/bg1.png) no-repeat center bottom;height: 13.4rem;background-size: 7.5rem;}
+.welcome .covtit1{
+    background: url(../img/tit1.png) no-repeat;
+    background-size: 100%;
+    width: 2.12rem;
+    height: 2.34rem;
+    left: .4rem;
+    top: .4rem;
+    -webkit-animation-name: wobble;
+    animation-name:wobble;
+    -webkit-animation-duration: 3s;
+    animation-duration: 3s;
+    -webkit-animation-fill-mode:both;
+    animation-fill-mode:both;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count:infinite;
+}
+.welcome .covtit2{
+    background: url(../img/tit2.png) no-repeat bottom;
+    background-size: 100%;
+    width: 6.63rem;
+    height: 5.46rem;
+    left: .4rem;
+    top: 2rem;
+    -webkit-animation-name: pulse;
+    animation-name: pulse;
+    -webkit-animation-duration: 2s;
+    animation-duration: 2s;
+    -webkit-animation-fill-mode: both;
+    animation-fill-mode: both;
+    -webkit-animation-iteration-count: infinite;
+    animation-iteration-count: infinite;
+}
 .gstart{display:none}
-.popwind{width:6.05rem;height:6.98rem;position: absolute;left: 0.8rem;top: 2.5rem;background: url(../img/rulebg.png);background-size: 100%;display: none;}
+.popwind{width:6.05rem;height:6.98rem;position: absolute;left: 0.8rem;top: 2.5rem;background: url(../img/rulebg.png);background-size: 100%;display: none;z-index: 99;}
 .popwind .art{
     padding: 1.1rem .82rem .4rem;
     height: 4rem;
@@ -282,7 +348,7 @@ body{
     left: 6rem;
     top: .5rem;
 }
-.popbg{display: none;position: fixed;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);}
+.popbg{display: none;position: fixed;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);z-index: 90;}
 .covxlz{ width: 2.86rem;left: 50%; margin-left: -1.43rem; bottom: .5rem; height: 1rem; border-radius: .5rem; background-color: #a7a8c5;line-height: 1rem;text-align: center;color: #222e71 }
 .con {
   position:relative;
@@ -293,7 +359,8 @@ body{
   background-size: 100%;
   /* padding: .1rem; */
 }
-
+.doing .covxlz{display:none}
+.end .covxlz{display:block}
 .percent-circle {
   position:absolute;
   height:100%;

resources/views/home/user.blade.php

@@ -54,7 +54,7 @@
 
       <div class="cov cov1 amt"><span class="userface" id="avatar"></span>
         <b id="username" class="name"></b>
-        <span class="num" id="py1_score">0</span>
+        <span class="num amt" id="py1_score">0</span>
       </div>
       <div class="cov cov2 amt">
         
@@ -64,10 +64,10 @@
       <div class="cov cov3 amt" id="Jvs">匹配中
         <div class="con" style="display: none;">
           <div class="percent-circle percent-circle-left">
-            <div class="left-content"></div>
+            <div class="left-content "></div>
           </div>
           <div class="percent-circle percent-circle-right">
-            <div class="right-content"></div>
+            <div class="right-content "></div>
           </div>
           <div class="text-circle">0%</div>
         </div>
@@ -75,7 +75,7 @@
       <div class="cov cov4 amt">
         <span class="userface" id="py2_avatar" ></span>
         <b id="py2_username" class="name"></b>
-        <span class="num"  id="py2_score">0</span>
+        <span class="num amt"  id="py2_score">0</span>
       </div>
       <div class="qs-item" >
         <span class="tit" id="Jqtitle"></span>
@@ -156,7 +156,8 @@ var textCircle   = document.querySelector(".text-circle");
      rightContent.setAttribute('style', 'transform: rotate(0deg)');
     ts=setInterval(function(){
               if(sum>=0)
-                   textCircle.innerHTML = sum;
+                    textCircle.innerHTML = sum;
+                  
                   sum= sum-1;
                   $("#Jvs .con").show();
                   angle += 36;
@@ -239,7 +240,7 @@ var textCircle   = document.querySelector(".text-circle");
               if(data.user_id == $("#user_id").val()){
                 var score = parseInt($("#py1_score").html());
                 if(data.is_true == 1){
-                  $("#py1_score").html(score+1);
+                  $("#py1_score").html(score+300);
                   $(".cur_answer").addClass("cur_true");
                 }else{
                   $(".cur_answer").addClass("cur_error");
@@ -247,7 +248,7 @@ var textCircle   = document.querySelector(".text-circle");
               }else{
                 if(data.is_true == 1){
                   var score = parseInt($("#py2_score").html());
-                  $("#py2_score").html(score+1);
+                  $("#py2_score").html(score+300);
                 }
               }
               var py1_score = parseInt($("#py1_score").html());