[new feature] add Circle component (#608)

2018-02-05 17:52:43 +08:00
parent 70ce3838a2
commit 41df4b4819
12 changed files with 460 additions and 1 deletions
@@ -0,0 +1,32 @@
+@import './common/var.css';
+
+.van-circle {
+  position: relative;
+  text-align: center;
+  display: inline-block;
+
+  svg {
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    position: absolute;
+  }
+
+  &__layer {
+    fill: none;
+    stroke-dasharray: 3140px;
+    stroke-dashoffset: 3140px;
+    transform: rotate(90deg);
+    transform-origin: 530px 530px;
+  }
+
+  &__text {
+    top: 50%;
+    left: 0;
+    width: 100%;
+    color: $text-color;
+    position: absolute;
+    transform: translateY(-50%);
+  }
+}