样式整改

This commit is contained in:
2026-02-25 23:44:01 +08:00
parent 8beb4a5508
commit 116e363e83
16 changed files with 660 additions and 720 deletions

View File

@@ -93,27 +93,27 @@ const buttonClass = computed(() => {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
padding: 8px 24px;
gap: var(--space-2);
padding: var(--space-2) var(--space-6);
border: none;
border-radius: 12px;
font-size: 16px;
border-radius: var(--radius-lg);
font-size: var(--font-size-base);
font-weight: 500;
color: #ffffff;
cursor: pointer;
transition: all 0.2s ease;
background: var(--color-slate-900);
transition: all var(--duration-fast);
background: var(--color-gray-900);
user-select: none;
}
.gradient-button:hover {
background: var(--color-slate-800);
background: var(--color-gray-800);
}
.gradient-button:active {
background: var(--color-slate-800);
background: var(--color-gray-800);
transform: translateY(0);
box-shadow: 0 4px 6px -2px rgba(59, 130, 246, 0.15);
box-shadow: var(--shadow-primary);
}
.gradient-button__content,
@@ -123,7 +123,7 @@ const buttonClass = computed(() => {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 6px;
gap: var(--space-1);
}
.gradient-button__icon {
@@ -136,25 +136,25 @@ const buttonClass = computed(() => {
}
.gradient-button__loading-text {
margin-left: 4px;
margin-left: var(--space-1);
}
/* 尺寸变体 */
.gradient-button--large {
padding: 10px 20px;
font-size: 15px;
font-size: var(--font-size-sm);
min-height: 36px;
}
.gradient-button--middle {
padding: 8px 16px;
font-size: 14px;
padding: var(--space-2) var(--space-4);
font-size: var(--font-size-sm);
min-height: 32px;
}
.gradient-button--small {
padding: 4px 12px;
font-size: 13px;
padding: var(--space-1) var(--space-3);
font-size: var(--font-size-xs);
min-height: 24px;
}
@@ -169,13 +169,13 @@ const buttonClass = computed(() => {
.gradient-button:disabled {
opacity: 0.4;
cursor: not-allowed;
background: var(--color-slate-700);
background: var(--color-gray-700);
box-shadow: none;
}
.gradient-button--disabled:hover,
.gradient-button:disabled:hover {
background: var(--color-slate-700);
background: var(--color-gray-700);
transform: none;
box-shadow: none;
}
@@ -192,8 +192,8 @@ const buttonClass = computed(() => {
/* 响应式调整 */
@media (max-width: 768px) {
.gradient-button--large {
padding: 8px 16px;
font-size: 14px;
padding: var(--space-2) var(--space-4);
font-size: var(--font-size-sm);
min-height: 32px;
}
}