🔖 项目重命名.

orion-visor-ui/src/assets/style/global.less

@@ -0,0 +1,320 @@
+* {
+  box-sizing: border-box;
+}
+
+html,
+body {
+  width: 100%;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  font-size: 14px;
+  background-color: var(--color-bg-1);
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+}
+
+// -- echarts
+.echarts-tooltip-diy {
+  background: linear-gradient(304.17deg,
+    rgba(253, 254, 255, 0.6) -6.04%,
+  rgba(244, 247, 252, 0.6) 85.2%) !important;
+  border: none !important;
+  backdrop-filter: blur(10px) !important;
+  /* Note: backdrop-filter has minimal browser support */
+
+  border-radius: 6px !important;
+
+  .content-panel {
+    display: flex;
+    justify-content: space-between;
+    padding: 0 9px;
+    background: rgba(255, 255, 255, 0.8);
+    width: 164px;
+    height: 32px;
+    line-height: 32px;
+    box-shadow: 6px 0 20px rgba(34, 87, 188, 0.1);
+    border-radius: 4px;
+    margin-bottom: 4px;
+  }
+
+  .tooltip-title {
+    margin: 0 0 10px 0;
+  }
+
+  p {
+    margin: 0;
+  }
+
+  .tooltip-title,
+  .tooltip-value {
+    font-size: 13px;
+    line-height: 15px;
+    display: flex;
+    align-items: center;
+    text-align: right;
+    color: #1D2129;
+    font-weight: bold;
+  }
+
+  .tooltip-item-icon {
+    display: inline-block;
+    margin-right: 8px;
+    width: 10px;
+    height: 10px;
+    border-radius: 50%;
+  }
+}
+
+// flex
+.flex-center {
+  display: flex;
+  align-items: center;
+}
+
+// -- click-icon
+.click-icon-wrapper {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: var(--color-text-2);
+  background: var(--color-fill-2);
+  border-radius: 2px;
+  cursor: pointer;
+  border: 1px solid transparent;
+  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+
+  &:hover {
+    background: var(--color-fill-3);
+  }
+}
+
+// -- element
+.split-line {
+  border-color: rgb(var(--gray-2));
+}
+
+// 垂直 label
+.vertical-form-label {
+  display: flex;
+  max-width: 100%;
+  color: var(--color-text-2);
+  font-size: 14px;
+  margin-bottom: 8px;
+  padding: 0;
+  line-height: 1.5715;
+  white-space: normal;
+  user-select: none;
+}
+
+.full {
+  width: 100%;
+  height: 100%;
+}
+
+.disabled {
+  pointer-events: none;
+}
+
+.usn {
+  user-select: none;
+}
+
+.hide {
+  display: none;
+}
+
+.pointer {
+  cursor: pointer;
+}
+
+.m0 {
+  margin: 0;
+}
+
+.mx0 {
+  margin-left: 0;
+  margin-right: 0;
+}
+
+.my0 {
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+.mx2 {
+  margin-left: 2px;
+  margin-right: 2px;
+}
+
+.mx4 {
+  margin-left: 4px;
+  margin-right: 4px;
+}
+
+.ml4 {
+  margin-left: 4px;
+}
+
+.mr4 {
+  margin-right: 4px;
+}
+
+.mt4 {
+  margin-top: 4px;
+}
+
+.mb4 {
+  margin-bottom: 4px;
+}
+
+.mx4 {
+  margin-left: 4px;
+  margin-right: 4px;
+}
+
+.my4 {
+  margin-top: 4px;
+  margin-bottom: 4px;
+}
+
+.ml8 {
+  margin-left: 8px;
+}
+
+.mr8 {
+  margin-right: 8px;
+}
+
+.mt8 {
+  margin-top: 8px;
+}
+
+.mb8 {
+  margin-bottom: 8px;
+}
+
+.mx8 {
+  margin-left: 8px;
+  margin-right: 8px;
+}
+
+.my8 {
+  margin-top: 8px;
+  margin-bottom: 8px;
+}
+
+.ml16 {
+  margin-left: 16px;
+}
+
+.mr16 {
+  margin-right: 16px;
+}
+
+.mt16 {
+  margin-top: 16px;
+}
+
+.mb16 {
+  margin-bottom: 16px;
+}
+
+.mx16 {
+  margin-left: 16px;
+  margin-right: 16px;
+}
+
+.my16 {
+  margin-top: 16px;
+  margin-bottom: 16px;
+}
+
+.text-ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.text-copy {
+  &:hover {
+    cursor: pointer;
+    text-decoration: underline;
+    color: rgb(var(--arcoblue-6))
+  }
+}
+
+.copy-left, .copy-right {
+  color: rgb(var(--arcoblue-6));
+  cursor: pointer;
+  margin-right: 4px;
+}
+
+.copy-left {
+  margin-right: 4px;
+}
+
+.copy-right {
+  margin-left: 4px;
+}
+
+.question-right {
+  font-size: 18px;
+  margin-left: 8px;
+  color: rgb(var(--gray-6));
+  cursor: pointer;
+}
+
+.span-green {
+  color: rgb(var(--green-6));
+}
+
+.span-blue {
+  color: rgb(var(--arcoblue-6));
+}
+
+.span-red {
+  color: rgb(var(--red-6));
+}
+
+.table-cell-value {
+  color: var(--color-text-2);
+}
+
+.table-cell-sub-value {
+  margin-top: 4px;
+  display: inline-block;
+  color: var(--color-text-3);
+}
+
+// -- 滚动条
+#app {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+::-webkit-scrollbar {
+  -webkit-appearance: none;
+  width: 6px;
+  height: 6px;
+}
+
+::-webkit-scrollbar-track {
+  background-color: var(--color-fill-1);
+  border-radius: 8px;
+}
+
+::-webkit-scrollbar-thumb {
+  border: 1px solid transparent;
+  background-clip: padding-box;
+  border-radius: 8px;
+  background-color: var(--color-fill-4);
+
+  //&:hover {
+  //  background-color: var(--color-neutral-6);
+  //}
+}
+
+::-webkit-scrollbar-corner {
+  display: none;
+}