update shadow style system

style/components/card.less

@@ -10,7 +10,8 @@
   transition: all .2s;
 
   &:hover {
-    box-shadow: 0 1px 6px rgba(100, 100, 100, .2);
+    box-shadow: @box-shadow-base;
+    border-color: #eee;
   }
 
   &-bordered {

style/components/message.less

@@ -21,7 +21,7 @@
     padding: 8px 16px;
     border-radius: @border-radius-base;
     border: 1px solid @border-color-base;
-    box-shadow: @box-shadow-base;
+    box-shadow: @shadow-2;
     background: #fff;
     display: block;
   }

style/components/notification.less

@@ -15,7 +15,7 @@
   &-notice {
     padding: @notice-padding;
     border-radius: @border-radius-base;
-    box-shadow: @box-shadow-base;
+    box-shadow: @shadow-2;
     border: 1px solid @border-color-base;
     background: @body-background;
     line-height: 1.5;

style/components/table.less

@@ -379,7 +379,7 @@
 
   &-fixed-left {
     left: 0;
-    box-shadow: 4px 0 4px rgba(0, 0, 0, 0.08);
+    box-shadow: @shadow-1-right;
     border-radius: @border-radius-base 0 0 0;
     & .@{table-prefix-cls}-body-inner {
       margin-right: -20px;
@@ -388,7 +388,7 @@
 
   &-fixed-right {
     right: 0;
-    box-shadow: -4px 0 4px rgba(0, 0, 0, 0.08);
+    box-shadow: @shadow-1-left;
     border-radius: 0 @border-radius-base 0 0;
   }
 

style/themes/default/custom.less

@@ -49,9 +49,17 @@
 
 // Border color
 @border-color-base      : #d9d9d9;        // base border outline a component
-@box-shadow-base        : 0 1px 4px rgba(100, 100, 100, .2);
 @border-color-split     : #e9e9e9;        // split border inside a component
 
+// Shadow
+@shadow-color           : rgba(100, 100, 100, .2);
+@box-shadow-base        : @shadow-1-down;
+@shadow-1-up            : 0 -1px 6px @shadow-color;
+@shadow-1-down          : 0 1px 6px @shadow-color;
+@shadow-1-left          : -1px 0 6px @shadow-color;
+@shadow-1-right         : 1px 0 6px @shadow-color;
+@shadow-2               : 0 1px 8px @shadow-color;
+
 // Buttons
 @btn-font-weight        : 500;