chore: sync ant-design v4.4.0 (ant-design-blazor#277)

lexigua · Jul 1, 2020 · 679e20b · 679e20b
1 parent 1bb9dca
commit 679e20b
Show file tree

Hide file tree

Showing 23 changed files with 267 additions and 64 deletions.
diff --git a/components/collapse/style/index.less b/components/collapse/style/index.less
@@ -125,6 +125,22 @@
     padding-top: 4px;
   }
 
+  &-ghost {
+    background-color: transparent;
+    border: 0;
+    > .@{collapse-prefix-cls}-item {
+      border-bottom: 0;
+      > .@{collapse-prefix-cls}-content {
+        background-color: transparent;
+        border-top: 0;
+        > .@{collapse-prefix-cls}-content-box {
+          padding-top: 12px;
+          padding-bottom: 12px;
+        }
+      }
+    }
+  }
+
   & &-item-disabled > &-header {
     &,
     & > .arrow {

diff --git a/components/dropdown/style/index.less b/components/dropdown/style/index.less
@@ -47,6 +47,76 @@
     display: none;
   }
 
+  // Offset the popover to account for the dropdown arrow
+  &-show-arrow&-placement-topCenter,
+  &-show-arrow&-placement-topLeft,
+  &-show-arrow&-placement-topRight {
+    padding-bottom: @popover-distance;
+  }
+
+  &-show-arrow&-placement-bottomCenter,
+  &-show-arrow&-placement-bottomLeft,
+  &-show-arrow&-placement-bottomRight {
+    padding-top: @popover-distance;
+  }
+
+  // Arrows
+  // .popover-arrow is outer, .popover-arrow:after is inner
+
+  &-arrow {
+    position: absolute;
+    z-index: 1; // lift it up so the menu wouldn't cask shadow on it
+    display: block;
+    width: sqrt(@popover-arrow-width * @popover-arrow-width * 2);
+    height: sqrt(@popover-arrow-width * @popover-arrow-width * 2);
+    background: transparent;
+    border-style: solid;
+    border-width: sqrt(@popover-arrow-width * @popover-arrow-width * 2) / 2;
+    transform: rotate(45deg);
+  }
+
+  &-placement-topCenter > &-arrow,
+  &-placement-topLeft > &-arrow,
+  &-placement-topRight > &-arrow {
+    bottom: @popover-distance - @popover-arrow-width + 2.2px;
+    border-top-color: transparent;
+    border-right-color: @popover-bg;
+    border-bottom-color: @popover-bg;
+    border-left-color: transparent;
+    box-shadow: 3px 3px 7px fade(@black, 7%);
+  }
+  &-placement-topCenter > &-arrow {
+    left: 50%;
+    transform: translateX(-50%) rotate(45deg);
+  }
+  &-placement-topLeft > &-arrow {
+    left: 16px;
+  }
+  &-placement-topRight > &-arrow {
+    right: 16px;
+  }
+
+  &-placement-bottomCenter > &-arrow,
+  &-placement-bottomLeft > &-arrow,
+  &-placement-bottomRight > &-arrow {
+    top: @popover-distance - @popover-arrow-width + 2px;
+    border-top-color: @popover-bg;
+    border-right-color: transparent;
+    border-bottom-color: transparent;
+    border-left-color: @popover-bg;
+    box-shadow: -2px -2px 5px fade(@black, 6%);
+  }
+  &-placement-bottomCenter > &-arrow {
+    left: 50%;
+    transform: translateX(-50%) rotate(45deg);
+  }
+  &-placement-bottomLeft > &-arrow {
+    left: 16px;
+  }
+  &-placement-bottomRight > &-arrow {
+    right: 16px;
+  }
+
   &-menu {
     position: relative;
     margin: 0;

diff --git a/components/form/style/index.less b/components/form/style/index.less
@@ -66,6 +66,10 @@
     margin-bottom: 0;
   }
 
+  &-hidden {
+    display: none;
+  }
+
   // ==============================================================
   // =                            Label                           =
   // ==============================================================

diff --git a/components/input-number/style/rtl.less b/components/input-number/style/rtl.less
@@ -21,7 +21,7 @@
 
   &-input {
     .@{input-number-prefix-cls}-rtl & {
-      direction: rtl;
+      direction: ltr;
       text-align: right;
     }
   }

diff --git a/components/menu/style/dark.less b/components/menu/style/dark.less
@@ -1,6 +1,7 @@
 .@{menu-prefix-cls} {
   // dark theme
   &&-dark,
+  &-dark &-sub,
   &&-dark &-sub {
     color: @menu-dark-color;
     background: @menu-dark-bg;

diff --git a/components/modal/style/modal.less b/components/modal/style/modal.less
@@ -27,8 +27,8 @@
     margin: 0;
     color: @modal-heading-color;
     font-weight: 500;
-    font-size: @font-size-lg;
-    line-height: 22px;
+    font-size: @modal-header-title-font-size;
+    line-height: @modal-header-title-line-height;
     word-wrap: break-word;
   }
 
@@ -81,7 +81,7 @@
     padding: @modal-header-padding;
     color: @text-color;
     background: @modal-header-bg;
-    border-bottom: @border-width-base @border-style-base @modal-header-border-color-split;
+    border-bottom: @modal-header-border-width @modal-header-border-style @modal-header-border-color-split;
     border-radius: @border-radius-base @border-radius-base 0 0;
   }
 
@@ -96,7 +96,7 @@
     padding: @modal-footer-padding-vertical @modal-footer-padding-horizontal;
     text-align: right;
     background: @modal-footer-bg;
-    border-top: @border-width-base @border-style-base @modal-footer-border-color-split;
+    border-top: @modal-footer-border-width @modal-footer-border-style @modal-footer-border-color-split;
     border-radius: 0 0 @border-radius-base @border-radius-base;
 
     button + button {

diff --git a/components/notification/style/index.less b/components/notification/style/index.less
@@ -12,7 +12,6 @@
 
   position: fixed;
   z-index: @zindex-notification;
-  width: @notification-width;
   max-width: ~'calc(100vw - 32px)';
   margin-right: 24px;
 
@@ -35,11 +34,19 @@
   &-hook-holder,
   &-notice {
     position: relative;
+    width: @notification-width;
     margin-bottom: @notification-margin-bottom;
+    margin-left: auto;
     overflow: hidden;
     background: @notification-bg;
     border-radius: @border-radius-base;
     box-shadow: @shadow-2;
+
+    .@{notification-prefix-cls}-topLeft &,
+    .@{notification-prefix-cls}-bottomLeft & {
+      margin-right: auto;
+      margin-left: 0;
+    }
   }
 
   &-hook-holder > &-notice {

diff --git a/components/page-header/style/index.less b/components/page-header/style/index.less
@@ -102,8 +102,8 @@
 
   &-footer {
     margin-top: @margin-md;
-    .@{ant-prefix}-tabs-nav {
-      &::before {
+    .@{ant-prefix}-tabs {
+      > .@{ant-prefix}-tabs-nav::before {
         border: none;
       }
 

diff --git a/components/pagination/style/index.less b/components/pagination/style/index.less
@@ -165,17 +165,18 @@
   &-next {
     outline: 0;
 
-    a {
+    button {
       color: @text-color;
       user-select: none;
     }
 
-    &:hover a {
+    &:hover button {
       border-color: @primary-5;
     }
 
     .@{pagination-prefix-cls}-item-link {
       display: block;
+      width: 100%;
       height: 100%;
       font-size: 12px;
       text-align: center;
@@ -198,7 +199,6 @@
     &:hover,
     &:focus {
       cursor: not-allowed;
-      a,
       .@{pagination-prefix-cls}-item-link {
         color: @disabled-color;
         border-color: @border-color-base;
@@ -372,27 +372,18 @@
     }
 
     .@{pagination-prefix-cls}-item-link {
-      &,
-      &:hover,
-      &:focus {
-        color: @text-color-secondary;
-        background: @disabled-bg;
-        border-color: @border-color-base;
-        cursor: not-allowed;
-      }
+      color: @disabled-color;
+      background: @disabled-bg;
+      border-color: @border-color-base;
+      cursor: not-allowed;
     }
 
-    .@{pagination-prefix-cls}-jump-prev,
-    .@{pagination-prefix-cls}-jump-next {
-      &:focus,
-      &:hover {
-        .@{pagination-prefix-cls}-item-link-icon {
-          opacity: 0;
-        }
-        .@{pagination-prefix-cls}-item-ellipsis {
-          opacity: 1;
-        }
-      }
+    .@{pagination-prefix-cls}-item-link-icon {
+      opacity: 0;
+    }
+
+    .@{pagination-prefix-cls}-item-ellipsis {
+      opacity: 1;
     }
   }
 }

diff --git a/components/select/style/index.less b/components/select/style/index.less
@@ -120,7 +120,7 @@
         vertical-align: top;
       }
 
-      &:not(.@{iconfont-css-prefix}-down) {
+      &:not(.@{select-prefix-cls}-suffix) {
         pointer-events: auto;
       }
     }

diff --git a/components/skeleton/style/index.less b/components/skeleton/style/index.less
@@ -7,6 +7,7 @@
 @skeleton-paragraph-prefix-cls: ~'@{skeleton-prefix-cls}-paragraph';
 @skeleton-button-prefix-cls: ~'@{skeleton-prefix-cls}-button';
 @skeleton-input-prefix-cls: ~'@{skeleton-prefix-cls}-input';
+@skeleton-image-prefix-cls: ~'@{skeleton-prefix-cls}-image';
 
 .@{skeleton-prefix-cls} {
   display: table;
@@ -99,6 +100,10 @@
     .@{skeleton-input-prefix-cls} {
       .skeleton-color();
     }
+
+    .@{skeleton-image-prefix-cls} {
+      .skeleton-color();
+    }
   }
 
   // Skeleton element
@@ -115,6 +120,10 @@
     .@{skeleton-input-prefix-cls} {
       .skeleton-element-input();
     }
+
+    .@{skeleton-image-prefix-cls} {
+      .skeleton-element-image();
+    }
   }
 }
 // Button
@@ -168,6 +177,27 @@
   }
 }
 
+// Image
+.skeleton-element-image() {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  vertical-align: top;
+  background: @skeleton-color;
+
+  .skeleton-element-image-size(@image-size-base*2);
+
+  &-path {
+    fill: #bfbfbf;
+  }
+
+  &-svg {
+    .skeleton-element-image-size(@image-size-base);
+    max-width: @image-size-base * 4;
+    max-height: @image-size-base * 4;
+  }
+}
+
 .skeleton-element-avatar-size(@size) {
   width: @size;
   .skeleton-element-common-size(@size);
@@ -196,6 +226,15 @@
   .skeleton-element-common-size(@size);
 }
 
+.skeleton-element-image-size(@size) {
+  width: @size;
+  .skeleton-element-common-size(@size);
+
+  &.@{skeleton-image-prefix-cls}-circle {
+    border-radius: 50%;
+  }
+}
+
 .skeleton-element-common-size(@size) {
   height: @size;
   line-height: @size;

diff --git a/components/steps/style/progress-dot.less b/components/steps/style/progress-dot.less
@@ -47,9 +47,6 @@
         }
       }
     }
-    &-content {
-      width: @steps-desciption-max-width;
-    }
     &-process .@{steps-prefix-cls}-item-icon {
       position: relative;
       top: -1px;

diff --git a/components/style/themes/compact.less b/components/style/themes/compact.less
@@ -186,7 +186,7 @@
 
 // Modal
 // --
-@modal-header-padding: 11px @padding-lg;
+@modal-header-padding: 11px @modal-header-padding-horizontal;
 @modal-footer-padding-vertical: @padding-sm;
 @modal-header-close-size: 44px;
 @modal-confirm-body-padding: 24px 24px 16px;
@@ -292,3 +292,8 @@
 // Progress
 // ---
 @progress-circle-text-font-size: 0.833333em;
+
+// Image
+// ---
+@image-size-base: 48px;
+@image-font-size-base: 24px;