@qsxy/element-plus-react 1.0.0-next.18 → 1.0.0-next.21

package/theme-chalk/pagination/index.scss

@@ -1,303 +0,0 @@
-@use '../common/var';
-
-.#{$namespace}-pagination {
-    --el-pagination-font-size: 14px;
-    --el-pagination-bg-color: var(--el-fill-color-blank);
-    --el-pagination-text-color: var(--el-text-color-primary);
-    --el-pagination-border-radius: 2px;
-    --el-pagination-button-color: var(--el-text-color-primary);
-    --el-pagination-button-width: 32px;
-    --el-pagination-button-height: 32px;
-    --el-pagination-button-disabled-color: var(--el-text-color-placeholder);
-    --el-pagination-button-disabled-bg-color: var(--el-fill-color-blank);
-    --el-pagination-button-bg-color: var(--el-fill-color);
-    --el-pagination-hover-color: var(--el-color-primary);
-    --el-pagination-font-size-small: 12px;
-    --el-pagination-button-width-small: 24px;
-    --el-pagination-button-height-small: 24px;
-    --el-pagination-button-width-large: 40px;
-    --el-pagination-button-height-large: 40px;
-    --el-pagination-item-gap: 16px;
-    white-space: nowrap;
-    color: var(--el-pagination-text-color);
-    font-size: var(--el-pagination-font-size);
-    font-weight: 400;
-    display: flex;
-    align-items: center;
-
-    .el-input__inner {
-        text-align: center;
-        -moz-appearance: textfield;
-    }
-
-    .el-select {
-        width: 128px;
-    }
-
-    button {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        font-size: var(--el-pagination-font-size);
-        min-width: var(--el-pagination-button-width);
-        height: var(--el-pagination-button-height);
-        line-height: var(--el-pagination-button-height);
-        color: var(--el-pagination-button-color);
-        background: var(--el-pagination-bg-color);
-        padding: 0 4px;
-        border: none;
-        border-radius: var(--el-pagination-border-radius);
-        cursor: pointer;
-        text-align: center;
-        box-sizing: border-box;
-
-        * {
-            pointer-events: none;
-        }
-
-        &:focus {
-            outline: none;
-        }
-
-        &:hover {
-            color: var(--el-pagination-hover-color);
-        }
-
-        &.is-active {
-            color: var(--el-pagination-hover-color);
-            cursor: default;
-            font-weight: 700;
-        }
-
-        &.is-active.is-disabled {
-            font-weight: 700;
-            color: var(--el-text-color-secondary);
-        }
-
-        &:disabled,
-        &.is-disabled {
-            color: var(--el-pagination-button-disabled-color);
-            background-color: var(--el-pagination-button-disabled-bg-color);
-            cursor: not-allowed;
-        }
-
-        &:focus-visible {
-            outline: 1px solid var(--el-pagination-hover-color);
-            outline-offset: -1px;
-        }
-    }
-
-    .btn-prev .el-icon,
-    .btn-next .el-icon {
-        display: block;
-        font-size: 12px;
-        font-weight: 700;
-        width: inherit;
-    }
-
-    .el-pagination-item {
-        &:first-child,
-        &.is-simple {
-            margin-left: 0 !important;
-        }
-
-        &:last-child {
-            margin-right: 0 !important;
-        }
-    }
-
-    .btn-prev {
-        margin-left: var(--el-pagination-item-gap);
-    }
-
-    &.is-background {
-        .btn-prev,
-        .btn-next,
-        li {
-            margin: 0 4px;
-            background-color: var(--el-pagination-button-bg-color);
-        }
-
-        .btn-prev.is-active,
-        .btn-next.is-active,
-        li.is-active {
-            background-color: var(--el-color-primary);
-            color: var(--el-color-white);
-        }
-
-        .btn-prev:disabled,
-        .btn-prev.is-disabled,
-        .btn-next:disabled,
-        .btn-next.is-disabled,
-        li:disabled,
-        li.is-disabled {
-            color: var(--el-text-color-placeholder);
-            background-color: var(--el-disabled-bg-color);
-        }
-
-        .btn-prev:disabled.is-active,
-        .btn-prev.is-disabled.is-active,
-        .btn-next:disabled.is-active,
-        .btn-next.is-disabled.is-active,
-        li:disabled.is-active,
-        li.is-disabled.is-active {
-            color: var(--el-text-color-secondary);
-            background-color: var(--el-fill-color-dark);
-        }
-
-        .btn-prev {
-            margin-left: var(--el-pagination-item-gap);
-        }
-    }
-}
-
-.el-pagination__sizes,
-.el-pagination__total {
-    margin-left: var(--el-pagination-item-gap);
-    font-weight: 400;
-    color: var(--el-text-color-regular);
-}
-
-.el-pagination__total[disabled='true'] {
-    color: var(--el-text-color-placeholder);
-}
-
-.el-pagination__jump {
-    display: flex;
-    align-items: center;
-    margin-left: var(--el-pagination-item-gap);
-    font-weight: 400;
-    color: var(--el-text-color-regular);
-}
-
-.el-pagination__jump[disabled='true'] {
-    color: var(--el-text-color-placeholder);
-}
-
-.el-pagination__goto {
-    margin-right: 8px;
-}
-
-.el-pagination__editor {
-    text-align: center;
-    box-sizing: border-box;
-
-    &.el-input {
-        width: 56px;
-    }
-
-    .el-input__inner::-webkit-inner-spin-button,
-    .el-input__inner::-webkit-outer-spin-button {
-        -webkit-appearance: none;
-        margin: 0;
-    }
-}
-
-.el-pagination__classifier {
-    margin-left: 8px;
-}
-
-.el-pagination__rightwrapper {
-    flex: 1;
-    display: flex;
-    align-items: center;
-    justify-content: flex-end;
-}
-
-.el-pagination--small {
-    .btn-prev,
-    .btn-next,
-    .el-pager li {
-        height: var(--el-pagination-button-height-small);
-        line-height: var(--el-pagination-button-height-small);
-        font-size: var(--el-pagination-font-size-small);
-        min-width: var(--el-pagination-button-width-small);
-    }
-
-    span:not([class*='suffix']),
-    button {
-        font-size: var(--el-pagination-font-size-small);
-    }
-
-    .el-select {
-        width: 100px;
-    }
-}
-
-.el-pagination--large {
-    .btn-prev,
-    .btn-next,
-    .el-pager li {
-        height: var(--el-pagination-button-height-large);
-        line-height: var(--el-pagination-button-height-large);
-        min-width: var(--el-pagination-button-width-large);
-    }
-
-    .el-select {
-        width: 160px;
-    }
-}
-
-.#{$namespace}-pager {
-    -webkit-user-select: none;
-    user-select: none;
-    list-style: none;
-    font-size: 0;
-    padding: 0;
-    margin: 0;
-    display: flex;
-    align-items: center;
-
-    li {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        font-size: var(--el-pagination-font-size);
-        min-width: var(--el-pagination-button-width);
-        height: var(--el-pagination-button-height);
-        line-height: var(--el-pagination-button-height);
-        color: var(--el-pagination-button-color);
-        background: var(--el-pagination-bg-color);
-        padding: 0 4px;
-        border: none;
-        border-radius: var(--el-pagination-border-radius);
-        cursor: pointer;
-        text-align: center;
-        box-sizing: border-box;
-
-        * {
-            pointer-events: none;
-        }
-
-        &:focus {
-            outline: none;
-        }
-
-        &:hover {
-            color: var(--el-pagination-hover-color);
-        }
-
-        &.is-active {
-            color: var(--el-pagination-hover-color);
-            cursor: default;
-            font-weight: 700;
-        }
-
-        &.is-active.is-disabled {
-            font-weight: 700;
-            color: var(--el-text-color-secondary);
-        }
-
-        &:disabled,
-        &.is-disabled {
-            color: var(--el-pagination-button-disabled-color);
-            background-color: var(--el-pagination-button-disabled-bg-color);
-            cursor: not-allowed;
-        }
-
-        &:focus-visible {
-            outline: 1px solid var(--el-pagination-hover-color);
-            outline-offset: -1px;
-        }
-    }
-}

