前端初始化

2026-08-21 15:36:24 +08:00
commit e4d8ecde13
14411 changed files with 2275932 additions and 0 deletions
@@ -0,0 +1,135 @@
+@use 'mixins/mixins' as *;
+@use 'common/var' as *;
+
+@mixin alternate-tail-node-center {
+  @include e((tail, node)) {
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+
+@include b(timeline-item) {
+  position: relative;
+  padding-bottom: 20px;
+
+  @include e(wrapper) {
+    box-sizing: content-box;
+    position: relative;
+    top: -3px;
+  }
+
+  @include e(tail) {
+    position: absolute;
+    height: 100%;
+    border-left: 2px solid getCssVar('timeline-node-color');
+  }
+
+  & .#{$namespace}-timeline-item__icon {
+    color: getCssVar('color-white');
+    font-size: getCssVar('font-size-small');
+  }
+
+  @include e(node) {
+    position: absolute;
+    background-color: getCssVar('timeline-node-color');
+    border-color: getCssVar('timeline-node-color');
+    border-radius: 50%;
+    box-sizing: border-box;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    @include m(normal) {
+      width: getCssVar('timeline-node-size-normal');
+      height: getCssVar('timeline-node-size-normal');
+    }
+    @include m(large) {
+      width: getCssVar('timeline-node-size-large');
+      height: getCssVar('timeline-node-size-large');
+    }
+    @include when(hollow) {
+      background: getCssVar('color-white');
+      border-style: solid;
+      border-width: 2px;
+    }
+
+    @each $type in (primary, success, warning, danger, info) {
+      @include m($type) {
+        background-color: getCssVar('color', $type);
+        border-color: getCssVar('color', $type);
+      }
+    }
+  }
+
+  @include e(dot) {
+    position: absolute;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  @include e(content) {
+    color: getCssVar('text-color', 'primary');
+  }
+
+  @include e(timestamp) {
+    color: getCssVar('text-color', 'secondary');
+    line-height: 1;
+    font-size: getCssVar('font-size-small');
+
+    @include when(top) {
+      margin-bottom: 8px;
+      padding-top: 4px;
+    }
+    @include when(bottom) {
+      margin-top: 8px;
+    }
+  }
+
+  @include when(start) {
+    @include e(wrapper) {
+      padding-left: 28px;
+    }
+
+    @include e(tail) {
+      left: 4px;
+    }
+
+    @include e(node) {
+      @include m(normal) {
+        left: -1px;
+      }
+      @include m(large) {
+        left: -2px;
+      }
+    }
+  }
+
+  @include when(end) {
+    @include e(wrapper) {
+      padding-right: 28px;
+      text-align: right;
+    }
+
+    @include e(tail) {
+      right: 4px;
+    }
+
+    @include e(node) {
+      @include m(normal) {
+        right: -1px;
+      }
+      @include m(large) {
+        right: -2px;
+      }
+    }
+  }
+
+  @include when(alternate) {
+    @include alternate-tail-node-center;
+  }
+
+  @include when(alternate-reverse) {
+    @include alternate-tail-node-center;
+  }
+}