chore: sync ant-design v3.21.4 (NG-ZORRO#3955)

Ricbet · Apr 9, 2020 · 998af43 · 998af43
1 parent ecfbe33
commit 998af43
Show file tree

Hide file tree

Showing 26 changed files with 266 additions and 111 deletions.
diff --git a/components/alert/style/index.less b/components/alert/style/index.less
@@ -86,8 +86,11 @@
   }
 
   &-close-text {
-    position: absolute;
-    right: 16px;
+    color: @alert-close-color;
+    transition: color 0.3s;
+    &:hover {
+      color: @alert-close-hover-color;
+    }
   }
 
   &-with-description {

diff --git a/components/button/style/index.less b/components/button/style/index.less
@@ -12,10 +12,7 @@
 // Button styles
 // -----------------------------
 .@{btn-prefix-cls} {
-  // Fixing https://github.com/ant-design/ant-design/issues/12978
-  // It is a render problem of chrome, which is only happened in the codesandbox demo
-  // 0.001px solution works and I don't why
-  line-height: @line-height-base - 0.001;
+  line-height: @line-height-base;
   .btn;
   .btn-default;
 
@@ -196,7 +193,12 @@
 }
 
 a.@{btn-prefix-cls} {
+  // Fixing https://github.com/ant-design/ant-design/issues/12978
+  // It is a render problem of chrome, which is only happened in the codesandbox demo
+  // 0.1px for padding-top solution works and I don't why
+  padding-top: 0.1px;
   line-height: @btn-height-base - 2px;
+
   &-lg {
     line-height: @btn-height-lg - 2px;
   }

diff --git a/components/card/style/index.less b/components/card/style/index.less
@@ -4,6 +4,7 @@
 @card-prefix-cls: ~'@{ant-prefix}-card';
 @card-head-height: 48px;
 @card-hover-border: fade(@black, 9%);
+@card-action-icon-size: 16px;
 
 @gradient-min: fade(@card-background, 20%);
 @gradient-max: fade(@card-background, 40%);
@@ -137,7 +138,7 @@
       color: @text-color-secondary;
       text-align: center;
 
-      & > span {
+      > span {
         position: relative;
         display: block;
         min-width: 32px;
@@ -150,23 +151,23 @@
           transition: color 0.3s;
         }
 
-        & > .anticon {
-          font-size: 16px;
-          line-height: 22px;
-        }
-
         a,
-        i {
+        > .anticon {
           display: inline-block;
           width: 100%;
           color: @text-color-secondary;
           line-height: 22px;
+          transition: color 0.3s;
 
           &:hover {
             color: @primary-color;
-            transition: color 0.3s;
           }
         }
+
+        > .anticon {
+          font-size: @card-action-icon-size;
+          line-height: 22px;
+        }
       }
 
       &:not(:last-child) {

diff --git a/components/checkbox/style/mixin.less b/components/checkbox/style/mixin.less
@@ -31,7 +31,7 @@
       border-radius: @border-radius-sm;
       visibility: hidden;
       animation: antCheckboxEffect 0.36s ease-in-out;
-      animation-fill-mode: both;
+      animation-fill-mode: backwards;
       content: '';
     }
 

diff --git a/components/date-picker/style/Calendar.less b/components/date-picker/style/Calendar.less
@@ -12,8 +12,8 @@
     border: 0 solid #aaa;
     border-width: 1.5px 0 0 1.5px;
     border-radius: 1px;
-    transform: rotate(-45deg) scale(.8);
-    transition: all .3s;
+    transform: rotate(-45deg) scale(0.8);
+    transition: all 0.3s;
     content: '';
   }
 
@@ -42,7 +42,7 @@
 
   &::before,
   &::after {
-    transform: rotate(135deg) scale(.8);
+    transform: rotate(135deg) scale(0.8);
   }
 }
 
@@ -131,6 +131,18 @@
   }
 }
 
