@import './variables.scss'; @import './mixin.scss'; @import './transition.scss'; @import './element-ui.scss'; @import './sidebar.scss'; @import './btn.scss'; /* CSS 初始化 */ html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; } body { height: 100%; min-height: 100% !important; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif; } html { height: 100%; box-sizing: border-box; } #app { height: 100%; } *, *:before, *:after { box-sizing: inherit; } .no-padding { padding: 0px !important; } .padding-content { padding: 4px 0; } a:focus, a:active { outline: none; } a, a:focus, a:hover { cursor: pointer; color: inherit; text-decoration: none; } ul li { list-style: none; } div:focus { outline: none; } .fr { float: right; } .fl { float: left; } .pr-5 { padding-right: 5px; } .pl-5 { padding-left: 5px; } .pt-10 { padding-top: 10px; } .block { display: block; } .pointer { cursor: pointer; } .move { color: #409EFF; font-size: 24px; } .inlineBlock { display: block; } .clearfix { &:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; } } .flex { display: flex; } aside { background: #eef1f6; padding: 8px 24px; margin-bottom: 20px; border-radius: 2px; display: block; line-height: 32px; font-size: 16px; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; color: #2c3e50; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; a { color: #337ab7; cursor: pointer; &:hover { color: rgb(32, 160, 255); } } } //main-container全局样式 .app-container { padding: 20px; } .components-container { margin: 30px 50px; position: relative; } .pagination-container { margin-top: 30px; } .text-center { text-align: center } .width100 { width: 100% !important; } .sub-navbar { height: 50px; line-height: 50px; position: relative; width: 100%; text-align: right; padding-right: 20px; transition: 600ms ease position; background: linear-gradient(90deg, rgba(32, 182, 249, 1) 0%, rgba(32, 182, 249, 1) 0%, rgba(33, 120, 241, 1) 100%, rgba(33, 120, 241, 1) 100%); .subtitle { font-size: 20px; color: #fff; } &.draft { background: #d0d0d0; } &.deleted { background: #d0d0d0; } } .link-type, .link-type:focus { color: #337ab7; cursor: pointer; &:hover { color: rgb(32, 160, 255); } } .filter-container { padding-bottom: 10px; .filter-item { display: inline-block; vertical-align: middle; margin-bottom: 10px; } } //refine vue-multiselect plugin .multiselect { line-height: 16px; } .multiselect--active { z-index: 1000 !important; } .delete-button { line-height: 32px; cursor: pointer; color: #FF7115; font-size: 20px; margin-right: 5px; } .add-button { line-height: 32px; color: #2FA5FF; cursor: pointer; font-size: 20PX; } .description { .el-form-item__content { width: 75%; } } // 弹窗组件 input样式 .header-title { margin-bottom: 18px; line-height: 20px; height: 20px; font-size: 15px; font-weight: bolder; width: 200px; margin-left: 45px; } .detailTree { width: 188px !important; } // 禁用 .disabled { color: #87adf3; background-color: #fff; cursor: not-allowed } .bad { color: #f00; background-color: #fff; cursor: not-allowed } .allow, .prohibit .suspend { position: relative; margin: 0 auto; text-align: center; min-width: 30px; } .allow { color: $green; } .prohibit { color: $pink; } .suspend { color: $yellow; } .suspend::before { content: ''; position: absolute; left: 5px; top: 45%; background-color: $yellow; display: inline-block; // 此句为css样式展示重点🏁 width: 5px; height: 5px; border-radius: 50%; } //错误日志样式 后期超优化 .item-cwnr { white-space: pre-wrap; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; overflow-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .item-cwnr img { height: 30px; } //楼盘表的幢/幢单元名称 .lpb-xmmc { height: 60px; line-height: 60px; background-color: #ffffff; border: 1px solid #e6e6e6; text-align: center; transition: 0.5s; margin-left: -1px; border-top: 0; .el-checkbox__label { font-size: 16px; } } .linshiIcon { position: relative; .icon { position: absolute; top: 12px; right: -5px; transform: rotate(45deg); color: #fff; font-size: 12px; z-index: 10; } } .linshiIcon::after { content: ""; display: block; width: 0; height: 0; border-width: 0px 0px 55px 55px; border-style: none solid solid; border-color: transparent transparent #fe9400; position: absolute; top: 0; right: 0; transform: rotate(-90deg); } .xianshiIcon { position: relative; .icon { position: absolute; top: 9px; right: 5px; transform: rotate(45deg); color: #fff; font-size: 12px; z-index: 10; } } .xianshiIcon::after { content: ""; display: block; width: 0; height: 0; border-width: 0px 0px 55px 55px; border-style: none solid solid; border-color: transparent transparent #67C23A; position: absolute; top: 0; right: 0; transform: rotate(-90deg); }