测试

5ad53e0e · libai · 04f43906 · 5ad53e0e · 5ad53e0e · 5ad53e0e
Commit 5ad53e0e authored Nov 21, 2022 by libai
Showing with 87 additions and 20 deletions
mTest/css/index.css
mTest/css/index.less
mTest/revise.html
mTest/room/css/liveRoom.css
mTest/room/css/liveRoom.less
mTest/room/liveRoom.html
--- a/mTest/css/index.css
+++ b/mTest/css/index.css
@@ -1044,8 +1044,9 @@
  height: 100vh;
  background: #F3F3F3;
  position: fixed;
-  top: 0;
+  top: 100vh;
  left: 0;
+  transition: 0.2s all;
 }
 .revise-input-title {
  height: 1.3rem;
@@ -1065,7 +1066,31 @@
  text-indent: 0rem;
 }
 .revise-input-box {
-  height: 0.9rem;
+  height: 1.2rem;
+  background: #F7F7F7;
+  width: 10rem;
+  border-top: 1px solid #E5E5E5;
+  border-bottom: 1px solid #E5E5E5;
+  position: relative;
+}
+.revise-input {
+  width: 10rem;
+  font-size: 0.35rem;
+  height: 1.2rem;
+  text-indent: 0.55rem;
+}
+.revise-send-btn {
+  width: 8.8rem;
+  height: 1.05rem;
+  background: linear-gradient(to right, #E43984, #E538C1);
+  text-align: center;
+  line-height: 1.05rem;
+  color: #fff;
+  font-size: 0.45rem;
+  font-weight: 700;
+  border-radius: 1rem;
+  margin: 0 auto;
+  margin-top: 1.1rem;
 }
 .down-bg {
  position: relative;

--- a/mTest/css/index.less
+++ b/mTest/css/index.less
@@ -1074,8 +1074,9 @@
  height: 100vh;
  background: #F3F3F3;
  position: fixed;
-  top: 0;
+  top: 100vh;
  left: 0;
+  transition: 0.2s all;
 }
 .revise-input-title{
  height: 1.3rem;
@@ -1094,11 +1095,33 @@
    text-indent: 0rem;
  }
 }
 .revise-input-box{
-  height: 0.9rem;
+  height: 1.2rem;
+  background: #F7F7F7;
+  width: 10rem;
+  border-top: 1px solid #E5E5E5;
+  border-bottom: 1px solid #E5E5E5;
+  position: relative;
 }
