shaogen1995 2 년 전
부모
커밋
4f08dd12f7
3개의 변경된 파일60개의 추가작업 그리고 16개의 파일을 삭제
  1. 13 0
      src/assets/style/reset.css
  2. 24 3
      src/assets/style/reset.less
  3. 23 13
      src/views/gui/menu.vue

+ 13 - 0
src/assets/style/reset.css

@@ -364,6 +364,13 @@ input::-webkit-input-placeholder {
 }
 .pinBottom .rightViewContainer .gui-floor {
   background-color: transparent;
+  width: 44px;
+  height: 44px;
+  color: #e1cfac;
+}
+.pinBottom .rightViewContainer .gui-floor .gui-floor-title {
+  top: -2px;
+  position: relative;
 }
 .pinBottom .rightViewContainer .gui-floor-icon {
   width: 44px;
@@ -372,3 +379,9 @@ input::-webkit-input-placeholder {
 .pinBottom .rightViewContainer .gui-floor-number {
   color: #e1cfac;
 }
+.pinBottom .rightViewContainer .gui-floor.open .container .floorChoice:hover {
+  border: 1px solid #e1cfac;
+}
+.pinBottom .rightViewContainer .gui-floor.open .container .floorChoice.active {
+  color: #e1cfac;
+}

+ 24 - 3
src/assets/style/reset.less

@@ -445,15 +445,36 @@ input::-webkit-input-placeholder {
   width: 44px;
   height: 44px;
   margin-right: 12px;
-  .gui-floor{
+
+  .gui-floor {
     background-color: transparent;
+    width: 44px;
+    height: 44px;
+    color: #e1cfac;
+
+    .gui-floor-title {
+
+      top: -2px;
+      position: relative;
+    }
   }
-  .gui-floor-icon{
+
+  .gui-floor-icon {
     width: 44px;
     height: 44px;
   }
+
   // 字体颜色
-  .gui-floor-number{
+  .gui-floor-number {
+    color: #e1cfac;
+  }
+
+  // 选择楼层的鼠标移入
+  .gui-floor.open .container .floorChoice:hover {
+    border: 1px solid #e1cfac;
+  }
+
+  .gui-floor.open .container .floorChoice.active {
     color: #e1cfac;
   }
 }

+ 23 - 13
src/views/gui/menu.vue

@@ -1,9 +1,8 @@
 <template>
   <div class="pinBottom-container" @touchstart.stop @keydown.stop>
-
     <!-- 顶部的logo -->
     <div class="topLogo">
-      <img src="../../assets/myData/logo.png" alt="">
+      <img src="../../assets/myData/logo.png" alt="" />
     </div>
 
     <div class="pinBottom center">
@@ -207,6 +206,9 @@
         <div class="gui-floor">
           <div class="gui-floor-title"></div>
           <div class="gui-floor-icon">
+            <!-- 鼠标移入的显示 -->
+            <div class="hoverTit">楼层</div>
+
             <span class="gui-floor-number"></span>
           </div>
           <div class="container"></div>
@@ -345,17 +347,16 @@ export default {
 </script>
 
 <style lang="less" scoped>
-
-  // 顶部logo
-  .topLogo{
-    position: fixed;
-    z-index: 100;
-    top: 20px;
-    left: 20px;
-    &>img{
-      width: 300px;
-    }
+// 顶部logo
+.topLogo {
+  position: fixed;
+  z-index: 100;
+  top: 20px;
+  left: 20px;
+  & > img {
+    width: 300px;
   }
+}
 
 #hotList {
   display: none !important;
@@ -426,7 +427,7 @@ export default {
 
 #gui-fullscreen-exit {
   position: relative;
-    top: -6px;
+  top: -6px;
   &:hover {
     .hoverTit {
       opacity: 1;
@@ -442,6 +443,15 @@ export default {
     }
   }
 }
+// 楼层的鼠标移入
+.gui-floor-icon {
+  position: relative;
+  &:hover {
+    .hoverTit {
+      opacity: 1;
+    }
+  }
+}
 
 // 热点列表
 .hotInco {