@ebuilding/base 2.0.0

package/style/variable.less

@@ -0,0 +1,238 @@
+//主题色
+//@theme-color: #214a81;
+@theme-color: #1177fb; //#3554d1; //#1177fb; // #3554d1; //#00b2c2; //#5b87ff; //#6090df; // #1890ff; // #292961; // #6e8ae5;
+
+@theme-hover: #4f85ff; //#21c6cf;
+
+//#21c6cf;
+
+@line-color: #dfdfdf;
+
+@border-color: #eaeaea; //#f5f7fa; //#f0f0f0; //#e8e8e8;
+@border-cl: 'red';
+@layout-gutte: 6px;
+
+//默认边框变量
+@border: 1px solid #eaeaea; //#f5f7fa; //#f0f0f0;
+
+@font-size: 12px;
+
+@table-color: #f5f7fa;
+
+@background: #edeff3;
+
+@color_0: #56afde;
+@color_1: #52ccea;
+@color_2: #7ee3e5;
+@color_3: #ade8c1;
+@color_4: #aba5f4;
+@color_5: #978deb;
+@color_6: #a5c7fd;
+@color_7: #fcdf75;
+@color_8: #fdad92;
+@color_9: #f987a3;
+@color_10: #e37ab9;
+@color_11: #e8a0d6;
+@color_12: #e8c3f2;
+@color_13: #56afde;
+@color_14: #52ccea;
+@color_15: #7ee3e5;
+@color_16: #ade8c1;
+@color_17: #aba5f4;
+@color_18: #978deb;
+@color_19: #a5c7fd;
+@color_20: #fcdf75;
+@color_21: #fdad92;
+@color_22: #f987a3;
+@color_23: #e37ab9;
+@color_24: #e8a0d6;
+
+@okr_str: #3554d1;
+@okr_team: #8c94fc;
+@okr_self: #b7a0fc;
+
+/*状态*/
+@status_draft: #8c8c8c;
+@status_running: #4f85ff;
+@status_waiting: #4f85ff;
+@status_finish: #2cb792;
+@status_approved: #2cb792;
+@status_stop: #ffd317;
+@status_backed: #ffd317;
+@status_rejected: #ff7752;
+@status_abort: #ff7752;
+
+@flyColor: #464646;
+@flyFontColor: #ddd;
+@flyBorderColor: #686868;
+@flyRailColor: #ffffff14;
+@flyTrackColor: #ffffff26;
+@flyPopBorderColor: #535353;
+@flyBgColor: #202020;
+
+.hoverBackGround(@rgba: 1) {
+  background: rgba(53, 84, 209, @rgba);
+}
+
+//字体超出
+.vxfontEllipsis(@lineclamp: 1) {
+  display: -webkit-box;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  -webkit-line-clamp: @lineclamp;
+  -webkit-box-orient: vertical;
+}
+
+//滚动条
+.vxscrollbar() {
+  overflow-x: overlay;
+  overflow-y: overlay;
+
+  &::-webkit-scrollbar {
+    width: 8px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: #94949475;
+    border-radius: 7px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background-color: #fff;
+  }
+}
+
+.vxscrollbarx() {
+  scrollbar-color: transparent;
+  overflow-x: scroll;
+
+  &::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: #dddfe2;
+    border-radius: 6px;
+    outline: 0 solid #dddfe2;
+  }
+
+  ::-webkit-scrollbar-corner {
+    background: 0 0;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: rgba(128, 128, 128, 0.5);
+    border-radius: 6px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: 0 0;
+    border-radius: 6px;
+  }
+}
+
+.vxscrollbary() {
+  scrollbar-color: transparent;
+  overflow-y: scroll;
+
+  &::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: #dddfe2;
+    border-radius: 6px;
+    outline: 0 solid #dddfe2;
+  }
+
+  ::-webkit-scrollbar-corner {
+    background: 0 0;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: rgba(128, 128, 128, 0.5);
+    border-radius: 6px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: 0 0;
+    border-radius: 6px;
+  }
+}
+
+.vxscrollbaryHiden() {
+  scrollbar-color: transparent;
+  overflow-y: scroll;
+  scrollbar-width: thin;
+  overflow: hidden scroll !important;
+
+  &::-webkit-scrollbar {
+    width: 8px;
+    height: 8px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: #dddfe2;
+    border-radius: 6px;
+    outline: 0 solid #dddfe2;
+  }
+
+  ::-webkit-scrollbar-corner {
+    background: 0 0;
+  }
+
+  ::-webkit-scrollbar-thumb {
+    background: rgba(128, 128, 128, 0.5);
+    border-radius: 6px;
+  }
+
+  ::-webkit-scrollbar-track {
+    background: 0 0;
+    border-radius: 6px;
+  }
+}
+
+.flyScrollbar(@defaultColor: #202020) {
+  overflow-x: overlay;
+  overflow-y: overlay;
+
+  &::-webkit-scrollbar {
+    width: 6px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    background-color: #94949475;
+    border-radius: 7px;
+  }
+
+  &::-webkit-scrollbar-track {
+    background-color: @defaultColor;
+  }
+}
+
+.boxShadow() {
+  background: #fff;
+  border-radius: 8px;
+  box-shadow: 0 10px 18px 0 rgba(182, 193, 215, 0.2);
+}
+
+.boxShadowHover() {
+  box-shadow: 0 10px 18px 0 rgba(182, 193, 215, 0.5);
+  //cursor: pointer;
+}
+
+.defaultContent() {
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+}
+
+.defaultWork() {
+  .work-content {
+    padding: 15px;
+  }
+}