-.revise-input-box{
+.revise-input{
+  width: 10rem;
+  font-size: 0.35rem;
+  height: 1.2rem;
+  text-indent: 0.55rem;
+}
+.revise-send-btn{
+  width: 8.8rem;
+  height: 1.05rem;
+  background:linear-gradient(to right,#E43984,#E538C1);
+  text-align: center;
+  line-height: 1.05rem;
+  color: #fff;
+  font-size: 0.45rem;
+  font-weight: 700;
+  border-radius: 1rem;
+  margin: 0 auto;
+  margin-top: 1.1rem;
 }
 .down-bg{
  position: relative;

--- a/mTest/revise.html
+++ b/mTest/revise.html
@@ -102,9 +102,12 @@
            <span class="revise-p2">好爸爸<span>></span></span>
        </div>
    </div>
-    <div style="display: none;" class="revise-layer">
+    <div  class="revise-layer">
-        <div class="revise-input-title"><span>&lt;</span> 暱稱</div>
+        <div class="revise-input-title"><span>&lt;</span> <i style="font-style:normal;">暱稱</i></div>
-        <div class="revise-input-box"></div>
+        <div class="revise-input-box">
+            <input class="revise-input" placeholder="請輸入您的暱稱" type="text">
+        </div>
+        <div class="revise-send-btn">保存</div>
    </div>
 </body>
 <script src="layer-v3.1.0/layer/layer.js"></script>
@@ -124,7 +127,7 @@ $(function(){
            console.log("用戶資料",data)
            $(".revise-face").attr("src","https://zhibocdn.yabolive.net/comm"+data.roomBaseInfo.face+"?x-oss-process=image/resize,w_120")
            var html=[]
-            html+='<div>';
+            html+='<div data-type="1">';
            html+='<span class="revise-p1">暱稱</span>';
            html+='<span class="revise-p2">' + data.roomBaseInfo.nickname + '<span>></span></span>';
            html+='</div>';
@@ -132,36 +135,49 @@ $(function(){
            html+='<span class="revise-p1">ID</span>';
            html+='<span class="revise-p2">' + data.roomBaseInfo.uid + '</span>';
            html+='</div>';
-            html+='<div>';
+            html+='<div data-type="2">';
            html+='<span class="revise-p1">性別</span>';
            if(data.roomBaseInfo.sex==1)html+='<span class="revise-p2">男<span>></span></span>';
            else html+='<span class="revise-p2">女<span>></span></span>';
            html+='</div>';
-            html+='<div>';
+            html+='<div data-type="3">';
            html+='<span class="revise-p1">身高</span>';
            if(data.roomBaseInfo.height=='')html+='<span class="revise-p2">秘密<span>></span></span>';
            else html+='<span class="revise-p2">' + data.roomBaseInfo.height + 'cm<span>></span></span>';
            html+='</div>';
-            html+='<div>';
+            html+='<div data-type="4">';
            html+='<span class="revise-p1">體重</span>';
            if(data.roomBaseInfo.weight=='')html+='<span class="revise-p2">秘密<span>></span></span>';
            else html+='<span class="revise-p2">'+data.roomBaseInfo.weight+'<span>></span></span>';
            html+='</div>';
-            html+='<div>';
+            html+='<div data-type="5">';
            html+='<span class="revise-p1">學歷</span>';
            html+='<span class="revise-p2">' + data.roomBaseInfo.culture + '<span>></span></span>';
            html+='</div>';
-            html+='<div>';
+            html+='<div data-type="6">';
            html+='<span class="revise-p1">職業</span>';
            html+='<span class="revise-p2">' + data.roomBaseInfo.work + '<span>></span></span>';
            html+='</div>';
-            html+='<div>';
+            html+='<div data-type="7">';
            html+='<span class="revise-p1">簽名</span>';
            html+='<span class="revise-p2">'+data.roomBaseInfo.sign.replace("Firefly Live","Footseen")+'<span>></span></span>';
            html+='</div>';
            $(".revise-content").html(html)
+            $(".revise-content >div").on("click",function(){
+                var _self=$(this)
+                if(_self.children(".revise-p1").text()=='ID')return
+                $(".revise-layer").css("top","0vh")
+                $(".revise-input-title i").text(_self.children(".revise-p1").text())
+            })
+            $(".revise-send-btn").unbind("click").on("click",function(){
+            })
        }
    })
+    $(".revise-input-title >span").on("click",function(){
+        $(".revise-layer").css("top","100vh")
+    })
 })
 </script>
 </html>
\ No newline at end of file
--- a/mTest/room/css/liveRoom.css
+++ b/mTest/room/css/liveRoom.css
@@ -197,6 +197,7 @@
  height: 4.5rem;
  bottom: 1.4rem;
  position: absolute;
+  z-index: 200;
  left: 0.44rem;
  overflow: scroll;
  -webkit-overflow-scrolling: touch;
@@ -746,7 +747,7 @@
  z-index: 100;
  width: 10rem;
  left: 0;
-  bottom: 6.3rem;
+  bottom: 3rem;
 }
 .room-bg {
  width: 100vw;

--- a/mTest/room/css/liveRoom.less
+++ b/mTest/room/css/liveRoom.less
@@ -203,6 +203,7 @@
    // background: pink;
    bottom: 1.4rem;
    position: absolute;
+    z-index: 200;
    left: 0.44rem;
    overflow: scroll;
    -webkit-overflow-scrolling: touch;
@@ -770,7 +771,7 @@
    z-index: 100;
    width: 10rem;
    left: 0;
-    bottom: 6.3rem;
+    bottom: 3rem;
 }
 .room-bg{
    width: 100vw;

--- a/mTest/room/liveRoom.html
+++ b/mTest/room/liveRoom.html
@@ -32,7 +32,7 @@
    <script src="../lib/fsize.js"></script>
    <link rel="stylesheet" href="../css/base.css">
    <link rel="stylesheet" href="../css/layer.css">
-    <link rel="stylesheet" href="css/liveRoom.css?v=2022112102">
+    <link rel="stylesheet" href="css/liveRoom.css?v=2022112109">
    <link rel="stylesheet" href="../css/login.css?v=2022111808">
    <script src="https://accounts.google.com/gsi/client" async defer></script>
    <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
@@ -573,7 +573,7 @@
 <script>
 $(function(){
    var dHeight=$(document).height()
-    $(".touch-box").css("height",dHeight/2.5+"px")
+    $(".touch-box").css("height",dHeight/2+"px")
    $(".touch-box").css("margin-top",-dHeight/5+"px")
    var topRoomId
    var BottomRoomId