add avatars code

2 files changed, 46 insertions, 4 deletions

diff --git a/src/avatars.less b/src/avatars.less
new file mode 100644
index 0000000..1576698
--- /dev/null
+++ b/src/avatars.less
@@ -0,0 +1,42 @@
+// Avatars
+.avatar {
+  display: inline-block;
+  width: 3.2rem;
+  height: 3.2rem;
+  font-size: 1.4rem;
+  font-weight: 300;
+  line-height: 1;
+  border-radius: 50%;
+  vertical-align: middle;
+  position: relative;
+
+  &::after {
+    content: attr(data-initial);
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    color: #fff;
+    transform: translate(-50%, -50%);
+  }
+
+  &.avatar-xs {
+    width: 1.6rem;
+    height: 1.6rem;
+    font-size: .8rem;
+  }
+  &.avatar-sm {
+    width: 2.4rem;
+    height: 2.4rem;
+    font-size: 1rem;
+  }
+  &.avatar-lg {
+    width: 4.8rem;
+    height: 4.8rem;
+    font-size: 2rem;
+  }
+  &.avatar-xl {
+    width: 6.4rem;
+    height: 6.4rem;
+    font-size: 2.6rem;
+  }
+}
\ No newline at end of file
diff --git a/src/variables.less b/src/variables.less
index 23220df..14882ae 100644
--- a/src/variables.less
+++ b/src/variables.less
@@ -7,14 +7,14 @@
 @body-font-family: "Helvetica Neue", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", WenQuanYi Micro Hei, sans-serif;
 
 // Colors
-@core-color: #5764C6;
-@core-link-color: #5764C6;
+@core-color: #5764c6;
+@core-link-color: #5764c6;
 @core-border-color: #efefef;
 @control-color: #c5c5c5;
-@control-color-success: #32B643;
+@control-color-success: #32b643;
 @control-color-info: #0193eb;
 @control-color-warning: #ffb700;
-@control-color-danger: #E85600;
+@control-color-danger: #e85600;
 
 
 // Mixins