Explorar el Código

Fix checkbox-button and radio-button gap

Leopoldthecoder hace 7 años
padre
commit
2e8161e68e

+ 1 - 1
CHANGELOG.en-US.md

@@ -1,6 +1,6 @@
 ## Changelog
 
-### 2.0.0
+### 2.0.0 Carbon
 
 *2017-10-27*
 

+ 2 - 2
CHANGELOG.zh-CN.md

@@ -1,6 +1,6 @@
 ## 更新日志
 
-### 2.0.0
+### 2.0.0 Carbon
 
 *2017-10-27*
 
@@ -137,7 +137,7 @@
   - 移除 `theme-default`
   - 最低兼容 Vue 2.5.2 和 IE 10
   - 表单组件的 `change` 事件和 Pagination 的 `current-change` 事件现在仅响应用户交互
-  - Button 和表单组件的 `size` 属性不再接受 `large` 值,可接受 `medium`、`small` 和 `mini`
+  - Button 和表单组件的 `size` 属性现在可接受 `medium`、`small` 和 `mini`
   - 为了方便使用第三方图标,Button 的 `icon` 属性、Input 的 `prefix-icon` 和 `suffix-icon` 属性、Steps 的 `icon` 属性现在需要传入完整的图标类名
 - Dialog
   - 移除 `size` 属性。现在 Dialog 的尺寸由 `width` 和 `fullscreen` 控制

+ 17 - 0
examples/components/theme-picker.vue

@@ -128,10 +128,27 @@
           }
         };
 
+        const shadeColor = (color, shade) => {
+          let red = parseInt(color.slice(0, 2), 16);
+          let green = parseInt(color.slice(2, 4), 16);
+          let blue = parseInt(color.slice(4, 6), 16);
+
+          red = Math.round((1 - shade) * red);
+          green = Math.round((1 - shade) * green);
+          blue = Math.round((1 - shade) * blue);
+
+          red = red.toString(16);
+          green = green.toString(16);
+          blue = blue.toString(16);
+
+          return `#${ red }${ green }${ blue }`;
+        };
+
         const clusters = [theme];
         for (let i = 0; i <= 9; i++) {
           clusters.push(tintColor(theme, Number((i / 10).toFixed(2))));
         }
+        clusters.push(shadeColor(theme, 0.1));
         return clusters;
       }
     }

+ 1 - 1
package.json

@@ -57,7 +57,7 @@
     "throttle-debounce": "^1.0.1"
   },
   "peerDependencies": {
-    "vue": "^2.3.0"
+    "vue": "^2.5.2"
   },
   "devDependencies": {
     "algoliasearch": "^3.24.5",

+ 5 - 0
packages/theme-chalk/src/checkbox.scss

@@ -6,6 +6,7 @@
 @include b(checkbox) {
   color: $--checkbox-color;
   font-weight: $--checkbox-font-weight;
+  font-size: $--font-size-base;
   position: relative;
   cursor: pointer;
   display: inline-block;
@@ -339,3 +340,7 @@
     }
   }
 }
+
+@include b(checkbox-group) {
+  font-size: 0;
+}

+ 3 - 2
packages/theme-chalk/src/input-number.scss

@@ -124,14 +124,15 @@
 
   @include when(without-controls) {
     .el-input__inner {
+      padding-left: 15px;
       padding-right: 15px;
     }
   }
 
   @include when(controls-right) {
     .el-input__inner {
-        padding-left: 15px;
-        padding-right: #{$--input-height + 10};
+      padding-left: 15px;
+      padding-right: #{$--input-height + 10};
     }
 
     @include e((increase, decrease)) {

+ 1 - 0
packages/theme-chalk/src/radio-group.scss

@@ -5,4 +5,5 @@
   display: inline-block;
   line-height: 1;
   vertical-align: middle;
+  font-size: 0;
 }

+ 1 - 0
packages/theme-chalk/src/radio.scss

@@ -12,6 +12,7 @@
   display: inline-block;
   white-space: nowrap;
   outline: none;
+  font-size: $--font-size-base;
   @include utils-user-select(none);
 
   @include when(bordered) {