样式整改
This commit is contained in:
@@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user