@el-plus/theme-chalk 0.0.1

package/package.json

@@ -0,0 +1,34 @@
+{
+  "name": "@el-plus/theme-chalk",
+  "version": "0.0.1",
+  "description": "",
+  "main": "index.css",
+  "keywords": [],
+  "author": "",
+  "license": "MIT",
+  "devDependencies": {
+    "@types/vinyl": "^2.0.12",
+    "rimraf": "^6.1.2",
+    "tsx": "^4.21.0",
+    "consola": "^3.4.2",
+    "cssnano": "^7.1.2",
+    "gulp": "^4.0.2",
+    "gulp-autoprefixer": "^10.0.0",
+    "gulp-rename": "^2.1.0",
+    "gulp-sass": "^6.0.1",
+    "postcss": "^8.5.6",
+    "sass": "^1.97.2",
+    "@el-plus/build": "^1.0.0"
+  },
+  "files": [
+    "src"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "clean": "rimraf dist",
+    "build": "gulp --require tsx/dist/loader.cjs -f gulpfile.ts"
+  }
+}

package/src/base.scss

@@ -0,0 +1,11 @@
+@use 'common/var.scss' as *;
+
+.red {
+  color: red;
+  display: flex; /* 每个属性单独写，不层叠 */
+  -webkit-box-display: flex;
+  -ms-flexbox-display: flex;
+  -webkit-display: flex;
+  -webkit-transform: rotate(10deg);
+  transform: rotate(10deg); /* 没有缩进 */
+}

package/src/buttons.scss

@@ -0,0 +1,18 @@
+@use 'mixins/mixins.scss' as *;
+@use 'common/var.scss' as *;
+
+@include b(button) {
+    padding: 9px 15px;
+    height: auto;
+
+
+    &.el-button--text {
+        padding: 0;
+        // border: 0;
+        // color: var(--el-button-hover-text-color)
+    }
+
+    &.el-button+.el-button {
+        margin-left: 10px;
+    }
+}

package/src/common/var.scss

@@ -0,0 +1 @@
+$color-priamy: #409eff;

package/src/form.scss

@@ -0,0 +1,55 @@
+@use 'mixins/mixins.scss' as *;
+@use 'common/var.scss' as *;
+
+@include b(form) {
+    position: relative;
+
+    @include e(fold) {
+        position: absolute;
+        bottom: 23px;
+        right: 0;
+        width: 70px;
+        text-align: center;
+        cursor: pointer;
+        color: #367ef5;
+        font-size: 14px;
+
+        &:hover {
+            text-decoration: underline;
+        }
+    }
+
+    @include is(fold) {
+        padding-right: 70px;
+    }
+
+    .el-form-item--small {
+        margin-bottom: 18px;
+
+        .el-form-item__label {
+            padding-right: 6px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            padding-left: 18px;
+            line-height: 32px;
+            height: 32px;
+            display: block;
+        }
+
+        .el-form-item__content {
+            line-height: 32px;
+            font-size: 13px;
+
+            .el-input {
+                font-size: 13px;
+                height: 32px;
+            }
+             .el-select__wrapper{
+                line-height: 32px;
+    min-height: 32px;
+             }
+        }
+    }
+
+}

package/src/index.scss

@@ -0,0 +1,4 @@
+@use './form.scss';
+@use './table.scss';
+@use './buttons.scss';
+@use './search-list-page.scss';

package/src/mixins/config.scss

@@ -0,0 +1,4 @@
+$namespace: 'ep';
+$element-separator: '__';
+$modifier-separator: '--';
+$state-separator: 'is-';

package/src/mixins/mixins.scss

@@ -0,0 +1,38 @@
+@use 'config' as *;
+@forward 'config';
+
+// .ep-button {}
+@mixin b($block) {
+    $B: $namespace + '-' + $block;
+
+    .#{$B} {
+        @content;
+    }
+}
+
+// &__element => .ep-button__element {}
+@mixin e($element) {
+    @at-root {
+        #{&+$element-separator + $element} {
+            @content;
+        }
+    }
+}
+
+// &--modifier => .ep-button--modifier {}
+@mixin m($modifier) {
+    @at-root {
+        #{&+$modifier-separator + $modifier} {
+            @content;
+        }
+    }
+}
+
+// .ep-button.is-xxx {}
+@mixin is($state) {
+    @at-root {
+        #{&+'.'+$state-separator + $state} {
+            @content;
+        }
+    }
+}

package/src/search-list-page.scss

@@ -0,0 +1,23 @@
+@use 'mixins/mixins.scss' as *;
+@use 'common/var.scss' as *;
+
+@include b(search-list-page) {
+    #middle {
+        overflow: hidden;
+    }
+
+    @include e(middle-left) {
+        float: left;
+
+        .el-button {
+            margin: 16px 0;
+        }
+    }
+
+    @include e(middle-right) {
+        float: right;
+         .el-button {
+            margin: 16px 0;
+        }
+    }
+}

package/src/table.scss

@@ -0,0 +1,57 @@
+@use 'mixins/mixins.scss' as *;
+@use 'common/var.scss' as *;
+
+@include b(table) {
+    @include e(action-buttons) {
+        white-space: nowrap;
+    }
+    .table-column-link{
+        .el-form-item{
+            display: inline-block;
+            .el-form-item__label{
+                display: none;
+            }
+        }
+    }
+
+    .el-table {
+        thead tr {
+
+            // line-height: 35px;
+            th {
+                height: 42px;
+            }
+        }
+
+        td,
+        th {
+            padding: 3px 0;
+        }
+    }
+
+    .el-form-item__error {
+        position: unset;
+        text-align: left;
+    }
+
+    .el-form-item {
+        margin-bottom: 0;
+
+        .el-form-item__label {
+            padding: 0;
+        }
+    }
+
+    .el-pagination {
+        margin-top: 12px;
+        --el-pagination-font-size: 13px;
+
+        .el-select {
+            --el-select-font-size: 13px;
+
+            .el-select__wrapper {
+                font-size: 13px;
+            }
+        }
+    }
+}