chore: 清理个人中心废弃样式
This commit is contained in:
yml2213
@@ -692,31 +692,6 @@ async function savePassword() {
|
||||
padding: 10px 0 40px;
|
||||
}
|
||||
|
||||
.profile-hero {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 18px;
|
||||
padding: 30px 34px;
|
||||
border: 1px solid #eef1f5;
|
||||
border-radius: 18px;
|
||||
background: linear-gradient(135deg, rgba(255, 106, 0, 0.12), rgba(37, 99, 235, 0.08)), #ffffff;
|
||||
box-shadow: 0 16px 36px rgba(23, 35, 61, 0.08);
|
||||
}
|
||||
|
||||
.profile-hero.is-quality-owner {
|
||||
border-color: #d8c9fb;
|
||||
background:
|
||||
radial-gradient(circle at 86% 0%, rgba(245, 158, 11, 0.15), transparent 34%),
|
||||
linear-gradient(135deg, #f3edff 0%, #ffffff 58%, #fff8e8 100%);
|
||||
box-shadow: 0 16px 42px rgba(109, 40, 217, 0.12);
|
||||
}
|
||||
|
||||
.profile-hero.is-quality-owner .hero-avatar {
|
||||
background: linear-gradient(135deg, #5b21b6 0%, #9333ea 62%, #f59e0b 100%);
|
||||
box-shadow: 0 8px 20px rgba(109, 40, 217, 0.22);
|
||||
}
|
||||
|
||||
.hero-avatar,
|
||||
.avatar-preview {
|
||||
display: grid;
|
||||
place-items: center;
|
||||
@@ -727,228 +702,12 @@ async function savePassword() {
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.hero-avatar {
|
||||
width: 74px;
|
||||
height: 74px;
|
||||
font-size: 28px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.hero-avatar img,
|
||||
.avatar-preview img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.hero-copy {
|
||||
min-width: 0;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.eyebrow {
|
||||
color: #ff6a00;
|
||||
font-size: 13px;
|
||||
font-weight: 900;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.hero-copy h1 {
|
||||
margin: 8px 0 0;
|
||||
color: #17233d;
|
||||
font-size: 34px;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.hero-title-row {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.hero-quality-chip {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
min-height: 26px;
|
||||
padding: 0 10px;
|
||||
border: 1px solid #d8b4fe;
|
||||
border-radius: 999px;
|
||||
background: #f5f3ff;
|
||||
color: #6d28d9;
|
||||
font-size: 12px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.hero-copy p {
|
||||
margin: 10px 0 0;
|
||||
color: #64748b;
|
||||
font-size: 15px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.hero-realname {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
min-height: 40px;
|
||||
padding: 0 14px;
|
||||
border: none;
|
||||
border-radius: 999px;
|
||||
font-size: 14px;
|
||||
font-weight: 900;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.hero-realname.is-verified,
|
||||
.account-card dd.is-verified {
|
||||
background: #ecfdf3;
|
||||
color: #16a34a;
|
||||
}
|
||||
|
||||
.hero-realname.is-pending,
|
||||
.account-card dd.is-pending {
|
||||
background: #fff7ed;
|
||||
color: #f97316;
|
||||
}
|
||||
|
||||
.hero-realname.is-rejected,
|
||||
.account-card dd.is-rejected {
|
||||
background: #fff1f2;
|
||||
color: #e11d48;
|
||||
}
|
||||
|
||||
.hero-realname.is-unverified,
|
||||
.account-card dd.is-unverified {
|
||||
background: #eff6ff;
|
||||
color: #2563eb;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight {
|
||||
display: grid;
|
||||
grid-template-columns: auto minmax(0, 1fr) auto;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-top: 18px;
|
||||
padding: 17px 20px;
|
||||
border: 1px solid #e1d7fa;
|
||||
border-radius: 14px;
|
||||
background: linear-gradient(110deg, #faf7ff 0%, #ffffff 62%, #fffaf0 100%);
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-mark {
|
||||
display: grid;
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
place-items: center;
|
||||
border-radius: 12px;
|
||||
background: linear-gradient(135deg, #5b21b6 0%, #9333ea 65%, #f59e0b 100%);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-copy {
|
||||
display: grid;
|
||||
gap: 3px;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-copy > span {
|
||||
color: #7c3aed;
|
||||
font-size: 10px;
|
||||
font-weight: 900;
|
||||
letter-spacing: 0.08em;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-copy strong {
|
||||
color: #2e1065;
|
||||
font-size: 17px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-copy p {
|
||||
margin: 0;
|
||||
color: #70677f;
|
||||
font-size: 12px;
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-benefits {
|
||||
display: flex;
|
||||
gap: 7px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-benefits span {
|
||||
padding: 5px 9px;
|
||||
border-radius: 999px;
|
||||
background: #f5f3ff;
|
||||
color: #6d28d9;
|
||||
font-size: 11px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.profile-layout {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 360px;
|
||||
gap: 22px;
|
||||
margin-top: 22px;
|
||||
}
|
||||
|
||||
.edit-panel,
|
||||
.account-card {
|
||||
border: 1px solid #eef1f5;
|
||||
border-radius: 16px;
|
||||
background: #ffffff;
|
||||
box-shadow: 0 10px 28px rgba(23, 35, 61, 0.06);
|
||||
}
|
||||
|
||||
.edit-panel {
|
||||
padding: 28px;
|
||||
}
|
||||
|
||||
.panel-head {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 14px;
|
||||
margin-bottom: 26px;
|
||||
}
|
||||
|
||||
.panel-icon {
|
||||
display: grid;
|
||||
width: 48px;
|
||||
height: 48px;
|
||||
place-items: center;
|
||||
border-radius: 12px;
|
||||
background: #fff3e8;
|
||||
color: #ff6a00;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.panel-head h2 {
|
||||
margin: 0;
|
||||
color: #17233d;
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.panel-head p {
|
||||
margin: 6px 0 0;
|
||||
color: #64748b;
|
||||
font-size: 14px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.avatar-editor {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 18px;
|
||||
max-width: 640px;
|
||||
padding: 20px;
|
||||
border-radius: 14px;
|
||||
background: #f8fafc;
|
||||
border: 1px solid #e2e8f0;
|
||||
}
|
||||
|
||||
.avatar-preview {
|
||||
position: relative;
|
||||
width: 82px;
|
||||
@@ -1028,73 +787,6 @@ async function savePassword() {
|
||||
box-shadow: 0 10px 20px rgba(255, 106, 0, 0.18);
|
||||
}
|
||||
|
||||
.account-card {
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
.card-kicker {
|
||||
color: #8b9cb5;
|
||||
font-size: 13px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.account-card dl {
|
||||
display: grid;
|
||||
gap: 12px;
|
||||
margin: 18px 0 0;
|
||||
}
|
||||
|
||||
.account-card dl div {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
min-height: 48px;
|
||||
padding: 0 14px;
|
||||
border-radius: 10px;
|
||||
background: #f8fafc;
|
||||
}
|
||||
|
||||
.account-card dt {
|
||||
color: #8b9cb5;
|
||||
font-size: 13px;
|
||||
font-weight: 800;
|
||||
}
|
||||
|
||||
.account-card dd {
|
||||
margin: 0;
|
||||
color: #334155;
|
||||
font-size: 14px;
|
||||
font-weight: 900;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.account-card dd.growth-level {
|
||||
color: #7c3aed;
|
||||
}
|
||||
|
||||
.realname-shortcut {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
min-height: 44px;
|
||||
margin-top: 18px;
|
||||
padding: 0 14px;
|
||||
border: 1px solid #e2e8f0;
|
||||
border-radius: 10px;
|
||||
background: #ffffff;
|
||||
color: #475569;
|
||||
font-size: 14px;
|
||||
font-weight: 900;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.realname-shortcut:hover {
|
||||
border-color: #ff6a00;
|
||||
color: #ff6a00;
|
||||
}
|
||||
|
||||
.password-hint {
|
||||
margin: 0 0 12px;
|
||||
color: #8b9cb5;
|
||||
@@ -1102,146 +794,6 @@ async function savePassword() {
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
.quality-owner-card {
|
||||
margin-top: 22px;
|
||||
padding: 26px 28px;
|
||||
border: 1px solid #e8e4f4;
|
||||
border-radius: 16px;
|
||||
background: linear-gradient(135deg, #faf8ff 0%, #ffffff 68%);
|
||||
box-shadow: 0 10px 28px rgba(76, 29, 149, 0.06);
|
||||
}
|
||||
|
||||
.points-entry-card {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 18px;
|
||||
margin-top: 18px;
|
||||
padding: 20px 24px;
|
||||
border: 1px solid #ffd6bf;
|
||||
border-radius: 14px;
|
||||
background: linear-gradient(135deg, #fff8f3 0%, #fff 72%);
|
||||
}
|
||||
|
||||
.points-entry-card div {
|
||||
display: grid;
|
||||
gap: 4px;
|
||||
}
|
||||
|
||||
.points-entry-card span {
|
||||
color: #ff6a00;
|
||||
font-size: 10px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.points-entry-card strong {
|
||||
color: #c2410c;
|
||||
font-size: 19px;
|
||||
}
|
||||
|
||||
.points-entry-card p {
|
||||
margin: 0;
|
||||
color: #6b7280;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.points-entry-card :deep(.el-button--primary) {
|
||||
border: 1px solid #ff6a00 !important;
|
||||
background: #ff6a00 !important;
|
||||
box-shadow: 0 6px 14px rgba(255, 106, 0, 0.2) !important;
|
||||
}
|
||||
|
||||
.quality-owner-card.is-active {
|
||||
border-color: #c4b5fd;
|
||||
}
|
||||
|
||||
.quality-owner-heading,
|
||||
.quality-owner-actions {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
gap: 18px;
|
||||
}
|
||||
|
||||
.quality-owner-heading h2 {
|
||||
margin: 6px 0 0;
|
||||
color: #312e81;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.quality-owner-heading p {
|
||||
max-width: 680px;
|
||||
margin: 8px 0 0;
|
||||
color: #6b7280;
|
||||
font-size: 13px;
|
||||
font-weight: 700;
|
||||
line-height: 1.7;
|
||||
}
|
||||
|
||||
.quality-owner-status {
|
||||
flex-shrink: 0;
|
||||
padding: 6px 12px;
|
||||
border-radius: 999px;
|
||||
background: #f1f5f9;
|
||||
color: #64748b;
|
||||
font-size: 12px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.quality-owner-card.is-active .quality-owner-status {
|
||||
background: #ede9fe;
|
||||
color: #6d28d9;
|
||||
}
|
||||
|
||||
.quality-owner-metrics {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(4, minmax(0, 1fr));
|
||||
gap: 10px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.quality-owner-metrics div {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
padding: 14px;
|
||||
border: 1px solid #ede9fe;
|
||||
border-radius: 10px;
|
||||
background: rgba(255, 255, 255, 0.82);
|
||||
}
|
||||
|
||||
.quality-owner-metrics span,
|
||||
.quality-owner-actions span {
|
||||
color: #7b8492;
|
||||
font-size: 12px;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.quality-owner-metrics strong {
|
||||
color: #312e81;
|
||||
font-size: 18px;
|
||||
font-weight: 900;
|
||||
}
|
||||
|
||||
.quality-owner-actions {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.quality-owner-actions :deep(.el-button--primary) {
|
||||
border: none;
|
||||
background: #7c3aed;
|
||||
}
|
||||
|
||||
.quality-owner-action-buttons {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.quality-owner-action-buttons :deep(.el-button) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.quality-owner-agreement-body {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
@@ -1321,41 +873,6 @@ async function savePassword() {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
@media (max-width: 1100px) {
|
||||
.profile-layout {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.quality-owner-metrics {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 640px) {
|
||||
.quality-owner-heading,
|
||||
.quality-owner-actions {
|
||||
align-items: flex-start;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.quality-owner-action-buttons {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.quality-owner-metrics {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.quality-owner-spotlight {
|
||||
grid-template-columns: auto minmax(0, 1fr);
|
||||
}
|
||||
|
||||
.quality-owner-spotlight-benefits {
|
||||
grid-column: 1 / -1;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
/* Account center layout */
|
||||
.profile-page {
|
||||
width: min(1120px, 100%);
|
||||
|
||||
Reference in New Issue
Block a user