+.calendar-selected-cell() {
+  .@{calendar-prefix-cls}-date {
+    color: @text-color-inverse;
+    background: @primary-color;
+    border: @border-width-base @border-style-base transparent;
+
+    &:hover {
+      background: @primary-color;
+    }
+  }
+}
+
 .@{calendar-prefix-cls} {
   position: relative;
   width: 280px;
@@ -255,26 +267,21 @@
     border-color: @primary-color;
   }
 
-  &-last-month-cell &-date,
-  &-next-month-btn-day &-date {
-    color: @disabled-color;
-  }
-
   &-selected-day &-date {
-    background: tint(@primary-color, 80%);
+    background: @primary-2;
   }
 
-  &-selected-date,
-  &-selected-start-date,
-  &-selected-end-date {
-    .@{calendar-prefix-cls}-date {
-      color: @text-color-inverse;
-      background: @primary-color;
-      border: @border-width-base @border-style-base transparent;
+  &-selected-date {
+    .calendar-selected-cell;
+  }
 
-      &:hover {
-        background: @primary-color;
-      }
+  &-last-month-cell &-date,
+  &-next-month-btn-day &-date {
+    &,
+    &:hover {
+      color: @disabled-color;
+      background: transparent;
+      border-color: transparent;
     }
   }
 

diff --git a/components/date-picker/style/MonthPanel.less b/components/date-picker/style/MonthPanel.less
@@ -1,6 +1,6 @@
 .@{calendar-prefix-cls}-month-panel {
   position: absolute;
-  top: 1px;
+  top: 0;
   right: 0;
   bottom: 0;
   left: 0;

diff --git a/components/date-picker/style/RangePicker.less b/components/date-picker/style/RangePicker.less
@@ -84,6 +84,22 @@
     transform: translateX(-50%);
   }
 
+  .@{calendar-prefix-cls}-today
+    :not(.@{calendar-prefix-cls}-disabled-cell)
+    :not(.@{calendar-prefix-cls}-last-month-cell)
+    :not(.@{calendar-prefix-cls}-next-month-btn-day) {
+    .@{calendar-prefix-cls}-date {
+      color: @primary-color;
+      background: @primary-2;
+      border-color: @primary-color;
+    }
+  }
+
+  .@{calendar-prefix-cls}-selected-start-date,
+  .@{calendar-prefix-cls}-selected-end-date {
+    .calendar-selected-cell;
+  }
+
   &.@{calendar-prefix-cls}-time &-right .@{calendar-prefix-cls}-date-input-wrap {
     margin-left: 0;
   }
@@ -170,7 +186,8 @@
 
   .@{calendar-prefix-cls},
   .@{calendar-prefix-cls}-month-panel,
-  .@{calendar-prefix-cls}-year-panel {
+  .@{calendar-prefix-cls}-year-panel,
+  .@{calendar-prefix-cls}-decade-panel {
     &-header {
       border-bottom: 0;
     }

diff --git a/components/date-picker/style/YearPanel.less b/components/date-picker/style/YearPanel.less
@@ -1,6 +1,6 @@
 .@{calendar-prefix-cls}-year-panel {
   position: absolute;
-  top: 1px;
+  top: 0;
   right: 0;
   bottom: 0;
   left: 0;

diff --git a/components/descriptions/style/index.less b/components/descriptions/style/index.less
@@ -47,6 +47,12 @@
       position: relative;
       top: -0.5px;
       margin: 0 8px 0 2px;
+      content: ' ';
+    }
+  }
+
+  &-item-colon {
+    &::after {
       content: ':';
     }
   }

diff --git a/components/drawer/style/drawer.less b/components/drawer/style/drawer.less
@@ -110,7 +110,7 @@
     .@{drawer-prefix-cls} {
       &-mask {
         height: 100%;
-        opacity: 0.3;
+        opacity: 1;
         transition: none;
         animation: antdDrawerFadeIn @animation-duration-slow @ease-base-out;
       }
@@ -193,7 +193,7 @@
     height: 0;
     background-color: @modal-mask-bg;
     opacity: 0;
-    filter: ~'alpha(opacity=50)';
+    filter: ~'alpha(opacity=45)';
     transition: opacity @animation-duration-slow linear, height 0s ease @animation-duration-slow;
   }
   &-open {
@@ -208,6 +208,6 @@
     opacity: 0;
   }
   100% {
-    opacity: 0.3;
+    opacity: 1;
   }
 }
diff --git a/components/empty/style/index.less b/components/empty/style/index.less
@@ -16,6 +16,11 @@
     img {
       height: 100%;
     }
+
+    svg {
+      height: 100%;
+      margin: auto;
+    }
   }
 
   &-description {

diff --git a/components/grid/style/index.less b/components/grid/style/index.less
@@ -61,9 +61,9 @@
 }
 
 .@{ant-prefix}-col {
+  position: relative;
   // Prevent columns from collapsing when empty
   min-height: 1px;
-  position: relative;
 }
 
 .make-grid-columns();

diff --git a/components/input/style/index.less b/components/input/style/index.less
@@ -44,7 +44,9 @@
 .@{ant-prefix}-input-clear-icon {
   color: @disabled-color;
   font-size: @font-size-sm;
-  vertical-align: top;
+  // https://github.com/ant-design/ant-design/pull/18151
+  // https://codesandbox.io/s/wizardly-sun-u10br
+  vertical-align: 0;
   cursor: pointer;
   transition: color 0.3s;
 

diff --git a/components/input/style/mixin.less b/components/input/style/mixin.less
@@ -2,6 +2,7 @@
 @import '../../style/mixins/index';
 
 @input-affix-width: 19px;
+@input-affix-with-clear-btn-width: 38px;
 
 // size mixins for input
 .input-lg() {
@@ -39,6 +40,7 @@
   background-color: @input-disabled-bg;
   cursor: not-allowed;
   opacity: 1;
+
   &:hover {
     .hover(@input-border-color);
   }
@@ -115,6 +117,7 @@
 
   > [class*='col-'] {
     padding-right: 8px;
+
     &:last-child {
       padding-right: 0;
     }
@@ -146,10 +149,12 @@
     width: 100%;
     margin-bottom: 0;
     text-align: inherit;
+
     &:focus {
       z-index: 1; // Fix https://gw.alipayobjects.com/zos/rmsportal/DHNpoqfMXSfrSnlZvhsJ.png
       border-right-width: 1px;
     }
+
     &:hover {
       z-index: 1;
       border-right-width: 1px;
@@ -228,6 +233,7 @@
   &-addon:first-child {
     border-right: 0;
   }
+
   &-addon:last-child {
     border-left: 0;
   }
@@ -279,9 +285,11 @@
     > .@{inputClass} {
       &:not(:first-child):not(:last-child) {
         border-right-width: @border-width-base;
+
         &:hover {
           z-index: 1;
         }
+
         &:focus {
           z-index: 1;
         }
@@ -314,9 +322,11 @@
     & > .@{ant-prefix}-time-picker .@{ant-prefix}-time-picker-input {
       border-right-width: @border-width-base;
       border-radius: 0;
+
       &:hover {
         z-index: 1;
       }
+
       &:focus {
         z-index: 1;
       }
@@ -368,6 +378,12 @@
     text-align: inherit;
   }
 
+  // Should not break align of icon & text
+  // https://github.com/ant-design/ant-design/issues/18087
+  // https://github.com/ant-design/ant-design/issues/17414
+  // https://github.com/ant-design/ant-design/pull/17684
+  // https://codesandbox.io/embed/pensive-paper-di2wk
+  // https://codesandbox.io/embed/nifty-benz-gb7ml
   .@{inputClass}-prefix,
   .@{inputClass}-suffix {
     position: absolute;
@@ -376,6 +392,7 @@
     color: @input-color;
     line-height: 0;
     transform: translateY(-50%);
+
     :not(.anticon) {
       line-height: @line-height-base;
     }
@@ -396,4 +413,8 @@
   .@{inputClass}:not(:last-child) {
     padding-right: @input-padding-horizontal-base + @input-affix-width;
   }
+
+  &.@{inputClass}-affix-wrapper-with-clear-btn .@{inputClass}:not(:last-child) {
+    padding-right: @input-padding-horizontal-base + @input-affix-with-clear-btn-width;
+  }
 }