checkbox component

packages/zanui-css/src/checkbox.css

@@ -0,0 +1,44 @@
+@import "./common/var.css";
+
+@component-namespace zan {
+  @b checkbox {
+    @when disabled {
+      .zan-icon {
+        color: #d1dbe5;
+      }
+    }
+
+    @e input {
+      position: relative;
+      height: 22px;
+      margin-right: 15px;
+    }
+
+    @e control {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 22px;
+      height: 22px;
+      opacity: 0;
+      margin: 0;
+    }
+
+    @e label {
+      line-height: 22px;
+    }
+
+    .zan-icon {
+      font-size: 22px;
+      line-height: 1;
+    }
+
+    .zan-icon-checked {
+      color: $c-green;
+    }
+
+    .zan-icon-check {
+      color: $c-gray-dark;
+    }
+  }
+}

packages/zanui-css/src/index.css

@@ -16,3 +16,4 @@
 @import './panel.css';
 @import './steps.css';
 @import './tag.css';
+@import './checkbox.css';