Explorar el Código

全景图片页样式修改

任一存 hace 4 años
padre
commit
fc7b61f546
Se han modificado 1 ficheros con 54 adiciones y 39 borrados
  1. 54 39
      src/views/material/style.less

+ 54 - 39
src/views/material/style.less

@@ -9,32 +9,43 @@
   .ui-button{
   .ui-button{
     font-size: @color;
     font-size: @color;
   }
   }
-
-  .btn{
+  .second-line {
     margin-top: 18px;
     margin-top: 18px;
-    .ui-button{
-      position: relative;
-      padding: 0 20px;
-      display: flex;
-      align-items: center;
-      border-radius: 4px;
-      >span{
-        display: inline-block;
-        margin-right: 4px;
-      }
-      &:hover{
-        .upload-list{
-          display: block;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .btn{
+      .ui-button{
+        font-size: 14px;
+        position: relative;
+        padding: 0 20px;
+        display: flex;
+        align-items: center;
+        border-radius: 4px;
+        >span{
+          display: inline-block;
+          margin-right: 4px;
+        }
+        &:hover{
+          .upload-list{
+            display: block;
+          }
+        }
+        .tooltip {
+          i {
+            font-size: 12px;
+            cursor: default;
+          }
         }
         }
       }
       }
     }
     }
   }
   }
-  
+    
   >.list{
   >.list{
-    margin-top: 20px;
+    margin-top: 32px;
     .img{
     .img{
-      width: 60px;
-      height: 60px;
+      width: 50px;
+      height: 50px;
       position: relative;
       position: relative;
       overflow: hidden;
       overflow: hidden;
       cursor: pointer;
       cursor: pointer;
@@ -110,23 +121,33 @@
 
 
 
 
 .filter > div {
 .filter > div {
-  min-width: 292px;
+  min-width: 290px;
   height: 40px;
   height: 40px;
   border: 1px solid #EBEDF0;
   border: 1px solid #EBEDF0;
-  border-radius: 2px;
-  display: inline-block;
+  display: flex;
+  align-items: center;
   border-radius: 20px;
   border-radius: 20px;
   position: relative;
   position: relative;
   font-size: 14px;
   font-size: 14px;
   vertical-align: middle;
   vertical-align: middle;
   background: #F7F8FA;
   background: #F7F8FA;
+  padding: 10px 20px 10px 20px;
+  color: #C8C9CC;
   &.active{
   &.active{
     border: 1px solid #0076F6;
     border: 1px solid #0076F6;
   }
   }
 }
 }
 
 
+.filter>div>i {
+  flex: 0 0 auto;
+  cursor: pointer;
+  margin-right: 12px;
+  font-size: 18px;
+}
+
 .filter > div > select,
 .filter > div > select,
 .filter > div > input {
 .filter > div > input {
+  flex: 1 0 auto;
   box-sizing: border-box;
   box-sizing: border-box;
   width: 100%;
   width: 100%;
   height: 100%;
   height: 100%;
@@ -140,40 +161,34 @@
   padding-left: 44px;
   padding-left: 44px;
 }
 }
 
 
-
-.filter > div > i {
-  position: absolute;
-  top: 50%;
-  transform: translateY(-50%);
-  left: 10px;
-  cursor: pointer;
-  color: #C8C9CC;
-  font-size: 20px;
-}
 .filter > div >.del{
 .filter > div >.del{
   left: auto;
   left: auto;
   right: 10px;
   right: 10px;
   font-size: 20px;
   font-size: 20px;
 }
 }
 
 
+.submit {
+  background-color: #0076F6 !important;
+  border: 1px solid #0076F6 !important;
+}
+
 .cancel{
 .cancel{
   background: #EBEBEB;
   background: #EBEBEB;
 }
 }
 
 
 .ui-button-rect{
 .ui-button-rect{
-  border-radius: 0!important;
+  border-radius: 4px !important;
   align-items: center;
   align-items: center;
   vertical-align: middle;
   vertical-align: middle;
-  color: #202020;
+  color: #fff;
   display: flex;
   display: flex;
   justify-content: center;
   justify-content: center;
-  padding: 0 20px;
-  line-height: 32px;
-  height: 32px;
-  border: none;
+  padding: 0 16px;
+  line-height: 36px;
+  height: 36px;
   text-align: center;
   text-align: center;
   >i{
   >i{
-    margin-left: 5px;
+    margin-left: 4px;
   }
   }
 }
 }