提交代码

src/assets/css/pulic.scss

@@ -0,0 +1,365 @@
+.font10 {
+  font-size: 10px;
+}
+
+.font12 {
+  font-size: 12px;
+}
+
+.font14 {
+  font-size: 14px;
+}
+
+.font16 {
+  font-size: 16px;
+}
+
+.font18 {
+  font-size: 18px;
+}
+
+.font20 {
+  font-size: 20px;
+}
+
+.font22 {
+  font-size: 22px;
+}
+
+.font24 {
+  font-size: 24px;
+}
+
+.font28 {
+  font-size: 28px;
+}
+
+.font36 {
+  font-size: 36px;
+}
+
+.upColor {
+  color: #d9001b;
+}
+
+.downColor {
+  color: #95f204;
+}
+
+// 分割线
+.divider {
+  background: linear-gradient(
+    90.143958942072deg,
+    rgba(14, 48, 115, 1) 0%,
+    rgba(70, 159, 251, 1) 50%,
+    rgba(14, 48, 115, 1) 100%
+  );
+  height: 1px;
+}
+
+// 不显示滚动条
+.noScollLine::-webkit-scrollbar {
+  width: 0 !important;
+}
+
+.cardBorder {
+  border: 1px solid rgba(24, 99, 232, 1);
+}
+
+//   echarts背景样式
+.echartBoxBg1 {
+  background-color: rgba(0, 0, 0, 0.266666666666667);
+  border-radius: 10px;
+  padding: 5px;
+}
+
+//状态栏
+.warning {
+  background-color: #fff4f6;
+  color: #f4002c;
+}
+
+.finish {
+  background-color: #e7f8f0;
+  color: #0acf83;
+}
+
+.waiting {
+  background-color: #fff6e8;
+  color: #fe7f2e;
+}
+
+.ellipsis2 {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  word-break: break-all;
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+}
+
+.ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+// 表格里面给人的名字加边框
+.tableUserName {
+  line-height: 24px;
+  font-size: 14px;
+  padding: 2px 0px;
+  border: 1px solid #4d67eb;
+  color: #4d67eb;
+  width: 60px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  text-align: center;
+}
+
+.relative {
+  position: relative;
+}
+.absolute {
+  position: absolute;
+}
+
+// 滚动
+.scrollbar {
+  overflow: overlay;
+}
+
+// 浮动
+.fl {
+  float: left;
+}
+
+.fr {
+  float: right;
+}
+
+.pointer {
+  cursor: pointer;
+}
+
+/**************文字位置**************/
+.tl {
+  text-align: left;
+}
+
+.tc {
+  text-align: center;
+}
+
+.tr {
+  text-align: right;
+}
+
+.strong {
+  font-weight: bold;
+}
+
+/**************flex************/
+.flex {
+  display: flex;
+}
+.flex-grow1 {
+  flex-grow: 1;
+}
+.shrink0 {
+  flex-shrink: 0;
+}
+
+.flex-warp {
+  flex-wrap: wrap;
+}
+.flex-nowrap {
+  flex-wrap: nowrap;
+}
+
+.dir-column {
+  flex-direction: column;
+}
+
+.just-between {
+  justify-content: space-between;
+}
+.just-around {
+  justify-content: space-around;
+}
+
+.just-center {
+  justify-content: center;
+}
+
+.just-end {
+  justify-content: flex-end;
+}
+
+.just-start {
+  justify-content: flex-start;
+}
+
+.align-start {
+  align-items: start;
+}
+
+.align-center {
+  align-items: center;
+}
+
+.align-bottom {
+  align-items: flex-end;
+}
+
+/**********文本省略***********/
+.nowrap {
+  white-space: nowrap;
+}
+
+.text1 {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.text2 {
+  text-overflow: -o-ellipsis-lastline;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+
+.text3 {
+  text-overflow: -o-ellipsis-lastline;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 3;
+  -webkit-box-orient: vertical;
+}
+
+.hidden {
+  overflow: hidden;
+}
+
+.hide {
+  display: none;
+}
+
+.show {
+  display: block;
+}
+
+/**********字体大小和边距***********/
+@for $i from 1 through 100 {
+  .f#{$i} {
+    font-size: #{$i}px;
+  }
+
+  //外边距
+  .mg#{$i} {
+    margin: #{$i}px;
+  }
+
+  .mt#{$i} {
+    margin-top: #{$i}px;
+  }
+
+  .mr#{$i} {
+    margin-right: #{$i}px;
+  }
+
+  .mb#{$i} {
+    margin-bottom: #{$i}px;
+  }
+
+  .ml#{$i} {
+    margin-left: #{$i}px;
+  }
+
+  //内边距
+  .pd#{$i} {
+    padding: #{$i}px;
+  }
+
+  .pt#{$i} {
+    padding-top: #{$i}px;
+  }
+
+  .pr#{$i} {
+    padding-right: #{$i}px;
+  }
+
+  .pb#{$i} {
+    padding-bottom: #{$i}px;
+  }
+
+  .pl#{$i} {
+    padding-left: #{$i}px;
+  }
+
+  .br#{$i} {
+    border-radius: #{$i}px;
+  }
+
+  //宽度
+  .w#{$i} {
+    width: #{$i}px;
+  }
+
+  .ww#{$i} {
+    width: #{$i}+ "%";
+  }
+
+  .hh#{$i} {
+    height: #{$i}+ "%";
+  }
+
+  //高度
+  .h#{$i} {
+    height: #{$i}px;
+
+  }
+
+  //行高
+  .lh#{$i} {
+    line-height: #{$i}px;
+  }
+ //自适应大号字体(通常为统计数字 18-30)
+ .font_size_big{
+  font-size: clamp(1.125rem, -0.894rem + 2.31vw, 1.875rem);
+}
+  //自适应一号字体(通常为一级标题 14-18)
+  .font_size_title{
+    font-size: clamp(0.875rem, 0.37rem + 0.58vw, 1.063rem);
+  }
+  //自适应统计字体(通常为统计数字 14-22)
+  .font_size1{
+    font-size: clamp(0.875rem, -0.471rem + 1.54vw, 1.375rem);
+  }
+   //自适应二号字体(通常为二级标题 14-16)
+   .font_size2{
+    font-size: clamp(0.75rem, 0.077rem + 0.77vw, 1rem);
+  }
+  //自适应普通字体(通常为默认大小 10-14)
+  .font_size_default{
+    font-size: clamp(0.625rem, -0.048rem + 0.77vw, 0.875rem);
+  }
+}
+
+@font-face {
+  font-family: "DigifaceWide";
+  src: url("~@/assets/font/DigifaceWide.ttf");
+  font-weight: normal;
+  font-style: normal;
+}
+@font-face {
+  font-family: "HANYILINGXINTIJIAN";
+  src: url("~@/assets/font/HANYILINGXINTIJIAN-1.TTF");
+  font-weight: normal;
+  font-style: normal;
+}