Janus007/PlanTempusApp
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Reorganizes and optimizes shared CSS components

Browse source 
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:
Janus C. H. Knudsen 2026-01-13 00:09:46 +01:00
parent 15579acba8
commit 2e6207bb0b
33 changed files with 971 additions and 796 deletions
Download patch file Download diff file Expand all files Collapse all files

26
PlanTempus.Application/wwwroot/css/COMPONENT-CATALOG.md
View file

@ -13,10 +13,32 @@ Reference for alle genbrugelige komponenter. **LAV ALDRIG EN NY KOMPONENT HVIS D
| `swp-page-title` | Titel-wrapper med h1 og p | h1 + subtitle |
| `swp-page-actions` | Action buttons i header | Flex gap |
| `swp-card` | Standard card wrapper | Border, padding, rounded |
| `swp-card-header` | Card header | Flex, title + action |
| `swp-card-title` | Card titel med ikon | `<swp-card-title><i>...</i> Text</swp-card-title>` |
| `swp-section-label` | Card section label | Uppercase, 11px, border-bottom |
| `swp-section-header` | Wrapper for label + action | Flex, space-between |
| `swp-section-action` | Action link i section header | Teal, clickable |
| `swp-card-content` | Card indhold | Block |
### Card Header Eksempler
**Simpel label (uden action):**
```html
<swp-card>
<swp-section-label>Kontakter</swp-section-label>
<swp-card-content>...</swp-card-content>
</swp-card>
```
**Label med action:**
```html
<swp-card>
<swp-section-header>
<swp-section-label>Dagens bookinger</swp-section-label>
<swp-section-action>Se alle</swp-section-action>
</swp-section-header>
<swp-card-content>...</swp-card-content>
</swp-card>
```
---
## Stats Components (stats.css)