Refactor UI components and update stylesheets
Standardizes markup structure for invoice history, employee table, and salary history components Simplifies HTML markup by removing unnecessary wrapper elements Applies consistent CSS class naming and styling approach Improves component readability and maintainability
This commit is contained in:
parent
679c3fb3a6
commit
8b2a630861
5 changed files with 144 additions and 251 deletions
|
|
@ -1,108 +1,101 @@
|
|||
<swp-invoices-card>
|
||||
<swp-invoices-header>
|
||||
<swp-invoices-title localize="account.invoices.title">Faktura-historik</swp-invoices-title>
|
||||
</swp-invoices-header>
|
||||
<swp-card class="invoice-history">
|
||||
<swp-section-label localize="account.invoices.title">Faktura-historik</swp-section-label>
|
||||
<swp-data-table>
|
||||
<swp-data-table-header>
|
||||
<swp-data-table-cell localize="account.invoices.date">Dato</swp-data-table-cell>
|
||||
<swp-data-table-cell localize="account.invoices.invoiceNumber">Fakturanr.</swp-data-table-cell>
|
||||
<swp-data-table-cell localize="account.invoices.amount">Beløb</swp-data-table-cell>
|
||||
<swp-data-table-cell localize="common.status">Status</swp-data-table-cell>
|
||||
<swp-data-table-cell></swp-data-table-cell>
|
||||
</swp-data-table-header>
|
||||
<swp-data-table-row>
|
||||
<swp-data-table-cell>1. jan 2026</swp-data-table-cell>
|
||||
<swp-data-table-cell class="mono">INV-2026-0001</swp-data-table-cell>
|
||||
<swp-data-table-cell>599,00 kr</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-data-table-cell>
|
||||
</swp-data-table-row>
|
||||
|
||||
<swp-invoice-table>
|
||||
<swp-invoice-table-header>
|
||||
<swp-invoice-row>
|
||||
<swp-invoice-cell localize="account.invoices.date">Dato</swp-invoice-cell>
|
||||
<swp-invoice-cell localize="account.invoices.invoiceNumber">Fakturanr.</swp-invoice-cell>
|
||||
<swp-invoice-cell localize="account.invoices.amount">Beløb</swp-invoice-cell>
|
||||
<swp-invoice-cell localize="common.status">Status</swp-invoice-cell>
|
||||
<swp-invoice-cell></swp-invoice-cell>
|
||||
</swp-invoice-row>
|
||||
</swp-invoice-table-header>
|
||||
<swp-invoice-table-body>
|
||||
<swp-invoice-row>
|
||||
<swp-invoice-cell>1. jan 2026</swp-invoice-cell>
|
||||
<swp-invoice-cell class="mono">INV-2026-0001</swp-invoice-cell>
|
||||
<swp-invoice-cell>599,00 kr</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-invoice-cell>
|
||||
</swp-invoice-row>
|
||||
<swp-data-table-row>
|
||||
<swp-data-table-cell>1. dec 2025</swp-data-table-cell>
|
||||
<swp-data-table-cell class="mono">INV-2025-0012</swp-data-table-cell>
|
||||
<swp-data-table-cell>599,00 kr</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-data-table-cell>
|
||||
</swp-data-table-row>
|
||||
|
||||
<swp-invoice-row>
|
||||
<swp-invoice-cell>1. dec 2025</swp-invoice-cell>
|
||||
<swp-invoice-cell class="mono">INV-2025-0012</swp-invoice-cell>
|
||||
<swp-invoice-cell>599,00 kr</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-invoice-cell>
|
||||
</swp-invoice-row>
|
||||
<swp-data-table-row>
|
||||
<swp-data-table-cell>1. nov 2025</swp-data-table-cell>
|
||||
<swp-data-table-cell class="mono">INV-2025-0011</swp-data-table-cell>
|
||||
<swp-data-table-cell>599,00 kr</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-data-table-cell>
|
||||
</swp-data-table-row>
|
||||
|
||||
<swp-invoice-row>
|
||||
<swp-invoice-cell>1. nov 2025</swp-invoice-cell>
|
||||
<swp-invoice-cell class="mono">INV-2025-0011</swp-invoice-cell>
|
||||
<swp-invoice-cell>599,00 kr</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-invoice-cell>
|
||||
</swp-invoice-row>
|
||||
<swp-data-table-row>
|
||||
<swp-data-table-cell>1. okt 2025</swp-data-table-cell>
|
||||
<swp-data-table-cell class="mono">INV-2025-0010</swp-data-table-cell>
|
||||
<swp-data-table-cell>599,00 kr</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-data-table-cell>
|
||||
</swp-data-table-row>
|
||||
|
||||
<swp-invoice-row>
|
||||
<swp-invoice-cell>1. okt 2025</swp-invoice-cell>
|
||||
<swp-invoice-cell class="mono">INV-2025-0010</swp-invoice-cell>
|
||||
<swp-invoice-cell>599,00 kr</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-invoice-cell>
|
||||
</swp-invoice-row>
|
||||
|
||||
<swp-invoice-row>
|
||||
<swp-invoice-cell>1. sep 2025</swp-invoice-cell>
|
||||
<swp-invoice-cell class="mono">INV-2025-0009</swp-invoice-cell>
|
||||
<swp-invoice-cell>599,00 kr</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-invoice-cell>
|
||||
<swp-invoice-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-invoice-cell>
|
||||
</swp-invoice-row>
|
||||
</swp-invoice-table-body>
|
||||
</swp-invoice-table>
|
||||
</swp-invoices-card>
|
||||
<swp-data-table-row>
|
||||
<swp-data-table-cell>1. sep 2025</swp-data-table-cell>
|
||||
<swp-data-table-cell class="mono">INV-2025-0009</swp-data-table-cell>
|
||||
<swp-data-table-cell>599,00 kr</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-invoice-status class="paid">
|
||||
<i class="ph ph-check-circle"></i>
|
||||
<span localize="account.invoices.paid">Betalt</span>
|
||||
</swp-invoice-status>
|
||||
</swp-data-table-cell>
|
||||
<swp-data-table-cell>
|
||||
<swp-download-btn>
|
||||
<i class="ph ph-download"></i>
|
||||
<span localize="account.invoices.download">PDF</span>
|
||||
</swp-download-btn>
|
||||
</swp-data-table-cell>
|
||||
</swp-data-table-row>
|
||||
</swp-data-table>
|
||||
</swp-card>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue