2025-04-02 15:45:52 +00:00

76 lines
1.8 KiB
CSS

:root {
/* MD3 Colors - Green Theme */
--md-primary: #2e7d32;
--md-on-primary: #FFFFFF;
--md-primary-container: #b8e6b9;
--md-on-primary-container: #005006;
--md-secondary: #466c48;
--md-on-secondary: #FFFFFF;
--md-surface: #fbfdf7;
--md-surface-variant: #dde5db;
--md-on-surface: #191c18;
--md-on-surface-variant: #414942;
--md-outline: #727971;
--md-error: #be3920;
/* Elevation */
--md-elevation-1: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.14);
--md-elevation-2: 0 3px 6px rgba(0,0,0,0.15), 0 2px 4px rgba(0,0,0,0.12);
}
.md3-text-field {
padding: 12px 16px;
border-radius: 4px;
border: 1px solid var(--md-outline);
background: var(--md-surface);
color: var(--md-on-surface);
font-family: Roboto, sans-serif;
font-size: 16px;
transition: border-color 0.2s;
}
.md3-text-field:focus {
outline: none;
border-color: var(--md-primary);
}
.md3-button {
padding: 10px 24px;
border-radius: 20px;
border: none;
background: var(--md-primary);
color: var(--md-on-primary);
font-family: Roboto, sans-serif;
font-weight: 500;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 0.1px;
cursor: pointer;
transition: background 0.2s;
text-decoration: none; /* 添加这一行 */
}
.md3-button:hover {
background: var(--md-primary-container);
color: var(--md-on-primary-container);
}
.md3-card {
background: var(--md-surface);
border-radius: 12px;
padding: 24px;
box-shadow: var(--md-elevation-1);
transition: box-shadow 0.2s;
}
.md3-card:hover {
box-shadow: var(--md-elevation-2);
}
.md3-label {
color: var(--md-on-surface-variant);
font-size: 14px;
font-weight: 500;
margin-bottom: 8px;
}