// 全局样式 // 滚动条 ::-webkit-scrollbar { width: 0.5rem; height: 0.5rem; } ::-webkit-scrollbar-track { background-color: transparent; } ::-webkit-scrollbar-thumb { border-radius: 1rem; background-color: #DFDFDF; &:hover { background-color: #CCCCCC; } } // 选中文本 ::selection { background-color: @colorPrimary; color: #FFF; } // 标签 html { transition: font-size calc(@transitionTime * 2); } body { color: @textPrimary; overflow: hidden; user-select: none; -webkit-tap-highlight-color: transparent; } // 限制长度 .limitLine(@line) { display: -webkit-box; -webkit-line-clamp: @line; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .limit-line-1 { overflow: hidden; text-overflow: ellipsis } .limit-line-2 { .limitLine(2); } .limit-line-3 { .limitLine(3); } // 背景居中 .bgCenter() { background-position: center; background-repeat: no-repeat; } .bg-center-contain { .bgCenter(); background-size: contain; } .bg-center-cover { .bgCenter(); background-size: cover; } // 阴影 .shadow-1 { box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1); } .shadow-2 { box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.05); } .shadow-3 { box-shadow: 0 0.5rem 1rem -0.4rem rgba(0, 0, 0, 0.12); } // 载入中(链接列表) .loading-link { background-color: rgba(255, 255, 255, 0.5) !important; backdrop-filter: blur(0.2rem); .el-loading-spinner { transform: translateY(-50%); } .el-icon-loading { font-size: 2rem !important; } .el-loading-text { margin: 0.5rem 0; font-size: 1.25rem !important; } } // Element UI .el-checkbox { font-weight: inherit; } .el-drawer.drawer-full { .el-drawer__header { z-index: 500; margin: 0 !important; padding: 1rem 1.5rem !important; background-color: @colorPrimary; color: #FFF; .shadow-3; } .el-drawer__body { padding: 2rem; overflow-y: auto; } } .el-form-item { margin-bottom: 0.5rem; } .el-input { input::-webkit-inner-spin-button, input::-webkit-outer-spin-button { -webkit-appearance: none; } input[type="number"] { -moz-appearance: textfield; } } .el-link { font-size: inherit; font-weight: inherit; } .el-menu-item { .fa { margin-right: 0.3125rem; width: 1.5rem; text-align: center; font-size: 1.125rem; vertical-align: middle; } } .el-message { width: 80%; min-width: 16rem; max-width: 25rem; .shadow-2; &.el-message--info { background-color: #FFF; } } .el-message-box { display: block; position: fixed; top: 50%; left: 50%; width: 90%; min-width: 16rem; max-width: 25rem; transform: translate(-50%, -50%); } .el-select-dropdown { border: none !important; } .el-switch { .el-switch__core { width: 2.5rem !important; } }