package/theme-chalk/placeholder/index.scss

@@ -1,120 +0,0 @@
-@use '../common/var';
-
-.#{$namespace}-skeleton {
-    --#{$namespace}-skeleton-color: var(--#{$namespace}-fill-color);
-    --#{$namespace}-skeleton-to-color: var(--#{$namespace}-fill-color-darker);
-}
-
-.is-dark {
-    .#{$namespace}-skeleton {
-        --#{$namespace}-skeleton-color: #3c3f43;
-        --#{$namespace}-skeleton-to-color: #484c50;
-    }
-}
-
-.#{$namespace}-skeleton {
-    -webkit-box-pack: start;
-    -ms-flex-pack: start;
-    -webkit-box-align: start;
-    -ms-flex-align: start;
-    align-items: flex-start;
-    justify-content: flex-start;
-    display: flex;
-
-    &-paragraph {
-        justify-content: flex-start;
-        align-items: flex-start;
-
-        &-graph {
-            flex: 0 0 auto;
-            width: 60px;
-            height: 60px;
-            border-radius: 2px;
-            margin-right: 20px;
-            background-color: var(--#{$namespace}-skeleton-color);
-
-            &-circle {
-                border-radius: 50%;
-            }
-
-            &-image {
-                width: 200px;
-                height: 200px;
-                display: flex;
-                align-items: center;
-                justify-content: center;
-                border-radius: 0;
-
-                & > svg {
-                    color: var(--el-border-color);
-                    fill: currentColor;
-                    width: 22%;
-                    height: 22%;
-                }
-            }
-
-            &-image &-inner {
-                width: 12px;
-                height: 12px;
-                right: 18px;
-                top: 10px;
-                border-radius: 50%;
-                position: absolute;
-            }
-        }
-
-        &-rows {
-            width: 100%;
-
-            .#{$namespace}-skeleton__item {
-                background-color: var(--#{$namespace}-skeleton-color);
-                border-radius: 4px;
-            }
-        }
-    }
-
-    &-grid {
-        &-col {
-            flex: 1;
-            display: flex;
-            flex-direction: column;
-            align-items: flex-end;
-
-            & > p {
-                background-color: var(--#{$namespace}-skeleton-color);
-                border-radius: 4px;
-            }
-
-            &:first-child {
-                align-items: flex-start; //first col align left
-            }
-        }
-    }
-
-    &-graph {
-        display: inline-block;
-        width: 100%;
-        background-color: var(--#{$namespace}-skeleton-color);
-    }
-
-    &-active {
-        &.#{$namespace}-skeleton-graph,
-        .#{$namespace}-skeleton-paragraph-graph-image,
-        .#{$namespace}-skeleton-grid-col > p,
-        .#{$namespace}-skeleton-paragraph-rows > p {
-            background: linear-gradient(-45deg, var(--#{$namespace}-skeleton-color) 25%, var(--#{$namespace}-skeleton-to-color) 37%, var(--#{$namespace}-skeleton-color) 63%);
-            background-size: 400% 100% !important;
-            animation: skeleton-active 1.4s ease infinite;
-        }
-    }
-
-    @keyframes skeleton-active {
-        0% {
-            background-position: 100% 50%;
-        }
-
-        100% {
-            background-position: 0 50%;
-        }
-    }
-}

package/theme-chalk/radio/index.scss

@@ -1,2 +0,0 @@
-@import './radio.scss';
-@import './radio-button.scss';

package/theme-chalk/time-line/index.scss

@@ -1,2 +0,0 @@
-@import './timeline';
-@import './timeline-item';