Reorganizes and optimizes shared CSS components
Consolidates UI components into a centralized components.css file Removes duplicate styles across multiple CSS files Adds utility classes in a new utilities.css file Reduces overall CSS complexity and improves maintainability Removes quick-stats.css and redistributes its styles Updates layout and stylesheet references accordingly
This commit is contained in:
parent
15579acba8
commit
2e6207bb0b
33 changed files with 971 additions and 796 deletions
|
|
@ -78,54 +78,9 @@ swp-page-actions {
|
|||
}
|
||||
|
||||
/* ===========================================
|
||||
CARDS
|
||||
CARD CONTENT GRIDS (Page-specific)
|
||||
Base card styles in components.css
|
||||
=========================================== */
|
||||
swp-card {
|
||||
display: block;
|
||||
background: var(--color-surface);
|
||||
border: 1px solid var(--color-border);
|
||||
border-radius: var(--border-radius-lg);
|
||||
padding: var(--card-padding);
|
||||
}
|
||||
|
||||
swp-card-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin: calc(-1 * var(--card-padding)) calc(-1 * var(--card-padding)) var(--spacing-5) calc(-1 * var(--card-padding));
|
||||
padding: var(--spacing-4) var(--card-padding);
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
}
|
||||
|
||||
swp-card-title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--spacing-2);
|
||||
font-size: var(--font-size-base);
|
||||
font-weight: var(--font-weight-semibold);
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
swp-card-title i {
|
||||
font-size: var(--font-size-xl);
|
||||
color: var(--color-text-secondary);
|
||||
}
|
||||
|
||||
swp-card-action {
|
||||
font-size: var(--font-size-md);
|
||||
color: var(--color-teal);
|
||||
cursor: pointer;
|
||||
transition: opacity var(--transition-fast);
|
||||
}
|
||||
|
||||
swp-card-action:hover {
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
swp-card-content {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Card content with grid lists - auto-detect via :has() */
|
||||
swp-card-content:has(> swp-booking-list),
|
||||
swp-card-content:has(> swp-notification-list),
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue