qa-kangzai-vue/src/assets/css/common.scss

158 lines
2.9 KiB
SCSS
Raw Normal View History

2025-06-09 08:46:56 +08:00
// 文字超出几行隐藏最多5行
// 使用超出1行隐藏如果使用了flex则需要给父元素设置min-width: 0;
@for $i from 1 through 5 {
.line-#{$i} {
@if $i == 1 {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
} @else {
display: -webkit-box !important;
overflow: hidden;
text-overflow: ellipsis;
word-break: break-all;
-webkit-line-clamp: $i;
-webkit-box-orient: vertical !important;
}
}
}
// 生成1-50的margin和padding正负
@for $i from 1 through 50 {
.m-#{$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;
}
.mtb-#{$i} {
margin-top: #{$i}px;
margin-bottom: #{$i}px;
}
.mlr-#{$i} {
margin-left: #{$i}px;
margin-right: #{$i}px;
}
.p-#{$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;
}
.ptb-#{$i} {
padding-top: #{$i}px;
padding-bottom: #{$i}px;
}
.plr-#{$i} {
padding-left: #{$i}px;
padding-right: #{$i}px;
}
.m--#{$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;
}
.mtb--#{$i} {
margin-top: -#{$i}px;
margin-bottom: -#{$i}px;
}
.mlr--#{$i} {
margin-left: -#{$i}px;
margin-right: -#{$i}px;
}
.p--#{$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;
}
.ptb--#{$i} {
padding-top: -#{$i}px;
padding-bottom: -#{$i}px;
}
.plr--#{$i} {
padding-left: -#{$i}px;
padding-right: -#{$i}px;
}
}
* {
box-sizing: border-box;
font-size: 14px;
&:not(dd,dl,dt) {
margin: 0;
padding: 0;
}
}
h1, h2, h3, h4, h5, h6 {
font-size: revert;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
-webkit-transition-delay: 99999s;
-webkit-transition: color 99999s ease-out, background-color 99999s ease-out;
}
#app {
background-color: #f6f8f9;
min-height: 100vh;
}
a {
text-decoration: none;
color: var(--el-color-primary);
}
.viewer-zoom-in, .viewer-zoom-out, .viewer-one-to-one, .viewer-reset, .viewer-prev, .viewer-play, .viewer-next, .viewer-rotate-left, .viewer-rotate-right, .viewer-flip-horizontal, .viewer-flip-vertical, .viewer-fullscreen, .viewer-fullscreen-exit, .viewer-close {
&::before {
font-size: unset !important;
}
}
.iframe{
position: relative;
border: none;
}