From bf9e720500788e7f07ecc811f4b7b4a889462500 Mon Sep 17 00:00:00 2001
From: zuiidea <zuiiidea@gmail.com>
Date: Mon, 9 Jan 2017 21:57:01 +0800
Subject: [PATCH] less styles

---
 src/components/dashboard/browser.less     |  4 +-
 src/components/dashboard/completed.less   | 34 ++++++++-----
 src/components/dashboard/cpu.less         | 17 ++++---
 src/components/dashboard/numberCard.less  | 15 ++++--
 src/components/dashboard/quote.less       |  6 ++-
 src/components/dashboard/recentSales.less |  5 +-
 src/components/dashboard/sales.less       | 34 ++++++++-----
 src/components/dashboard/user.less        | 61 ++++++++++++++---------
 src/components/dashboard/weather.less     |  2 +-
 src/components/layout/common.less         |  6 +--
 src/components/skin.less                  | 16 +++---
 src/components/ui/search.less             |  5 +-
 src/components/users/list.less            | 18 +++----
 src/components/vars.less                  | 25 +++-------
 src/routes/dashboard.less                 |  8 +--
 src/routes/error.less                     |  4 +-
 16 files changed, 149 insertions(+), 111 deletions(-)

diff --git a/src/components/dashboard/browser.less b/src/components/dashboard/browser.less
index d4edd02..3449c61 100644
--- a/src/components/dashboard/browser.less
+++ b/src/components/dashboard/browser.less
@@ -1,7 +1,7 @@
-.percent{
+.percent {
   text-align: right!important;
 }
 
-.name{
+.name {
   text-align: left!important;
 }
diff --git a/src/components/dashboard/completed.less b/src/components/dashboard/completed.less
index bc211ac..468713b 100644
--- a/src/components/dashboard/completed.less
+++ b/src/components/dashboard/completed.less
@@ -1,41 +1,49 @@
 @import "../vars.less";
-.sales{
-  .title{
+
+.sales {
+  .title {
     margin-left: 32px;
     font-size: 16px;
   }
 }
-.radiusdot{
-  width:12px;
-  height:12px;
+
+.radiusdot {
+  width: 12px;
+  height: 12px;
   margin-right: 8px;
-  border-radius:50%;
-  display:inline-block;
+  border-radius: 50%;
+  display: inline-block;
 }
-.legend{
+
+.legend {
   color: @dark-half;
   text-align: right;
   color: #999;
   font-size: 14px;
-  li{
+
+  li {
     height: 48px;
     line-height: 48px;
     display: inline-block;
-    &+li{
+
+    &+li {
       margin-left: 24px;
     }
   }
 }
-.tooltip{
+
+.tooltip {
   background: #fff;
   padding: 20px;
   font-size: 14px;
-  .tiptitle{
+
+  .tiptitle {
     font-weight: 700;
     font-size: 16px;
     margin-bottom: 8px;
   }
-  .tipitem{
+
+  .tipitem {
     height: 32px;
     line-height: 32px;
   }
diff --git a/src/components/dashboard/cpu.less b/src/components/dashboard/cpu.less
index 9df141b..d5bddc8 100644
--- a/src/components/dashboard/cpu.less
+++ b/src/components/dashboard/cpu.less
@@ -4,28 +4,33 @@
     height: 64px;
     justify-content: space-between;
     margin-bottom: 32px;
+
     .item {
       text-align: center;
       height: 64px;
       width: 100%;
       position: relative;
-      &+.item{
-        &::before{
+
+      &+.item {
+        &::before {
           content: '';
           display: block;
           width: 1px;
           height: 40px;
           position: absolute;
-          background:  #f5f5f5;
+          background: #f5f5f5;
           top: 12px;
         }
       }
-      p{
+
+      p {
         color: #757575;
-        &:first-child{
+
+        &:first-child {
           font-size: 16px;
         }
-        &:last-child{
+
+        &:last-child {
           font-size: 20px;
           font-weight: 700;
         }
diff --git a/src/components/dashboard/numberCard.less b/src/components/dashboard/numberCard.less
index 419aafa..ada66a2 100644
--- a/src/components/dashboard/numberCard.less
+++ b/src/components/dashboard/numberCard.less
@@ -1,24 +1,29 @@
 @import "../vars.less";
-.numberCard{
+
+.numberCard {
   padding: 32px;
   font-family: monospace;
   margin-bottom: 24px;
   cursor: pointer;
-  .iconWarp{
+
+  .iconWarp {
     font-size: 54px;
     float: left;
   }
-  .content{
+
+  .content {
     width: 100%;
     padding-left: 78px;
-    .title{
+
+    .title {
       line-height: 16px;
       font-size: 16px;
       margin-bottom: 8px;
       height: 16px;
       .text-overflow();
     }
-    .number{
+
+    .number {
       line-height: 32px;
       font-size: 24px;
       height: 32px;
diff --git a/src/components/dashboard/quote.less b/src/components/dashboard/quote.less
index e24d172..9c3c952 100644
--- a/src/components/dashboard/quote.less
+++ b/src/components/dashboard/quote.less
@@ -24,13 +24,15 @@
 
     .description {
       width: 100%;
-      p{
+
+      p {
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap;
         margin-right: 64px;
         text-align: right;
-        &:last-child{
+
+        &:last-child {
           font-weight: 100;
         }
       }
diff --git a/src/components/dashboard/recentSales.less b/src/components/dashboard/recentSales.less
index 2e47c63..65e4572 100644
--- a/src/components/dashboard/recentSales.less
+++ b/src/components/dashboard/recentSales.less
@@ -1,6 +1,7 @@
 @import "../vars.less";
-.recentsales{
-  :global .ant-table-thead > tr > th{
+
+.recentsales {
+  :global .ant-table-thead > tr > th {
     background: #fff;
     border-bottom: solid 1px @border-color-base;
   }
diff --git a/src/components/dashboard/sales.less b/src/components/dashboard/sales.less
index bc211ac..468713b 100644
--- a/src/components/dashboard/sales.less
+++ b/src/components/dashboard/sales.less
@@ -1,41 +1,49 @@
 @import "../vars.less";
-.sales{
-  .title{
+
+.sales {
+  .title {
     margin-left: 32px;
     font-size: 16px;
   }
 }
-.radiusdot{
-  width:12px;
-  height:12px;
+
+.radiusdot {
+  width: 12px;
+  height: 12px;
   margin-right: 8px;
-  border-radius:50%;
-  display:inline-block;
+  border-radius: 50%;
+  display: inline-block;
 }
-.legend{
+
+.legend {
   color: @dark-half;
   text-align: right;
   color: #999;
   font-size: 14px;
-  li{
+
+  li {
     height: 48px;
     line-height: 48px;
     display: inline-block;
-    &+li{
+
+    &+li {
       margin-left: 24px;
     }
   }
 }
-.tooltip{
+
+.tooltip {
   background: #fff;
   padding: 20px;
   font-size: 14px;
-  .tiptitle{
+
+  .tiptitle {
     font-weight: 700;
     font-size: 16px;
     margin-bottom: 8px;
   }
-  .tipitem{
+
+  .tipitem {
     height: 32px;
     line-height: 32px;
   }
diff --git a/src/components/dashboard/user.less b/src/components/dashboard/user.less
index cfe44e0..ad23992 100644
--- a/src/components/dashboard/user.less
+++ b/src/components/dashboard/user.less
@@ -1,30 +1,34 @@
 @import "../vars.less";
-.user{
-  .header{
+
+.user {
+  .header {
     display: flex;
     justify-content: center;
     text-align: center;
     color: #fff;
     height: 200px;
-    background-image: url(http://hbfile.b0.upaiyun.com/img/home/banner/ae28b900fda7f5f4975dd9e13f628150ed627e7c1036e2);
+    background-image: url("http://hbfile.b0.upaiyun.com/img/home/banner/ae28b900fda7f5f4975dd9e13f628150ed627e7c1036e2");
     background-repeat: no-repeat;
     background-size: cover;
     align-items: center;
-    .headerinner{
+
+    .headerinner {
       z-index: 2;
     }
-     &::after{
-       content: '';
-       background: @purple;
-       position: absolute;
-       width: 100%;
-       height: 200px;
-       left: 0;
-       top:0;
-       opacity: .4;
-       z-index: 1;
-     }
-    .avatar{
+
+    &::after {
+      content: '';
+      background: @purple;
+      position: absolute;
+      width: 100%;
+      height: 200px;
+      left: 0;
+      top: 0;
+      opacity: 0.4;
+      z-index: 1;
+    }
+
+    .avatar {
       width: 64px;
       height: 64px;
       background-position: center;
@@ -32,23 +36,27 @@
       border-radius: 50%;
       display: inline-block;
     }
-    .name{
+
+    .name {
       font-size: 16px;
     }
   }
+
   .number {
     display: flex;
     height: 116px;
     justify-content: space-between;
     border-bottom: solid 1px #f5f5f5;
+
     .item {
       text-align: center;
       height: 116px;
       width: 100%;
       position: relative;
       padding: 30px 0;
-      &+.item{
-        &::before{
+
+      &+.item {
+        &::before {
           content: '';
           display: block;
           width: 1px;
@@ -58,24 +66,29 @@
           top: 0;
         }
       }
-      p{
+
+      p {
         color: #757575;
-        &:first-child{
+
+        &:first-child {
           font-size: 16px;
         }
-        &:last-child{
+
+        &:last-child {
           font-size: 20px;
           font-weight: 700;
         }
       }
     }
   }
-  .footer{
+
+  .footer {
     height: 116px;
     display: flex;
     justify-content: center;
     align-items: center;
-    :global .ant-btn{
+
+    :global .ant-btn {
       color: @purple;
       border-color: @purple;
       padding: 6px 16px;
diff --git a/src/components/dashboard/weather.less b/src/components/dashboard/weather.less
index bf269ab..3710354 100644
--- a/src/components/dashboard/weather.less
+++ b/src/components/dashboard/weather.less
@@ -21,7 +21,7 @@
       background-size: cover;
     }
 
-    p{
+    p {
       margin-top: 16px;
     }
   }
diff --git a/src/components/layout/common.less b/src/components/layout/common.less
index bd9d22c..8c56a01 100644
--- a/src/components/layout/common.less
+++ b/src/components/layout/common.less
@@ -95,8 +95,8 @@ body {
     }
   }
 }
-:global .ant-form-item-control{
-  vertical-align:middle;
-}
 
+:global .ant-form-item-control {
+  vertical-align: middle;
+}
 @import "../skin.less";
diff --git a/src/components/skin.less b/src/components/skin.less
index 3c35c71..d6db52e 100644
--- a/src/components/skin.less
+++ b/src/components/skin.less
@@ -1,17 +1,21 @@
 @import "./vars.less";
-:global{
-  .ant-modal-mask{
+
+:global {
+  .ant-modal-mask {
     background-color: rgba(55, 55, 55, 0.2);
   }
-  .ant-modal-content{
+
+  .ant-modal-content {
     box-shadow: none;
   }
-  .ant-card{
-    &:hover{
+
+  .ant-card {
+    &:hover {
       overflow: auto;
     }
   }
-  .ant-pagination-item{
+
+  .ant-pagination-item {
     margin-bottom: 8px;
   }
 }
diff --git a/src/components/ui/search.less b/src/components/ui/search.less
index d25672a..4c232f7 100644
--- a/src/components/ui/search.less
+++ b/src/components/ui/search.less
@@ -9,7 +9,7 @@
   position: relative;
 
   :global {
-    .anticon-cross{
+    .anticon-cross {
       position: absolute;
       width: 18px;
       height: 18px;
@@ -19,9 +19,10 @@
       line-height: 18px;
       border-radius: 50%!important;
       background-color: rgba(0, 0, 0, .16);
-      top:7px;
+      top: 7px;
       // opacity:
     }
+
     .ant-select {
       width: 80px;
       flex-shrink: 0;
diff --git a/src/components/users/list.less b/src/components/users/list.less
index a447050..b280ec3 100644
--- a/src/components/users/list.less
+++ b/src/components/users/list.less
@@ -1,12 +1,10 @@
-td.avatar{
-  line-height: 1;
-  height: 59px;
-  img{
-    border-radius: 50%;
-  }
-}
-.table{
-  td{
-    height: 38px;
+.table {
+  td.avatar {
+    line-height: 1;
+    height: 59px;
+
+    img {
+      border-radius: 50%;
+    }
   }
 }
diff --git a/src/components/vars.less b/src/components/vars.less
index 0e8b7e5..db29419 100644
--- a/src/components/vars.less
+++ b/src/components/vars.less
@@ -1,5 +1,4 @@
-@import "../../node_modules/antd/lib/style/themes/default.less";
-// // Prefix
+@import "../../node_modules/antd/lib/style/themes/default.less"; // // Prefix
 // @ant-prefix             : ant;
 //
 // // Color
@@ -171,26 +170,18 @@
 // @input-disabled-bg           : @background-color-base;
 //
 // @form-item-margin-bottom     : 24px;
-
 /*========================*/
 /*=======Antd Admin=======*/
 /*========================*/
-
 //Color
+@dark-half: #494949;
+@purple: #d897eb; // Shadow
+@shadow-1: 4px 4px 20px 0 rgba(0,0,0,0.01);
+@shadow-2: 4px 4px 40px 0 rgba(0,0,0,0.05); //transition
+@transition-ease-in: all 0.3s @ease-in;
+@transition-ease-out: all 0.3s @ease-out; //mix
 
-@dark-half:#494949;
-@purple:#d897eb;
-
-// Shadow
-@shadow-1           : 4px 4px 20px 0 rgba(0,0,0,0.01);
-@shadow-2           : 4px 4px 40px 0 rgba(0,0,0,0.05);
-
-//transition
-@transition-ease-in : all .3s @ease-in;
-@transition-ease-out : all .3s @ease-out;
-
-//mix
-.text-overflow(){
+.text-overflow() {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
diff --git a/src/routes/dashboard.less b/src/routes/dashboard.less
index f6becc7..a451ec8 100644
--- a/src/routes/dashboard.less
+++ b/src/routes/dashboard.less
@@ -5,14 +5,14 @@
   }
 }
 
-.weather{
-  &:hover{
+.weather {
+  &:hover {
     box-shadow: 4px 4px 40px rgba(143,201,251,.6);
   }
 }
 
-.quote{
-  &:hover{
+.quote {
+  &:hover {
     box-shadow: 4px 4px 40px rgba(246,152,153,.6);
   }
 }
diff --git a/src/routes/error.less b/src/routes/error.less
index b02f9aa..f5300b1 100644
--- a/src/routes/error.less
+++ b/src/routes/error.less
@@ -7,10 +7,12 @@
   left: 50%;
   margin-left: -100px;
   width: 200px;
-  :global .anticon{
+
+  :global .anticon {
     font-size: 48px;
     margin-bottom: 16px;
   }
+
   h1 {
     font-family: cursive;
   }