feec6ab80f
- 新增数据库迁移脚本，为详情表添加四个价格相关字段 - 完善后端schema校验、序列化逻辑，增加价格相关的数据清理与验证规则 - 新增价格配置校验逻辑，设置起售价时必须选择对应的计价单位 - 在Admin UI详情编辑器中新增价格配置模块，支持配置起售价、计价单位、适用人数范围和价格说明 - 更新小程序端详情页面，支持展示配置的参考价格信息 - 补充相关测试用例，更新API文档与类型定义
1675 lines
30 KiB
CSS
1675 lines
30 KiB
CSS
:root {
|
|
color: #1e293b;
|
|
background: #f5f7fb;
|
|
font-family: Inter, "PingFang SC", "Microsoft YaHei", sans-serif;
|
|
font-synthesis: none;
|
|
--ink: #1e293b;
|
|
--muted: #64748b;
|
|
--line: #e7ebf2;
|
|
--blue: #2563eb;
|
|
--surface: #ffffff;
|
|
}
|
|
|
|
* {
|
|
box-sizing: border-box;
|
|
}
|
|
body {
|
|
margin: 0;
|
|
min-width: 320px;
|
|
background: #f5f7fb;
|
|
}
|
|
button,
|
|
input {
|
|
font: inherit;
|
|
}
|
|
.brand-mark {
|
|
display: grid;
|
|
place-items: center;
|
|
width: 35px;
|
|
height: 35px;
|
|
border-radius: 10px;
|
|
color: #fff;
|
|
background: #1d4ed8;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
letter-spacing: 0.08em;
|
|
}
|
|
.eyebrow {
|
|
margin: 0 0 7px;
|
|
color: #2563eb;
|
|
font-size: 10px;
|
|
font-weight: 800;
|
|
letter-spacing: 0.16em;
|
|
}
|
|
.page-intro h2 {
|
|
margin: 0;
|
|
color: var(--ink);
|
|
font-size: 23px;
|
|
line-height: 1.2;
|
|
}
|
|
.page-stack {
|
|
max-width: 1220px;
|
|
margin: 0 auto;
|
|
}
|
|
.page-intro {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: flex-end;
|
|
gap: 24px;
|
|
margin-bottom: 26px;
|
|
}
|
|
.page-intro-actions {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-end;
|
|
gap: 8px;
|
|
}
|
|
.page-intro p:not(.eyebrow) {
|
|
margin: 9px 0 0;
|
|
color: var(--muted);
|
|
font-size: 13px;
|
|
}
|
|
.metric-grid,
|
|
.module-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 16px;
|
|
margin-bottom: 20px;
|
|
}
|
|
.metric-card,
|
|
.module-card,
|
|
.panel-card,
|
|
.advisor-card {
|
|
border: 1px solid var(--line);
|
|
border-radius: 12px;
|
|
}
|
|
.metric-card {
|
|
position: relative;
|
|
min-height: 145px;
|
|
overflow: hidden;
|
|
}
|
|
.metric-card::after {
|
|
content: "";
|
|
position: absolute;
|
|
right: -28px;
|
|
bottom: -46px;
|
|
width: 130px;
|
|
height: 130px;
|
|
border-radius: 50%;
|
|
background: #eff6ff;
|
|
}
|
|
.metric-card.accent::after {
|
|
background: #ecfdf5;
|
|
}
|
|
.metric-card span,
|
|
.metric-card small,
|
|
.module-card small {
|
|
display: block;
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.metric-card strong {
|
|
display: block;
|
|
margin: 14px 0 5px;
|
|
color: var(--ink);
|
|
font-size: 34px;
|
|
line-height: 1;
|
|
}
|
|
.metric-card small {
|
|
color: #94a3b8;
|
|
}
|
|
.panel-heading {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
font-weight: 650;
|
|
}
|
|
.loading-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 16px;
|
|
}
|
|
.module-card {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
min-height: 140px;
|
|
}
|
|
.module-label {
|
|
color: #475569;
|
|
font-weight: 650;
|
|
}
|
|
.module-card strong {
|
|
font-size: 29px;
|
|
}
|
|
.module-card .el-button {
|
|
align-self: flex-start;
|
|
padding-left: 0;
|
|
}
|
|
.category-list {
|
|
display: grid;
|
|
gap: 16px;
|
|
}
|
|
.advisor-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
gap: 16px;
|
|
}
|
|
.advisor-card {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
}
|
|
.advisor-card > div:nth-child(2) {
|
|
flex: 1;
|
|
}
|
|
.advisor-card strong,
|
|
.advisor-card span {
|
|
display: block;
|
|
}
|
|
.advisor-card span {
|
|
margin-top: 4px;
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.advisor-avatar {
|
|
display: grid;
|
|
place-items: center;
|
|
width: 42px;
|
|
height: 42px;
|
|
border-radius: 50%;
|
|
color: #1d4ed8;
|
|
background: #dbeafe;
|
|
font-weight: 700;
|
|
}
|
|
.concierge-list {
|
|
display: grid;
|
|
gap: 10px;
|
|
}
|
|
.concierge-row {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
align-items: center;
|
|
padding: 13px 0;
|
|
border-bottom: 1px solid #f1f5f9;
|
|
}
|
|
.concierge-row:last-child {
|
|
border-bottom: 0;
|
|
}
|
|
.concierge-summary,
|
|
.concierge-actions,
|
|
.media-toolbar,
|
|
.single-media-heading,
|
|
.subsection-heading {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
}
|
|
.concierge-summary {
|
|
min-width: 0;
|
|
}
|
|
.concierge-summary > div:last-child {
|
|
min-width: 0;
|
|
}
|
|
.concierge-summary strong,
|
|
.concierge-summary span {
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.concierge-summary span,
|
|
.subsection-heading span {
|
|
margin-top: 4px;
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.concierge-actions {
|
|
flex-wrap: wrap;
|
|
justify-content: flex-end;
|
|
}
|
|
.concierge-editor,
|
|
.single-media-editor {
|
|
padding: 4px 4px 14px;
|
|
}
|
|
.concierge-detail-editor {
|
|
margin: 20px 0;
|
|
padding-top: 20px;
|
|
border-top: 1px solid var(--line);
|
|
}
|
|
.subsection-heading {
|
|
justify-content: space-between;
|
|
margin-bottom: 12px;
|
|
}
|
|
.subsection-heading > div {
|
|
display: grid;
|
|
gap: 2px;
|
|
}
|
|
.concierge-detail-row {
|
|
display: grid;
|
|
grid-template-columns: 150px minmax(0, 1fr) auto;
|
|
gap: 8px;
|
|
margin-bottom: 8px;
|
|
}
|
|
.single-media-editor {
|
|
display: grid;
|
|
align-content: start;
|
|
gap: 10px;
|
|
padding: 12px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 9px;
|
|
}
|
|
.single-media-heading {
|
|
justify-content: space-between;
|
|
}
|
|
.single-media-preview {
|
|
width: 100%;
|
|
height: 150px;
|
|
border-radius: 8px;
|
|
background: #f1f5f9;
|
|
}
|
|
.lead-filter-card {
|
|
margin-bottom: 16px;
|
|
}
|
|
.lead-filters {
|
|
display: grid;
|
|
grid-template-columns: 170px 170px minmax(140px, 1fr) 60px 60px;
|
|
gap: 10px;
|
|
}
|
|
.lead-filters > .el-button {
|
|
width: 60px;
|
|
}
|
|
.lead-pagination {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
align-items: center;
|
|
gap: 14px;
|
|
padding-top: 16px;
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.lead-summary {
|
|
display: grid;
|
|
gap: 4px;
|
|
min-width: 0;
|
|
}
|
|
.lead-summary span {
|
|
overflow: hidden;
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.lead-detail-dialog .el-dialog__body {
|
|
padding-bottom: 16px;
|
|
}
|
|
.lead-detail-dialog .el-dialog__footer {
|
|
padding-top: 0;
|
|
}
|
|
.lead-detail-card {
|
|
overflow: hidden;
|
|
margin-top: 0;
|
|
border: 1px solid var(--line);
|
|
border-radius: 10px;
|
|
background: var(--surface);
|
|
}
|
|
.lead-detail-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 1px;
|
|
margin: 0;
|
|
background: var(--line);
|
|
}
|
|
.lead-detail-item {
|
|
min-width: 0;
|
|
padding: 15px 16px;
|
|
background: var(--surface);
|
|
}
|
|
.lead-detail-grid dt {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
line-height: 1.4;
|
|
}
|
|
.lead-detail-grid dd {
|
|
min-width: 0;
|
|
margin: 5px 0 0;
|
|
overflow-wrap: anywhere;
|
|
color: var(--ink);
|
|
font-weight: 650;
|
|
line-height: 1.45;
|
|
}
|
|
.lead-detail-section {
|
|
margin-top: 16px;
|
|
padding: 14px 16px;
|
|
border: 1px solid transparent;
|
|
border-radius: 9px;
|
|
background: #f8fafc;
|
|
}
|
|
.lead-detail-section-title {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
color: #475569;
|
|
font-size: 13px;
|
|
line-height: 1.4;
|
|
}
|
|
.lead-detail-section-title::before {
|
|
width: 3px;
|
|
height: 14px;
|
|
border-radius: 3px;
|
|
background: var(--blue);
|
|
content: "";
|
|
}
|
|
.lead-detail-section p {
|
|
margin: 7px 0 0;
|
|
overflow-wrap: anywhere;
|
|
color: #475569;
|
|
line-height: 1.6;
|
|
}
|
|
.lead-detail-note {
|
|
border-color: #e4eaf2;
|
|
background: #f5f8fc;
|
|
}
|
|
.lead-detail-footer {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
padding-top: 14px;
|
|
border-top: 1px solid var(--line);
|
|
}
|
|
.lead-detail-footer-status,
|
|
.lead-detail-footer-actions {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
.lead-detail-footer-status {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.lead-detail-footer-actions .el-select {
|
|
width: 190px;
|
|
}
|
|
.media-toolbar {
|
|
justify-content: flex-end;
|
|
}
|
|
.media-toolbar .el-input {
|
|
width: 150px;
|
|
}
|
|
.media-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
gap: 14px;
|
|
}
|
|
.media-pagination {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
padding-top: 16px;
|
|
}
|
|
.media-card {
|
|
overflow: hidden;
|
|
border: 1px solid var(--line);
|
|
border-radius: 10px;
|
|
background: #fff;
|
|
}
|
|
.media-card > .el-image {
|
|
display: block;
|
|
width: 100%;
|
|
height: 150px;
|
|
background: #f1f5f9;
|
|
}
|
|
.media-card-content {
|
|
display: grid;
|
|
gap: 5px;
|
|
padding: 10px;
|
|
}
|
|
.media-card-content strong,
|
|
.media-card-content span,
|
|
.media-card-content small {
|
|
display: block;
|
|
overflow-wrap: anywhere;
|
|
word-break: break-word;
|
|
white-space: normal;
|
|
}
|
|
.media-card-content strong {
|
|
color: var(--ink);
|
|
line-height: 1.45;
|
|
}
|
|
.media-card-content span,
|
|
.media-card-content small {
|
|
color: var(--muted);
|
|
font-size: 11px;
|
|
line-height: 1.45;
|
|
}
|
|
.media-card-content small {
|
|
color: #94a3b8;
|
|
}
|
|
.operations-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 16px;
|
|
margin-top: 18px;
|
|
}
|
|
.operation-card h3 {
|
|
margin: 0;
|
|
font-size: 19px;
|
|
}
|
|
.operation-card > p:not(.eyebrow) {
|
|
min-height: 50px;
|
|
margin: 10px 0 20px;
|
|
color: var(--muted);
|
|
line-height: 1.7;
|
|
}
|
|
.danger-operation {
|
|
border-color: #fecaca;
|
|
}
|
|
.operation-result {
|
|
margin-top: 18px;
|
|
}
|
|
.json-preview {
|
|
max-height: 220px;
|
|
overflow: auto;
|
|
margin: 0;
|
|
color: #475569;
|
|
font-size: 12px;
|
|
white-space: pre-wrap;
|
|
}
|
|
.site-config-intro {
|
|
align-items: center;
|
|
}
|
|
.site-config-intro + .el-alert {
|
|
margin-bottom: 18px;
|
|
}
|
|
.site-config-tabs {
|
|
margin-top: 18px;
|
|
}
|
|
.site-config-panel {
|
|
padding: 4px 0 0;
|
|
}
|
|
.site-config-panel .panel-heading {
|
|
margin-bottom: 18px;
|
|
}
|
|
.site-config-panel .panel-heading > div {
|
|
display: grid;
|
|
gap: 5px;
|
|
}
|
|
.site-config-panel .panel-heading span {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
font-weight: 400;
|
|
}
|
|
.site-item-content {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
min-width: 0;
|
|
}
|
|
.site-item-content > div {
|
|
min-width: 0;
|
|
}
|
|
.site-item-content strong,
|
|
.site-item-content small {
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.site-item-content small {
|
|
margin-top: 5px;
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.site-item-thumb {
|
|
flex: 0 0 auto;
|
|
width: 56px;
|
|
height: 40px;
|
|
border-radius: 7px;
|
|
background: #f1f5f9;
|
|
}
|
|
.site-config-editor {
|
|
padding: 4px 4px 14px;
|
|
}
|
|
.wanfa-workspace {
|
|
display: grid;
|
|
grid-template-columns: minmax(260px, 0.34fr) minmax(0, 0.66fr);
|
|
gap: 18px;
|
|
align-items: start;
|
|
}
|
|
.wanfa-category-panel,
|
|
.wanfa-route-panel {
|
|
min-width: 0;
|
|
}
|
|
.wanfa-category-list {
|
|
display: grid;
|
|
gap: 8px;
|
|
}
|
|
.wanfa-category-row {
|
|
display: grid;
|
|
grid-template-columns: minmax(0, 1fr);
|
|
gap: 7px;
|
|
padding: 10px;
|
|
border: 1px solid transparent;
|
|
border-radius: 9px;
|
|
background: #f8fafc;
|
|
}
|
|
.wanfa-category-row.is-selected {
|
|
border-color: #bfdbfe;
|
|
background: #eff6ff;
|
|
}
|
|
.wanfa-category-select {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 8px;
|
|
width: 100%;
|
|
padding: 0;
|
|
border: 0;
|
|
color: var(--ink);
|
|
background: transparent;
|
|
text-align: left;
|
|
cursor: pointer;
|
|
}
|
|
.wanfa-category-select span {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
white-space: nowrap;
|
|
}
|
|
.wanfa-row-actions {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 2px;
|
|
}
|
|
.wanfa-row-actions .el-button {
|
|
margin-left: 0;
|
|
}
|
|
.wanfa-editor {
|
|
padding: 4px 4px 14px;
|
|
}
|
|
.route-editor {
|
|
padding-bottom: 0;
|
|
}
|
|
.detail-fields {
|
|
margin-top: 22px;
|
|
padding-top: 20px;
|
|
border-top: 1px solid var(--line);
|
|
}
|
|
.detail-fields-heading {
|
|
display: grid;
|
|
gap: 4px;
|
|
margin-bottom: 18px;
|
|
}
|
|
.detail-fields-heading span {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
line-height: 1.5;
|
|
}
|
|
.detail-price-heading {
|
|
display: grid;
|
|
gap: 4px;
|
|
margin: 22px 0 18px;
|
|
padding-top: 20px;
|
|
border-top: 1px solid var(--line);
|
|
}
|
|
.detail-price-heading span {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
line-height: 1.5;
|
|
}
|
|
.route-editor .el-alert {
|
|
margin-top: 18px;
|
|
}
|
|
.gallery-editor {
|
|
display: grid;
|
|
gap: 12px;
|
|
margin-bottom: 18px;
|
|
padding-top: 4px;
|
|
}
|
|
.detail-fields .gallery-editor {
|
|
width: 100%;
|
|
margin-top: 20px;
|
|
}
|
|
.gallery-editor-heading {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
align-items: center;
|
|
}
|
|
.gallery-editor-heading > div {
|
|
display: grid;
|
|
gap: 4px;
|
|
}
|
|
.gallery-editor-heading span {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.media-file-input {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
opacity: 0;
|
|
pointer-events: none;
|
|
}
|
|
.gallery-grid {
|
|
display: grid;
|
|
grid-template-columns: minmax(0, 1fr);
|
|
gap: 12px;
|
|
}
|
|
.gallery-item {
|
|
min-width: 0;
|
|
padding: 8px;
|
|
border: 1px solid var(--line);
|
|
border-radius: 9px;
|
|
background: #fff;
|
|
}
|
|
.gallery-item .el-image {
|
|
display: block;
|
|
width: 100%;
|
|
height: 120px;
|
|
border-radius: 6px;
|
|
background: #f1f5f9;
|
|
}
|
|
.gallery-item small {
|
|
display: block;
|
|
overflow: hidden;
|
|
margin-top: 7px;
|
|
color: var(--muted);
|
|
font-size: 11px;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.gallery-actions {
|
|
display: flex;
|
|
gap: 2px;
|
|
margin-top: 3px;
|
|
}
|
|
.editor-heading {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
align-items: flex-start;
|
|
margin-bottom: 24px;
|
|
}
|
|
.editor-heading h3 {
|
|
margin: 0;
|
|
font-size: 21px;
|
|
}
|
|
.editor-heading p:not(.eyebrow) {
|
|
margin: 7px 0 0;
|
|
color: var(--muted);
|
|
font-size: 13px;
|
|
line-height: 1.6;
|
|
}
|
|
.site-config-editor .el-form-item {
|
|
margin-bottom: 18px;
|
|
}
|
|
.field-hint {
|
|
margin: 6px 0 0;
|
|
color: #94a3b8;
|
|
font-size: 12px;
|
|
line-height: 1.5;
|
|
}
|
|
.site-image-preview {
|
|
display: block;
|
|
width: 100%;
|
|
max-width: 260px;
|
|
height: 132px;
|
|
margin-top: 12px;
|
|
border-radius: 9px;
|
|
background: #f1f5f9;
|
|
}
|
|
.editor-options {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr;
|
|
gap: 16px;
|
|
}
|
|
.editor-sort-item {
|
|
margin-top: 20px;
|
|
}
|
|
.editor-actions {
|
|
display: flex;
|
|
flex: 0 0 auto;
|
|
justify-content: flex-end;
|
|
gap: 10px;
|
|
margin-top: 0;
|
|
padding: 14px 8px;
|
|
border-top: 1px solid var(--line);
|
|
background: var(--surface);
|
|
}
|
|
.editor-drawer .el-drawer__body {
|
|
display: flex;
|
|
min-height: 0;
|
|
flex-direction: column;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
}
|
|
.drawer-editor-form {
|
|
display: flex;
|
|
height: 100%;
|
|
min-height: 0;
|
|
flex-direction: column;
|
|
overflow: hidden;
|
|
padding: 4px 4px 0;
|
|
}
|
|
.drawer-editor-form__content {
|
|
min-height: 0;
|
|
flex: 1 1 auto;
|
|
overflow-y: auto;
|
|
padding: 0 8px 20px;
|
|
scrollbar-gutter: stable;
|
|
}
|
|
.settings-drawer .el-drawer__body {
|
|
display: flex;
|
|
min-height: 0;
|
|
flex-direction: column;
|
|
}
|
|
.settings-drawer .settings-form {
|
|
min-height: 0;
|
|
flex: 1 1 auto;
|
|
overflow-y: auto;
|
|
}
|
|
.settings-drawer .el-drawer__footer {
|
|
flex: 0 0 auto;
|
|
}
|
|
.home-content-panel .panel-heading {
|
|
margin-bottom: 18px;
|
|
}
|
|
.home-content-panel .panel-heading > div {
|
|
display: flex;
|
|
align-items: baseline;
|
|
gap: 10px;
|
|
}
|
|
.home-content-panel .panel-heading span {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
font-weight: 400;
|
|
}
|
|
.home-content-options {
|
|
margin-top: 20px;
|
|
}
|
|
.system-action-bar .el-button:hover {
|
|
color: #fff;
|
|
}
|
|
|
|
/* RuoYi-style system management pages: compact filters, bordered tables and explicit RBAC hierarchy. */
|
|
.system-resource-page .page-intro {
|
|
margin-bottom: 18px;
|
|
}
|
|
.system-filter-card,
|
|
.system-list-card {
|
|
margin-bottom: 16px;
|
|
border-radius: 4px;
|
|
}
|
|
.system-filter-card .el-card__body {
|
|
padding: 16px 18px 2px;
|
|
}
|
|
.system-filter-card .el-form {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: 0 16px;
|
|
}
|
|
.system-filter-card .el-form-item {
|
|
margin-right: 0;
|
|
margin-bottom: 14px;
|
|
}
|
|
.system-filter-card .el-input {
|
|
width: 230px;
|
|
}
|
|
.system-filter-card .el-form-item:last-child {
|
|
margin-left: auto;
|
|
}
|
|
.system-list-card .el-card__body {
|
|
padding: 0;
|
|
}
|
|
.system-table-heading {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
padding: 15px 18px;
|
|
border-bottom: 1px solid var(--line);
|
|
}
|
|
.system-table-heading > div:first-child {
|
|
display: flex;
|
|
align-items: baseline;
|
|
gap: 10px;
|
|
}
|
|
.system-table-heading strong {
|
|
color: #303133;
|
|
font-size: 14px;
|
|
}
|
|
.system-table-heading span {
|
|
color: #909399;
|
|
font-size: 12px;
|
|
}
|
|
.system-action-bar {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
gap: 8px;
|
|
}
|
|
.system-action-bar .el-button {
|
|
margin-left: 0;
|
|
}
|
|
.system-menu-name,
|
|
.system-tree-label {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
min-height: 24px;
|
|
}
|
|
.system-menu-name .layout-icon {
|
|
flex: 0 0 auto;
|
|
}
|
|
.system-list-card .el-table th.el-table__cell {
|
|
color: #606266;
|
|
font-weight: 600;
|
|
background: #f5f7fa;
|
|
}
|
|
.system-list-card .el-table td.el-table__cell,
|
|
.system-list-card .el-table th.el-table__cell {
|
|
border-bottom-color: #ebeef5;
|
|
}
|
|
.system-list-card .el-table .el-button + .el-button {
|
|
margin-left: 8px;
|
|
}
|
|
.system-editor-dialog .el-dialog__body {
|
|
padding-top: 8px;
|
|
}
|
|
.system-editor-form .el-form-item {
|
|
margin-bottom: 18px;
|
|
}
|
|
.system-editor-form .full-width {
|
|
width: 100%;
|
|
}
|
|
.system-tree-panel {
|
|
width: 100%;
|
|
overflow: hidden;
|
|
border: 1px solid var(--line);
|
|
border-radius: 4px;
|
|
background: #fff;
|
|
}
|
|
.system-tree-panel__heading {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
padding: 8px 12px;
|
|
color: #909399;
|
|
font-size: 12px;
|
|
border-bottom: 1px solid var(--line);
|
|
background: #f8fafc;
|
|
}
|
|
.system-tree-panel .el-tree {
|
|
max-height: 260px;
|
|
overflow: auto;
|
|
padding: 8px 12px;
|
|
}
|
|
.system-tree-panel .el-tree-node__content {
|
|
height: 32px;
|
|
}
|
|
.system-editor-form .el-radio-group {
|
|
display: flex;
|
|
gap: 18px;
|
|
}
|
|
.menu-icon-picker {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 8px;
|
|
}
|
|
.menu-icon-picker__search {
|
|
width: 100%;
|
|
}
|
|
.menu-icon-picker__grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
gap: 6px;
|
|
max-height: 300px;
|
|
overflow-y: auto;
|
|
padding-right: 2px;
|
|
}
|
|
.menu-icon-picker__option {
|
|
display: inline-flex;
|
|
min-height: 58px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-direction: column;
|
|
gap: 4px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
color: #606266;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
font-family: inherit;
|
|
font-size: 11px;
|
|
}
|
|
.menu-icon-picker__option:hover,
|
|
.menu-icon-picker__option:focus-visible,
|
|
.menu-icon-picker__option.is-active {
|
|
color: var(--primary-color, #409eff);
|
|
border-color: #b3d8ff;
|
|
background: #ecf5ff;
|
|
outline: none;
|
|
}
|
|
.menu-icon-picker .el-empty {
|
|
padding: 8px 0;
|
|
}
|
|
.system-editor-form .el-input-number {
|
|
width: 100%;
|
|
}
|
|
@media (max-width: 760px) {
|
|
.system-table-heading {
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
}
|
|
.system-action-bar {
|
|
justify-content: flex-start;
|
|
width: 100%;
|
|
}
|
|
.system-filter-card .el-form-item:last-child {
|
|
margin-left: 0;
|
|
}
|
|
.system-filter-card .el-input {
|
|
width: min(230px, 100%);
|
|
}
|
|
}
|
|
@media (max-width: 640px) {
|
|
.system-editor-form .el-row {
|
|
row-gap: 0;
|
|
}
|
|
.system-editor-form .el-col-12 {
|
|
width: 100%;
|
|
max-width: 100%;
|
|
flex: 0 0 100%;
|
|
}
|
|
}
|
|
@media (max-width: 880px) {
|
|
.wanfa-workspace {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
@media (max-width: 980px) {
|
|
.media-grid {
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
}
|
|
}
|
|
@media (max-width: 760px) {
|
|
.concierge-row {
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
}
|
|
.concierge-actions {
|
|
justify-content: flex-start;
|
|
}
|
|
.lead-filters {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
.lead-filters .el-input {
|
|
grid-column: 1 / -1;
|
|
}
|
|
.operations-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.media-grid {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
}
|
|
@media (max-width: 640px) {
|
|
.site-config-intro {
|
|
align-items: flex-start;
|
|
}
|
|
.site-config-intro .el-button,
|
|
.page-intro-actions {
|
|
width: 100%;
|
|
}
|
|
.page-intro-actions {
|
|
justify-content: stretch;
|
|
}
|
|
.page-intro-actions .el-button {
|
|
flex: 1;
|
|
}
|
|
.editor-options {
|
|
grid-template-columns: 1fr;
|
|
gap: 0;
|
|
}
|
|
.site-config-panel .panel-heading {
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
}
|
|
.site-config-panel .panel-heading .el-button {
|
|
width: 100%;
|
|
}
|
|
.concierge-detail-row {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.lead-filters {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.lead-filters .el-input {
|
|
grid-column: auto;
|
|
}
|
|
.lead-detail-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.lead-detail-footer {
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
}
|
|
.lead-detail-footer-actions {
|
|
width: 100%;
|
|
}
|
|
.lead-detail-footer-actions .el-select {
|
|
min-width: 0;
|
|
flex: 1;
|
|
width: auto;
|
|
}
|
|
.media-toolbar {
|
|
align-items: stretch;
|
|
flex-direction: column;
|
|
width: 100%;
|
|
}
|
|
.media-toolbar .el-input {
|
|
width: 100%;
|
|
}
|
|
.media-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
}
|
|
|
|
/* RuoYi-compatible shell: fixed sidebar, compact navbar, tags view and responsive content. */
|
|
.admin-layout {
|
|
--sidebar-width: 200px;
|
|
--sidebar-collapsed-width: 64px;
|
|
--navbar-height: 50px;
|
|
--primary-color: #409eff;
|
|
display: flex;
|
|
min-height: 100vh;
|
|
color: #303133;
|
|
background: #f2f3f5;
|
|
}
|
|
|
|
.admin-main-container {
|
|
display: flex;
|
|
flex: 1 1 auto;
|
|
flex-direction: column;
|
|
min-width: 0;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.sidebar-shell {
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 1001;
|
|
flex: 0 0 auto;
|
|
height: 100vh;
|
|
}
|
|
|
|
.sidebar-drawer {
|
|
display: flex;
|
|
height: 100vh;
|
|
flex-direction: column;
|
|
overflow: hidden;
|
|
border-right: 0;
|
|
box-shadow: 2px 0 6px rgba(0, 21, 41, 0.12);
|
|
transition:
|
|
width 200ms ease,
|
|
background-color 200ms ease;
|
|
}
|
|
|
|
.sidebar-drawer--dark {
|
|
color: #bfcbd9;
|
|
}
|
|
.sidebar-drawer--light {
|
|
color: #303133;
|
|
border-right: 1px solid #e6e6e6;
|
|
box-shadow: none;
|
|
}
|
|
.sidebar-drawer--collapsed {
|
|
width: var(--sidebar-collapsed-width) !important;
|
|
min-width: var(--sidebar-collapsed-width) !important;
|
|
}
|
|
|
|
.sidebar-logo {
|
|
display: flex;
|
|
height: 50px;
|
|
flex: 0 0 50px;
|
|
align-items: center;
|
|
gap: 10px;
|
|
padding: 0 16px;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.sidebar-logo--collapsed {
|
|
justify-content: center;
|
|
padding: 0;
|
|
}
|
|
.sidebar-logo__mark,
|
|
.brand-mark {
|
|
display: grid;
|
|
width: 32px;
|
|
height: 32px;
|
|
flex: 0 0 32px;
|
|
place-items: center;
|
|
border-radius: 6px;
|
|
color: #fff;
|
|
background: #409eff;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
letter-spacing: 0.08em;
|
|
}
|
|
|
|
.sidebar-logo__copy {
|
|
display: grid;
|
|
gap: 2px;
|
|
min-width: 0;
|
|
}
|
|
.sidebar-logo__copy strong {
|
|
color: #fff;
|
|
font-size: 15px;
|
|
font-weight: 600;
|
|
}
|
|
.sidebar-logo__copy span {
|
|
color: rgba(255, 255, 255, 0.6);
|
|
font-size: 10px;
|
|
}
|
|
.sidebar-drawer--light .sidebar-logo__copy strong {
|
|
color: #303133;
|
|
}
|
|
.sidebar-drawer--light .sidebar-logo__copy span {
|
|
color: #909399;
|
|
}
|
|
|
|
.sidebar-scrollbar {
|
|
flex: 1 1 auto;
|
|
min-height: 0;
|
|
}
|
|
.sidebar-menu {
|
|
width: 100%;
|
|
padding: 6px 0;
|
|
border-right: 0;
|
|
}
|
|
.sidebar-menu .el-menu-item,
|
|
.sidebar-menu .el-sub-menu__title {
|
|
height: 46px;
|
|
line-height: 46px;
|
|
margin: 0;
|
|
border-radius: 0;
|
|
}
|
|
.sidebar-menu .el-menu-item.is-active {
|
|
color: #fff !important;
|
|
background: var(--primary-color);
|
|
}
|
|
.sidebar-drawer--light .sidebar-menu .el-menu-item.is-active {
|
|
color: var(--primary-color) !important;
|
|
background: #ecf5ff;
|
|
}
|
|
.sidebar-menu .el-menu-item:hover,
|
|
.sidebar-menu .el-sub-menu__title:hover {
|
|
background: rgba(64, 158, 255, 0.16);
|
|
}
|
|
.sidebar-menu .el-sub-menu.is-active > .el-sub-menu__title {
|
|
color: #fff;
|
|
}
|
|
.sidebar-drawer--light
|
|
.sidebar-menu
|
|
.el-sub-menu.is-active
|
|
> .el-sub-menu__title {
|
|
color: var(--primary-color);
|
|
}
|
|
.sidebar-menu .el-menu--inline {
|
|
background: transparent !important;
|
|
}
|
|
.sidebar-item__content {
|
|
display: inline-flex;
|
|
width: 100%;
|
|
align-items: center;
|
|
gap: 12px;
|
|
}
|
|
.sidebar-item__content svg {
|
|
flex: 0 0 auto;
|
|
}
|
|
.layout-icon {
|
|
display: block;
|
|
flex: 0 0 auto;
|
|
vertical-align: middle;
|
|
}
|
|
.sidebar-item__label {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
.el-menu--collapse .sidebar-item__content {
|
|
justify-content: center;
|
|
}
|
|
|
|
.admin-navbar {
|
|
position: relative;
|
|
z-index: 900;
|
|
display: flex;
|
|
height: var(--navbar-height);
|
|
flex: 0 0 var(--navbar-height);
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 0 16px;
|
|
border-bottom: 1px solid #e6e6e6;
|
|
background: #fff;
|
|
}
|
|
.fixed-header .admin-navbar {
|
|
position: sticky;
|
|
top: 0;
|
|
}
|
|
.navbar-left,
|
|
.navbar-right,
|
|
.breadcrumb,
|
|
.user-menu {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
.navbar-left,
|
|
.navbar-right {
|
|
min-width: 0;
|
|
}
|
|
.navbar-right {
|
|
gap: 4px;
|
|
}
|
|
.navbar-icon-button {
|
|
width: 34px;
|
|
height: 34px;
|
|
padding: 0;
|
|
color: #606266;
|
|
}
|
|
.navbar-icon-button:hover,
|
|
.navbar-icon-button:focus-visible {
|
|
color: var(--primary-color);
|
|
background: #ecf5ff;
|
|
}
|
|
.breadcrumb {
|
|
gap: 8px;
|
|
margin-left: 8px;
|
|
color: #606266;
|
|
font-size: 13px;
|
|
white-space: nowrap;
|
|
}
|
|
.breadcrumb-separator {
|
|
color: #c0c4cc;
|
|
}
|
|
.breadcrumb-current {
|
|
color: #303133;
|
|
}
|
|
.user-menu {
|
|
gap: 7px;
|
|
padding: 4px 2px 4px 8px;
|
|
border: 0;
|
|
color: #606266;
|
|
background: transparent;
|
|
cursor: pointer;
|
|
}
|
|
.user-menu:focus-visible {
|
|
outline: 2px solid var(--primary-color);
|
|
outline-offset: 2px;
|
|
}
|
|
.user-avatar {
|
|
display: grid;
|
|
width: 30px;
|
|
height: 30px;
|
|
place-items: center;
|
|
border-radius: 50%;
|
|
color: #fff;
|
|
background: #c0c4cc;
|
|
font-size: 13px;
|
|
}
|
|
.user-name {
|
|
max-width: 120px;
|
|
overflow: hidden;
|
|
color: #606266;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.top-menu {
|
|
flex: 0 0 50px;
|
|
border-bottom: 1px solid #e6e6e6;
|
|
background: #fff;
|
|
}
|
|
.top-menu__bar {
|
|
height: 50px;
|
|
border-bottom: 0;
|
|
}
|
|
.top-menu__bar .el-menu-item,
|
|
.top-menu__bar .el-sub-menu__title {
|
|
height: 50px;
|
|
line-height: 50px;
|
|
}
|
|
|
|
.tags-view-container {
|
|
position: relative;
|
|
z-index: 800;
|
|
display: flex;
|
|
height: 34px;
|
|
flex: 0 0 34px;
|
|
align-items: center;
|
|
border-bottom: 1px solid #d8dce5;
|
|
background: #fff;
|
|
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
|
|
}
|
|
.tags-view-list {
|
|
display: flex;
|
|
min-width: 0;
|
|
flex: 1 1 auto;
|
|
align-items: center;
|
|
gap: 5px;
|
|
height: 100%;
|
|
overflow-x: auto;
|
|
scrollbar-width: none;
|
|
}
|
|
.tags-view-list::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.tags-view-item {
|
|
display: inline-flex;
|
|
height: 26px;
|
|
flex: 0 0 auto;
|
|
align-items: center;
|
|
gap: 5px;
|
|
padding: 0 9px;
|
|
border: 1px solid transparent;
|
|
border-radius: 3px;
|
|
color: #606266;
|
|
background: transparent;
|
|
font-size: 12px;
|
|
cursor: pointer;
|
|
transition:
|
|
color 160ms ease,
|
|
background-color 160ms ease,
|
|
border-color 160ms ease;
|
|
}
|
|
.tags-view-item:hover {
|
|
color: var(--primary-color);
|
|
background: #f5f7fa;
|
|
}
|
|
.tags-view-item.is-active {
|
|
color: #fff;
|
|
background: var(--primary-color);
|
|
border-color: var(--primary-color);
|
|
}
|
|
.tag-close {
|
|
display: inline-flex;
|
|
width: 14px;
|
|
height: 14px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 50%;
|
|
}
|
|
.tag-close:hover {
|
|
color: #fff;
|
|
background: rgba(255, 255, 255, 0.3);
|
|
}
|
|
.tags-view-toolbar {
|
|
display: flex;
|
|
height: 100%;
|
|
flex: 0 0 auto;
|
|
align-items: center;
|
|
border-left: 1px solid #e6e6e6;
|
|
}
|
|
.tags-toolbar-button {
|
|
display: grid;
|
|
width: 34px;
|
|
height: 100%;
|
|
place-items: center;
|
|
border: 0;
|
|
border-left: 1px solid transparent;
|
|
color: #606266;
|
|
background: #fff;
|
|
cursor: pointer;
|
|
}
|
|
.tags-view-toolbar .tags-toolbar-button + .el-dropdown,
|
|
.tags-view-toolbar .el-dropdown + .tags-toolbar-button {
|
|
border-left: 1px solid #e6e6e6;
|
|
}
|
|
.tags-toolbar-button:hover,
|
|
.tags-toolbar-button:focus-visible {
|
|
color: var(--primary-color);
|
|
background: #f5f7fa;
|
|
}
|
|
.tags-context-menu {
|
|
position: fixed;
|
|
z-index: 3000;
|
|
display: grid;
|
|
min-width: 150px;
|
|
padding: 5px 0;
|
|
border: 1px solid #ebeef5;
|
|
border-radius: 4px;
|
|
background: #fff;
|
|
box-shadow: 0 2px 12px rgba(0, 0, 0, 0.12);
|
|
}
|
|
.tags-context-menu button {
|
|
padding: 8px 14px;
|
|
border: 0;
|
|
color: #606266;
|
|
background: #fff;
|
|
text-align: left;
|
|
font-size: 12px;
|
|
cursor: pointer;
|
|
}
|
|
.tags-context-menu button:hover:not(:disabled) {
|
|
color: var(--primary-color);
|
|
background: #f5f7fa;
|
|
}
|
|
.tags-context-menu button:disabled {
|
|
color: #c0c4cc;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.admin-main {
|
|
flex: 1 1 auto;
|
|
min-width: 0;
|
|
padding: 24px 30px 40px;
|
|
}
|
|
.admin-footer {
|
|
padding: 10px 24px 14px;
|
|
color: #909399;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
}
|
|
.settings-form .el-radio-group {
|
|
display: flex;
|
|
width: 100%;
|
|
}
|
|
.settings-form .el-radio-button {
|
|
flex: 1;
|
|
}
|
|
.settings-form .el-radio-button__inner {
|
|
width: 100%;
|
|
padding-right: 8px;
|
|
padding-left: 8px;
|
|
}
|
|
.settings-switches {
|
|
display: grid;
|
|
width: 100%;
|
|
gap: 14px;
|
|
}
|
|
.settings-switches > div {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
color: #606266;
|
|
font-size: 13px;
|
|
}
|
|
|
|
@media (max-width: 767px) {
|
|
.sidebar-shell {
|
|
position: fixed;
|
|
inset: 0 auto 0 0;
|
|
}
|
|
.sidebar-shell:not(.sidebar-shell--mobile) {
|
|
display: block;
|
|
}
|
|
.admin-main {
|
|
padding: 20px 22px 32px;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 640px) {
|
|
.admin-navbar {
|
|
padding: 0 8px;
|
|
}
|
|
.breadcrumb {
|
|
margin-left: 4px;
|
|
}
|
|
.breadcrumb span:not(.breadcrumb-current),
|
|
.navbar-right .navbar-icon-button:nth-child(-n + 2),
|
|
.navbar-right .el-divider {
|
|
display: none;
|
|
}
|
|
.user-name {
|
|
display: none;
|
|
}
|
|
.admin-main {
|
|
padding: 18px 14px 28px;
|
|
}
|
|
.tags-view-item {
|
|
padding: 0 7px;
|
|
}
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
*,
|
|
*::before,
|
|
*::after {
|
|
scroll-behavior: auto !important;
|
|
transition-duration: 0.01ms !important;
|
|
animation-duration: 0.01ms !important;
|
|
}
|
|
}
|
|
.login-page {
|
|
display: grid;
|
|
grid-template-columns: minmax(0, 1fr) 420px;
|
|
min-height: 100vh;
|
|
padding: 5vw 9vw;
|
|
gap: 8vw;
|
|
align-items: center;
|
|
background: #f8fafc;
|
|
}
|
|
.login-art {
|
|
max-width: 560px;
|
|
}
|
|
.login-art h1 {
|
|
margin: 18px 0;
|
|
color: #172554;
|
|
font-size: clamp(34px, 4vw, 61px);
|
|
letter-spacing: -0.05em;
|
|
line-height: 1.07;
|
|
}
|
|
.login-art em {
|
|
color: #2563eb;
|
|
font-style: normal;
|
|
}
|
|
.login-art > p:last-child {
|
|
max-width: 390px;
|
|
color: #64748b;
|
|
line-height: 1.9;
|
|
}
|
|
.login-card {
|
|
padding: 30px;
|
|
border: 1px solid #e2e8f0;
|
|
border-radius: 16px;
|
|
}
|
|
.login-card-heading {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 12px;
|
|
margin-bottom: 30px;
|
|
}
|
|
.login-card-heading h2 {
|
|
margin: 0;
|
|
font-size: 22px;
|
|
}
|
|
.login-card-heading p {
|
|
margin: 5px 0 0;
|
|
color: var(--muted);
|
|
font-size: 13px;
|
|
}
|
|
.login-error {
|
|
margin: 4px 0 17px;
|
|
}
|
|
.login-remember {
|
|
margin: -4px 0 12px;
|
|
}
|
|
.login-captcha-row {
|
|
display: grid;
|
|
grid-template-columns: minmax(0, 1fr) 160px;
|
|
gap: 10px;
|
|
align-items: center;
|
|
width: 100%;
|
|
}
|
|
.login-captcha-image {
|
|
display: flex;
|
|
width: 160px;
|
|
height: 32px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
border: 1px solid #dcdfe6;
|
|
border-radius: 4px;
|
|
color: #909399;
|
|
background: #f5f7fa;
|
|
cursor: pointer;
|
|
}
|
|
.login-captcha-image:hover:not(:disabled),
|
|
.login-captcha-image:focus-visible {
|
|
border-color: var(--primary-color);
|
|
}
|
|
.login-captcha-image:disabled {
|
|
cursor: wait;
|
|
opacity: 0.7;
|
|
}
|
|
.login-captcha-image img {
|
|
display: block;
|
|
width: 160px;
|
|
height: 48px;
|
|
object-fit: cover;
|
|
}
|
|
.login-button {
|
|
width: 100%;
|
|
height: 42px;
|
|
}
|
|
@media (max-width: 900px) {
|
|
.login-page {
|
|
grid-template-columns: 1fr;
|
|
padding: 48px 24px;
|
|
gap: 24px;
|
|
}
|
|
.login-art {
|
|
max-width: none;
|
|
}
|
|
.login-art h1 {
|
|
font-size: 38px;
|
|
}
|
|
.login-card {
|
|
max-width: 520px;
|
|
width: 100%;
|
|
}
|
|
.advisor-grid {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
}
|
|
@media (max-width: 640px) {
|
|
.user-name {
|
|
display: none;
|
|
}
|
|
.metric-grid,
|
|
.module-grid,
|
|
.loading-grid,
|
|
.advisor-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
.page-intro {
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
}
|
|
}
|