Browse Source

处理手机对于样式兼容性问题

min
gap
lex 1 year ago
parent
commit
aeaf701363
1 changed files with 9 additions and 3 deletions
  1. 9 3
      src/views/tempo-practice/setting-modal/index.module.less

+ 9 - 3
src/views/tempo-practice/setting-modal/index.module.less

@@ -1,7 +1,7 @@
 .settingContainer {
   position: relative;
   width: 430px;
-  height: min(86vh, 340px);
+  height: 86vh;
   background: #fff;
   border-radius: 26px;
   padding: 20px 0;
@@ -85,8 +85,10 @@
   display: flex;
   align-items: center;
   flex-wrap: wrap;
-  gap: 0 12px;
+  // gap: 0 12px;
   padding-bottom: 18px;
+  margin-left: -6px;
+  margin-right: -6px;
 
 
   .btn {
@@ -99,6 +101,7 @@
     background: #F5F6F7;
     border: none;
     padding: 0;
+    margin: 0 6px;
 
     &.active {
       background: #19AEFF;
@@ -107,8 +110,10 @@
   }
 
   &.tempo {
-    gap: 8px 8px;
+    // gap: 8px 8px;
     padding-bottom: 0;
+    margin: -4px;
+
   }
 
   .active {
@@ -120,6 +125,7 @@
     height: 46px;
     background: #F5F6F7;
     border-radius: 4px;
+    margin: 4px;
   }
 }