init: userbase front/service/deploy source (CI builds front via Gitea Actions)

front/src/assets/styles/utils/_mixins.scss

@@ -0,0 +1,13 @@
+@mixin tag_mixin($bgColor,$textColor) {
+    width:64px;
+    height:20px ;
+    padding: 0 5px;
+    background: $bgColor;
+    color: $textColor;
+    font-size: 12px;
+    border-radius: 2px 2px 2px 2px;
+    text-align: center;
+    line-height: 20px;
+}
+
+

front/src/assets/styles/utils/_utils.scss

@@ -0,0 +1,170 @@
+// utils 工具// 颜色
+
+@import "./varible";
+.bg-error {
+    background-color: $color-error !important;
+}
+.text-error {
+    color: $color-error !important;
+}
+.text-success {
+    color: $color-success !important;
+}
+.text-warning {
+    color: $color-warning !important;
+}
+.text-primary {
+    color: $color-primary !important;
+}
+.text-normal {
+    color: #404042 !important;
+}
+.text-black {
+    color: #000;
+}
+.text-dark {
+    color: #333;
+}
+.text-deep {
+    color: #555;
+}
+.text-weak {
+    color: #b3b3b3;
+}
+.text-white {
+    color: #fff;
+}
+
+.text-error.disabled {
+    color: #aaa !important;
+}
+
+// 文字对齐
+.tl {
+    text-align: left;
+}
+.tc {
+    text-align: center;
+}
+.tr {
+    text-align: right;
+}
+// 浮动与清除浮动
+.fl {
+    float: left;
+}
+.fr {
+    float: right;
+}
+.fix {
+    *zoom: 1;
+}
+.fix:after {
+    display: table;
+    content: "";
+    clear: both;
+}
+// 显示
+.dn {
+    display: none;
+}
+.di {
+    display: inline;
+}
+.db {
+    display: block;
+}
+.dib {
+    display: inline-block;
+}
+.dt {
+    display: table;
+}
+div.dib {
+    *display: inline;
+    *zoom: 1;
+}
+.vm {
+    vertical-align: middle;
+}
+.vib {
+    display: inline-block;
+    vertical-align: middle;
+}
+.ovh {
+    overflow: hidden;
+}
+// 定位
+.pr {
+    position: relative;
+}
+.pa {
+    position: absolute;
+}
+.pf {
+    position: fixed;
+}
+
+.align-middle {
+    position: relative;
+    top: 50%;
+    transform: translateY(-50%);
+}
+.align-middle-wrap {
+    display: flex;
+    align-items: center;
+}
+
+.text-ellipsis {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+
+@for $i from 1 through 100 {
+    .width-#{$i} {
+        width: $i * 1%;
+    }
+    .height-#{$i} {
+        height: $i * 1px;
+    }
+    // @if $i<50 and $i%2==0 {
+    // @if $i<50  {
+    .ml-#{$i} {
+        margin-left: $i * 1px !important;
+    }
+    .mr-#{$i} {
+        margin-right: $i * 1px !important;
+    }
+    .mt-#{$i} {
+        margin-top: $i * 1px !important;
+    }
+    .mb-#{$i} {
+        margin-bottom: $i * 1px !important;
+    }
+    // }
+}
+
+// 字体
+@for $i from 10 through 28 {
+    .f#{$i} {
+        font-size: $i * 1px;
+    }
+}
+
+// .chart-box {
+//     height: 50px;
+//     width: 100%;
+//     border-bottom: 50px solid;
+//     border-image: linear-gradient(90deg, #f55c65 0%, #fcced0 48%, #d4dffc 52%, #7194f5 100%) 50 50 50 50;
+// }
+// @for $i from 0 through 50 {
+//     .blue-#{$i} {
+//         background-color: rgba(#7194f5, 0.1 * $i * 0.2);
+//     }
+// }
+// @for $i from 0 through 50 {
+//     .red-#{$i} {
+//         background-color: rgba(#f55c65, 0.1 * $i * 0.2);
+//     }
+// }

front/src/assets/styles/utils/_varible.scss

@@ -0,0 +1,22 @@
+/*scss变量*/
+
+// 主题色
+$color-error: #e8684a;
+$color-success: #45b972;
+$color-warning: #e9b954;
+$color-primary: #5979ea;
+
+// 文字色
+$color-black: #404042;
+$color-dark: #333;
+$color-deep: #555;
+$color-pl: #999999;
+$color-weak: #b3b3b3;
+$color-white: #fff;
+
+// 背景色
+$bg-bar: #f9f9f9;
+$bg-page: #f3f3f3;
+$bg-page-light: #f9f9f9;
+
+$border-color: #e9e9e9;