Adds suppliers feature to application

Introduces comprehensive suppliers management with mock data, localization, and UI components

Implements:
- Suppliers page with data table
- Localization for Danish and English
- Search and filtering functionality
- Responsive table design
- Mock data for initial population
This commit is contained in:
Janus C. H. Knudsen 2026-01-24 00:13:05 +01:00
parent 7aaa475a14
commit dc2bab5702
16 changed files with 622 additions and 8 deletions

View file

@ -0,0 +1,70 @@
/**
* Suppliers - Page Styling
*
* Feature-specific styling only.
* Reuses:
* - swp-sticky-header, swp-header-content, swp-page-container (page.css)
* - swp-stats-row.cols-4, swp-stat-card (stats.css)
* - swp-action-bar, swp-search-input (components.css)
* - swp-data-table, swp-status-badge, swp-empty-state (components.css)
* - swp-btn (components.css)
*/
/* ===========================================
SUPPLIER TABLE (uses swp-data-table from components.css)
=========================================== */
swp-card.suppliers-list {
padding: 0;
overflow: hidden;
}
/* Table columns: Leverandør(1fr) | Kontakt(150px) | Produkter(80px) | Sidste(120px) | Status(100px) */
swp-card.suppliers-list swp-data-table {
grid-template-columns: minmax(200px, 1fr) 150px 80px 120px 100px;
}
swp-card.suppliers-list swp-data-table-header,
swp-card.suppliers-list swp-data-table-row {
padding: 0 var(--spacing-10);
}
swp-card.suppliers-list swp-data-table-header swp-data-table-cell {
padding-top: var(--spacing-5);
padding-bottom: var(--spacing-5);
}
swp-card.suppliers-list swp-data-table-row {
cursor: pointer;
}
swp-card.suppliers-list swp-data-table-cell {
padding: var(--spacing-5) 0;
}
/* Supplier cell (name + city) */
swp-supplier-cell {
display: flex;
flex-direction: column;
gap: 2px;
}
swp-supplier-name {
font-weight: var(--font-weight-medium);
color: var(--color-text);
}
swp-supplier-city {
font-size: var(--font-size-sm);
color: var(--color-text-secondary);
}
/* Products column (center + mono) */
swp-card.suppliers-list swp-data-table-row swp-data-table-cell:nth-child(3) {
font-family: var(--font-mono);
text-align: center;
}
/* Last order column (muted) */
swp-card.suppliers-list swp-data-table-row swp-data-table-cell:nth-child(4) {
color: var(--color-text-secondary);
}