@douyinfe/semi-ui 2.1.4 → 2.2.0-beta.1

package/dist/css/semi.css

@@ -1,4 +1,3 @@
-@charset "UTF-8";
 /* shadow */
 /* sizing */
 /* spacing */
@@ -400,7 +399,7 @@ body, body[theme-mode=dark] .semi-always-light {
   --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
   --semi-color-border: rgba(var(--semi-grey-9), .08);
   --semi-color-nav-bg: rgba(var(--semi-white), 1);
-  --semi-overlay-bg: rgba(22, 22, 26, .6);
+  --semi-color-overlay-bg: rgba(22, 22, 26, .6);
   --semi-color-fill-0: rgba(var(--semi-grey-8), .05);
   --semi-color-fill-1: rgba(var(--semi-grey-8), .09);
   --semi-color-fill-2: rgba(var(--semi-grey-8), .13);
@@ -487,7 +486,7 @@ body[theme-mode=dark], body .semi-always-dark {
   --semi-color-link-visited: rgba(var(--semi-blue-5), 1);
   --semi-color-nav-bg: rgba(35, 36, 41, 1);
   --semi-shadow-elevated: inset 0 0 0 1px rgba(255, 255, 255, .1), 0 4px 14px rgba(0, 0, 0, .25);
-  --semi-overlay-bg: rgba(22, 22, 26, .6);
+  --semi-color-overlay-bg: rgba(22, 22, 26, .6);
   --semi-color-fill-0: rgba(var(--semi-white), .05);
   --semi-color-fill-1: rgba(var(--semi-white), .09);
   --semi-color-fill-2: rgba(var(--semi-white), .13);
@@ -2686,11 +2685,11 @@ body[theme-mode=dark], body .semi-always-dark {
 .semi-cascader-selection-tag:first-child {
   margin-left: 0;
 }
-.semi-cascader-selection-tag-disabled {
+.semi-cascader-selection-tag-disabled.semi-tag {
   color: var(--semi-color-disabled-text);
   cursor: not-allowed;
 }
-.semi-cascader-selection-tag-disabled .semi-tag-close {
+.semi-cascader-selection-tag-disabled.semi-tag .semi-tag-close {
   color: var(--semi-color-disabled-text);
   cursor: not-allowed;
   pointer-events: none;
@@ -3498,6 +3497,9 @@ body[theme-mode=dark], body .semi-always-dark {
   font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif;
   min-height: 24px;
 }
+.semi-datepicker-month-grid[x-panel-yearandmonth-open-type=left] .semi-datepicker-weeks, .semi-datepicker-month-grid[x-panel-yearandmonth-open-type=right] .semi-datepicker-weeks {
+  min-height: 216px;
+}
 .semi-datepicker-panel-yam {
   max-width: 284px;
 }
@@ -3987,6 +3989,9 @@ body[theme-mode=dark], body .semi-always-dark {
 .semi-datepicker-compact .semi-datepicker-month-grid .semi-scrolllist-item-wheel .semi-scrolllist-shade-post {
   margin-top: 17px;
 }
+.semi-datepicker-compact .semi-datepicker-month-grid[x-panel-yearandmonth-open-type=left] .semi-datepicker-weeks, .semi-datepicker-compact .semi-datepicker-month-grid[x-panel-yearandmonth-open-type=right] .semi-datepicker-weeks {
+  min-height: 168px;
+}
 .semi-datepicker-compact.semi-datepicker-panel-yam .semi-scrolllist {
   font-size: 12px;
   line-height: 16px;
@@ -11975,7 +11980,7 @@ body[theme-mode=dark], body .semi-always-dark {
   right: 0;
   left: 0;
   bottom: 0;
-  background-color: var(--semi-overlay-bg);
+  background-color: var(--semi-color-overlay-bg);
   height: 100%;
   z-index: 1000;
 }
@@ -13026,19 +13031,23 @@ body[theme-mode=dark], body .semi-always-dark {
   color: var(--semi-color-success);
 }
 .semi-notification-notice-light.semi-notification-notice-warning {
-  background-color: var(--semi-color-warning-light-default);
+  background-image: linear-gradient(0deg, var(--semi-color-warning-light-default), var(--semi-color-warning-light-default));
+  background-color: var(--semi-color-bg-0);
   border: 1px solid var(--semi-color-warning);
 }
 .semi-notification-notice-light.semi-notification-notice-success {
-  background-color: var(--semi-color-success-light-default);
+  background-image: linear-gradient(0deg, var(--semi-color-success-light-default), var(--semi-color-success-light-default));
+  background-color: var(--semi-color-bg-0);
   border: 1px solid var(--semi-color-success);
 }
 .semi-notification-notice-light.semi-notification-notice-info, .semi-notification-notice-light.semi-notification-notice-default {
-  background-color: var(--semi-color-info-light-default);
+  background-image: linear-gradient(0deg, var(--semi-color-info-light-default), var(--semi-color-info-light-default));
+  background-color: var(--semi-color-bg-0);
   border: 1px solid var(--semi-color-info);
 }
 .semi-notification-notice-light.semi-notification-notice-error {
-  background-color: var(--semi-color-danger-light-default);
+  background-image: linear-gradient(0deg, var(--semi-color-danger-light-default), var(--semi-color-danger-light-default));
+  background-color: var(--semi-color-bg-0);
   border: 1px solid var(--semi-color-danger);
 }
 .semi-notification-notice-title {
@@ -14842,7 +14851,7 @@ body[theme-mode=dark], body .semi-always-dark {
   left: 0;
   width: 100%;
   height: 100%;
-  background-color: var(--semi-overlay-bg);
+  background-color: var(--semi-color-overlay-bg);
 }
 .semi-sidesheet-mask-hidden {
   display: none;
@@ -16154,7 +16163,7 @@ body[theme-mode=dark], body .semi-always-dark {
   user-select: none;
 }
 .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left, .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right {
-  z-index: 1;
+  z-index: 101;
   position: sticky;
   background-color: var(--semi-color-bg-2);
 }
@@ -16268,7 +16277,7 @@ body[theme-mode=dark], body .semi-always-dark {
   background-color: var(--semi-color-fill-0);
 }
 .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left, .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right {
-  z-index: 1;
+  z-index: 101;
   position: sticky;
   background-color: var(--semi-color-bg-2);
 }
@@ -17753,6 +17762,9 @@ body[theme-mode=dark], body .semi-always-dark {
 .semi-timeline-alternate .semi-timeline-item-tail, .semi-timeline-alternate .semi-timeline-item-head, .semi-timeline-alternate .semi-timeline-item-head-custom, .semi-timeline-right .semi-timeline-item-tail, .semi-timeline-right .semi-timeline-item-head, .semi-timeline-right .semi-timeline-item-head-custom, .semi-timeline-center .semi-timeline-item-tail, .semi-timeline-center .semi-timeline-item-head, .semi-timeline-center .semi-timeline-item-head-custom {
   left: 50%;
 }
+.semi-timeline-alternate .semi-timeline-item-head.semi-timeline-item-head-custom, .semi-timeline-right .semi-timeline-item-head.semi-timeline-item-head-custom, .semi-timeline-center .semi-timeline-item-head.semi-timeline-item-head-custom {
+  margin-left: 0;
+}
 .semi-timeline-alternate .semi-timeline-item-head, .semi-timeline-right .semi-timeline-item-head, .semi-timeline-center .semi-timeline-item-head {
   margin-left: -4px;
 }
@@ -19400,6 +19412,8 @@ p.semi-typography-extended,
   display: flex;
   flex-wrap: wrap;
   flex-shrink: 0;
+  gap: 8px;
+  margin-bottom: 8px;
 }
 .semi-upload-file-list-main p {
   display: flex;
@@ -19426,8 +19440,6 @@ p.semi-typography-extended,
   justify-content: space-between;
   height: 52px;
   width: 250px;
-  margin-right: 8px;
-  margin-bottom: 8px;
   background-color: var(--semi-color-fill-0);
   cursor: pointer;
 }
@@ -19562,16 +19574,16 @@ p.semi-typography-extended,
   flex-direction: column;
 }
 .semi-upload-picture[x-prompt-pos=bottom] .semi-upload-prompt {
-  order: 2;
+  order: 1;
 }
 .semi-upload-picture[x-prompt-pos=bottom] .semi-upload-add {
-  order: 1;
+  order: 0;
 }
 .semi-upload-picture[x-prompt-pos=right] .semi-upload-prompt {
-  order: 2;
+  order: 1;
 }
 .semi-upload-picture[x-prompt-pos=right] .semi-upload-add {
-  order: 1;
+  order: 0;
 }
 .semi-upload-picture-add {
   background-color: var(--semi-color-fill-0);
@@ -19608,11 +19620,14 @@ p.semi-typography-extended,
   margin-bottom: 0;
 }
 .semi-upload-picture-file-card {
+  display: flex;
+  align-items: center;
+  justify-content: center;
   height: 96px;
   width: 96px;
+  border-radius: var(--semi-border-radius-small);
   position: relative;
-  margin-right: 8px;
-  margin-bottom: 8px;
+  overflow: hidden;
 }
 .semi-upload-picture-file-card img {
   height: 96px;
@@ -19623,7 +19638,7 @@ p.semi-typography-extended,
 .semi-upload-picture-file-card-close {
   width: 16px;
   height: 16px;
-  background-color: var(--semi-overlay-bg);
+  background-color: var(--semi-color-overlay-bg);
   position: absolute;
   top: 8px;
   right: 8px;
@@ -19677,6 +19692,22 @@ p.semi-typography-extended,
   color: var(--semi-color-white);
   transform: translate3D(-50%, -50%, 0);
 }
+.semi-upload-picture-file-card-pic-info {
+  display: inline-flex;
+  box-sizing: border-box;
+  justify-content: space-between;
+  align-items: center;
+  position: absolute;
+  width: 100%;
+  height: 24px;
+  padding: 0 10px;
+  bottom: 0;
+  left: 0;
+  color: var(--semi-color-white);
+  font-size: 12px;
+  font-weight: 600;
+  background: linear-gradient(0deg, rgba(22, 22, 26, 0.3) 0%, rgba(22, 22, 26, 0) 77.08%);
+}
 .semi-upload-picture-file-card-icon-loading, .semi-upload-picture-file-card-icon-error {
   position: absolute;
   bottom: 6px;
@@ -19689,6 +19720,9 @@ p.semi-typography-extended,
 .semi-upload-picture-file-card-show-pointer {
   cursor: pointer;
 }
+.semi-upload-picture-file-card-error {
+  outline: 1px solid var(--semi-color-danger);
+}
 .semi-upload-drag-area {
   border-radius: var(--semi-border-radius-small);
   border: 2px dashed var(--semi-color-border);
@@ -19769,11 +19803,6 @@ p.semi-typography-extended,
 .semi-portal-rtl .semi-upload-file-list-title-clear {
   display: inline-block;
 }
-.semi-rtl .semi-upload-file-card,
-.semi-portal-rtl .semi-upload-file-card {
-  margin-right: 0;
-  margin-left: 8px;
-}
 .semi-rtl .semi-upload-file-card-info-size,
 .semi-portal-rtl .semi-upload-file-card-info-size {
   margin-left: 0;
@@ -19790,11 +19819,6 @@ p.semi-typography-extended,
   margin-right: 0;
   margin-left: 2px;
 }
-.semi-rtl .semi-upload-picture-file-card,
-.semi-portal-rtl .semi-upload-picture-file-card {
-  margin-right: 0;
-  margin-left: 8px;
-}
 .semi-rtl .semi-upload-picture-file-card-close,
 .semi-portal-rtl .semi-upload-picture-file-card-close {
   right: auto;