.g_ { &mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; cursor: pointer; } &float { &_left { float: left; } &_right { float: right; } &_none { clear: both; } } &flex { // 弹性布局 &_1 { // 示例:g_flex_1 flex: 1; } &_2 { // 示例:g_flex_1 flex: 2; } &_3 { // 示例:g_flex_1 flex: 3; } &_4 { // 示例:g_flex_1 flex: 4; } &_none { flex: none; } &_c { display: flex; display: -webkit-flex; justify-content: center; align-items: center; } &_rowRight_columnCenter { display: flex; display: -webkit-flex; justify-content: flex-end; align-items: center; } &_rowRight_columnEnd { display: flex; display: -webkit-flex; justify-content: flex-end; align-items: flex-end; } &_row_start { display: flex; display: -webkit-flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-start; } &_row_start_none { display: flex; display: -webkit-flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; } &_row_start_c { display: flex; display: -webkit-flex; flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; } &_row_between { display: flex; display: -webkit-flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; } &_row_around { display: flex; display: -webkit-flex; flex-direction: row; flex-wrap: wrap; justify-content: space-around; } &_row_center { display: flex; display: -webkit-flex; flex-direction: row; flex-wrap: wrap; justify-content: center; } &_row_end { display: flex; display: -webkit-flex; flex-direction: row; flex-wrap: wrap; justify-content: flex-end; } &_column_start { display: flex; display: -webkit-flex; flex-direction: column; flex-wrap: wrap; justify-content: flex-start; } &_column_between { display: flex; display: -webkit-flex; flex-direction: column; flex-wrap: wrap; justify-content: space-between; } &_column_around { display: flex; display: -webkit-flex; flex-direction: column; flex-wrap: wrap; justify-content: space-around; } &_column_end { display: flex; display: -webkit-flex; flex-direction: column; flex-wrap: wrap; justify-content: flex-end; } &_column_center { display: flex; display: -webkit-flex; flex-direction: column; flex-wrap: wrap; justify-content: center; } } &ell { // 多行省略 &_1 { // 示例:g_ell_1 overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; word-break: break-all; } &_2 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; word-break: break-all; } &_3 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; word-break: break-all; } &_4 { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; word-break: break-all; } } &fw { // 加粗 &_100 { // 示例:g_fw_100 font-weight: 100; } &_200 { font-weight: 200; } &_300 { font-weight: 300; } &_400 { font-weight: 400; } &_500 { font-weight: 500; } &_600 { font-weight: 600; } &_700 { font-weight: 700; } &_800 { font-weight: 800; } &_900 { font-weight: 900; } &_bold { font-weight: bold; } } &c { // 字体颜色 &_0 { // 示例:g_c_0 color: #000; } &_3 { color: #333; } &_6 { color: #666; } &_8c { color: #8c8c8c; } &_9 { color: #999; } &_c { color: #ccc; } &_f { color: #fff; } &_04bc { color: #004bbc; } &_d8 { color: #d8d8d8; } &_d9 { color: #d9d9d9; } &_57 { color: #576b95; } &_f52d { color: #f5222d; } &_f40 { color: #ff4400; } &_594e { color: #594e4e; } &_c1e { color: #52c41a; } &_26 { color: #262626; } &_7 { color: #777777; } &_8 { color: #888888; } &_f0 { color: #ff0000; } &_main { color: #1677ff; } } &bg { // 背景色 &_f { // 示例:g_bg_f background-color: #fff; } &_0 { // 示例:g_bg_f background-color: #000; } &_f0 { background-color: #f0f0f0; } &_e { background-color: #eee; } &_f5 { background-color: #f5f5f5; } &_main { background-color: #1677ff; } } &text { // 字体位置 &_l { // 示例:g_text_l text-align: left; } &_c { text-align: center; } &_r { text-align: right; } &_underline { text-decoration: underline; } } &position { // 定位 &_rela { // 示例:g_position_rela position: relative; } &_abso { position: absolute; &_c { left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); } } &_fixed { position: fixed; &_c { left: 50%; top: 50%; transform: translateX(-50%) translateY(-50%); } } } &cursor { // 手势 &_point { // 示例:g_cursor_point cursor: pointer; } &_na { cursor: not-allowed; } } &border { &_d { border: 1px solid #ddd; } &_top_d { border-top: 1px solid #ddd; } &_right_d { border-right: 1px solid #ddd; } &_bottom_d { border-bottom: 1px solid #ddd; } &_left_d { border-left: 1px solid #ddd; } &_e { border: 1px solid #eee; } &_top_e { border-top: 1px solid #eee; } &_right_e { border-right: 1px solid #eee; } &_bottom_e { border-bottom: 1px solid #eee; } &_left_e { border-left: 1px solid #eee; } &_9 { border: 1px solid #999; } &_d9 { border: 1px solid #d9d9d9; } &_main { border: 1px solid #1677ff; } } &clear_scroll::-webkit-scrollbar { display: none; } &w { &_all { width: 100%; } &_pull { width: 100vw; } &_three { width: 33.3333%; } } &h { &_all { height: 100%; } &_pull { height: 100vh; } &_three { width: 33.3333%; } } // 全局表格的分页器样式处理 &pageBottom { position: sticky; bottom: -16px; width: 100%; background-color: #fff; z-index: 999; } // 行高设置 &lh { &_1 { line-height: 1; } } } /* 内外边距 */ .gmp(300); .gmp(@n, @i: -100) when (@i =< @n) { .g_pl_@{i} { // 示例:g_pl_1,g_pl_2...g_pl_200 padding-left: 0px + @i; } .g_pr_@{i} { padding-right: 0px + @i; } .g_pt_@{i} { padding-top: 0px + @i; } .g_pb_@{i} { padding-bottom: 0px + @i; } .g_ml_@{i} { margin-left: 0px + @i; } .g_mr_@{i} { margin-right: 0px + @i; } .g_mt_@{i} { margin-top: 0px + @i; } .g_mb_@{i} { margin-bottom: 0px + @i; } .g_p_@{i} { padding: 0px + @i; } .g_m_@{i} { margin: 0px + @i; } .gmp(@n, (@i+1)); } /* 字体 */ .gfs(100); .gfs(@n, @i: 12) when (@i =< @n) { .g_fs_@{i} { font-size: 0px + @i; } .g_fsi_@{i} { font-size: 0px + @i !important; } .gfs(@n, (@i+1)); } /* dot点生成 */ .gdot(50); .gdot(@n, @i: 0) when (@i =< @n) { .g_dot_@{i} { width: 0px + @i; height: 0px + @i; border-radius: 50%; } .gdot(@n, (@i+1)); } /* 圆角 */ .gradius(30); .gradius(@n, @i: 0) when (@i =< @n) { .g_br_@{i} { border-radius: 0px + @i; } .gradius(@n, (@i+1)); } /* 尺寸 */ .gSize(500); .gSize(@n, @i: 0) when (@i =< @n) { .g_w_@{i} { width: 0px + @i; } .g_h_@{i} { height: 0px + @i; } .gSize(@n, (@i+1)); } /* 最大最小宽度高度 */ .gSize(500); .gSize(@n, @i: 0) when (@i =< @n) { .g_minw_@{i} { min-width: 0px + @i; } .g_maxw_@{i} { max-width: 0px + @i; } .g_minh_@{i} { min-height: 0px + @i; } .g_maxh_@{i} { max-height: 0px + @i; } } .g_and_ { &table { &_th { .ant-table-thead > tr > th { background-color: #fafafa; } } } &seach { &_input { .ant-input-search-button { border-start-end-radius: 4px !important; border-end-end-radius: 4px !important; } .ant-input { border-radius: 4px; } } } } .align_c { align-items: center; } .g-header-user { &:hover { color: #1677ff !important; } } .table_container { .ant-table-sticky-scroll { display: none !important; } } .antd-table .ant-table-wrapper div.ant-table-summary { bottom: -16px !important; overflow: initial !important; } .antd-table .ant-table-wrapper div.ant-table-summary > table { width: unset; } .box_bor { box-sizing: border-box; } .fw500 { font-weight: bold; } .flex_center { align-items: center; } .flex_nr { flex-wrap: nowrap !important; } .no_wrap { white-space: nowrap; } .ant-dropdown .ant-dropdown-menu { padding: 0 4px !important; } .ant-dropdown .ant-dropdown-menu .ant-dropdown-menu-item:hover { // background-color: #fff !important; } .ant-drawer-header { padding: 15px 12px !important; } .ant-drawer-body { padding-top: 24px; } .ant-spin-blur .ant-empty { opacity: 0; } // 新增职位下拉框样式 start .addJob .ant-select-item-option span { display: none; } .addJob .rc-virtual-list-holder-inner { padding: 12px; flex-direction: row !important; flex-wrap: wrap; } .addJob .ant-select-item-option { /* display: inline-block !important; */ /* float: left; */ padding-right: 4px; margin-right: 12px; margin-bottom: 4px; background-color: #eee; color: #666; line-height: 32px; border-radius: 14px !important; padding: 0 8px; text-align: center; padding-inline-start: 12px !important; /* width: 80px; */ /* flex: 1; */ } .addJob .ant-select-item-option-selected { background-color: rgb(24, 144, 255) !important; color: #fff !important; } // 新增职位下拉框样式 end