refactor: split admin.css monolith, standardize CSS architecture
- Split admin.css (3228 lines) into 12 focused files: variables, base, forms, buttons, layout, components, tables, skeleton, datepicker, filemanager, pagination, responsive - Extracted shared styles from offers.css and dashboard.css into components.css and forms.css (offers-* → admin-* prefix) - Standardized naming: dash-kpi-* → admin-kpi-*, session-* → dash-session-*, rich-editor → admin-rich-editor - Deleted duplicate offers-tabs (using admin-tabs everywhere) - Deduplicated DatePicker and FileManager CSS (~360 lines removed) - Added 16 utility classes to base.css (font sizes, widths, gaps, margins) - Deleted empty admin.css Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
BOHA
@@ -1220,14 +1220,14 @@ export default function InvoiceDetail() {
|
||||
<form onSubmit={handleCreateSubmit}>
|
||||
{/* Basic info */}
|
||||
<motion.div
|
||||
className="offers-editor-section"
|
||||
className="admin-editor-section"
|
||||
initial={{ opacity: 0, y: 12 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.25, delay: 0.06 }}
|
||||
>
|
||||
<h3 className="admin-card-title">Základní údaje</h3>
|
||||
<div className="admin-form">
|
||||
<div className="offers-form-row-3">
|
||||
<div className="admin-form-row admin-form-row-3">
|
||||
<FormField label="Číslo faktury">
|
||||
<input
|
||||
type="text"
|
||||
@@ -1242,7 +1242,7 @@ export default function InvoiceDetail() {
|
||||
required
|
||||
>
|
||||
{form.customer_id ? (
|
||||
<div className="offers-customer-selected">
|
||||
<div className="admin-customer-selected">
|
||||
<span>{form.customer_name}</span>
|
||||
<button
|
||||
type="button"
|
||||
@@ -1271,7 +1271,7 @@ export default function InvoiceDetail() {
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
className="offers-customer-select"
|
||||
className="admin-customer-select"
|
||||
onClick={(e) => e.stopPropagation()}
|
||||
>
|
||||
<input
|
||||
@@ -1287,16 +1287,16 @@ export default function InvoiceDetail() {
|
||||
autoComplete="off"
|
||||
/>
|
||||
{showCustomerDropdown && (
|
||||
<div className="offers-customer-dropdown">
|
||||
<div className="admin-customer-dropdown">
|
||||
{filteredCustomers.length === 0 ? (
|
||||
<div className="offers-customer-dropdown-empty">
|
||||
<div className="admin-customer-dropdown-empty">
|
||||
Žádní zákazníci
|
||||
</div>
|
||||
) : (
|
||||
filteredCustomers.slice(0, 10).map((c) => (
|
||||
<div
|
||||
key={c.id}
|
||||
className="offers-customer-dropdown-item"
|
||||
className="admin-customer-dropdown-item"
|
||||
onMouseDown={() => selectCustomer(c)}
|
||||
>
|
||||
<div>{c.name}</div>
|
||||
@@ -1392,7 +1392,7 @@ export default function InvoiceDetail() {
|
||||
</FormField>
|
||||
</div>
|
||||
|
||||
<div className="offers-form-row-3">
|
||||
<div className="admin-form-row admin-form-row-3">
|
||||
<FormField label="Forma úhrady">
|
||||
<select
|
||||
value={form.payment_method}
|
||||
@@ -1580,8 +1580,8 @@ export default function InvoiceDetail() {
|
||||
</DndContext>
|
||||
|
||||
{/* Totals */}
|
||||
<div className="offers-totals-summary">
|
||||
<div className="offers-totals-row">
|
||||
<div className="admin-totals-summary">
|
||||
<div className="admin-totals-row">
|
||||
<span>Mezisoučet:</span>
|
||||
<span>
|
||||
{formatCurrency(createTotals.subtotal, form.currency)}
|
||||
@@ -1590,13 +1590,13 @@ export default function InvoiceDetail() {
|
||||
{form.apply_vat &&
|
||||
Object.entries(createTotals.vatByRate).map(
|
||||
([rate, amount]) => (
|
||||
<div key={rate} className="offers-totals-row">
|
||||
<div key={rate} className="admin-totals-row">
|
||||
<span>DPH {rate}%:</span>
|
||||
<span>{formatCurrency(amount, form.currency)}</span>
|
||||
</div>
|
||||
),
|
||||
)}
|
||||
<div className="offers-totals-row offers-totals-total">
|
||||
<div className="admin-totals-row admin-totals-total">
|
||||
<span>Celkem k úhradě:</span>
|
||||
<span>
|
||||
{formatCurrency(createTotals.total, form.currency)}
|
||||
@@ -1608,7 +1608,7 @@ export default function InvoiceDetail() {
|
||||
|
||||
{/* Notes */}
|
||||
<motion.div
|
||||
className="offers-editor-section"
|
||||
className="admin-editor-section"
|
||||
initial={{ opacity: 0, y: 12 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.25, delay: 0.15 }}
|
||||
@@ -1738,14 +1738,14 @@ export default function InvoiceDetail() {
|
||||
|
||||
{/* Info */}
|
||||
<motion.div
|
||||
className="offers-editor-section"
|
||||
className="admin-editor-section"
|
||||
initial={{ opacity: 0, y: 12 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.25, delay: 0.06 }}
|
||||
>
|
||||
<h3 className="admin-card-title">Informace</h3>
|
||||
<div className="admin-form">
|
||||
<div className="offers-form-row-3 mb-2">
|
||||
<div className="admin-form-row admin-form-row-3 mb-2">
|
||||
<FormField label="Zákazník">
|
||||
<div className="fw-500">{invoice.customer_name || "\u2014"}</div>
|
||||
{invoice.customer && (
|
||||
@@ -1778,7 +1778,7 @@ export default function InvoiceDetail() {
|
||||
<div>{invoice.currency}</div>
|
||||
</FormField>
|
||||
</div>
|
||||
<div className="offers-form-row-3 mb-2">
|
||||
<div className="admin-form-row admin-form-row-3 mb-2">
|
||||
<FormField label="Datum vystavení">
|
||||
<div>{formatDate(invoice.issue_date)}</div>
|
||||
</FormField>
|
||||
@@ -1795,7 +1795,7 @@ export default function InvoiceDetail() {
|
||||
<div>{formatDate(invoice.tax_date)}</div>
|
||||
</FormField>
|
||||
</div>
|
||||
<div className="offers-form-row-3">
|
||||
<div className="admin-form-row admin-form-row-3">
|
||||
<FormField label="Forma úhrady">
|
||||
<div>{invoice.payment_method}</div>
|
||||
</FormField>
|
||||
@@ -2007,8 +2007,8 @@ export default function InvoiceDetail() {
|
||||
</>
|
||||
)}
|
||||
|
||||
<div className="offers-totals-summary">
|
||||
<div className="offers-totals-row">
|
||||
<div className="admin-totals-summary">
|
||||
<div className="admin-totals-row">
|
||||
<span>Mezisoučet:</span>
|
||||
<span>
|
||||
{formatCurrency(editTotals.subtotal, invoice.currency)}
|
||||
@@ -2016,12 +2016,12 @@ export default function InvoiceDetail() {
|
||||
</div>
|
||||
{Number(invoice.apply_vat) > 0 &&
|
||||
Object.entries(editTotals.vatByRate).map(([rate, amount]) => (
|
||||
<div key={rate} className="offers-totals-row">
|
||||
<div key={rate} className="admin-totals-row">
|
||||
<span>DPH {rate}%:</span>
|
||||
<span>{formatCurrency(amount, invoice.currency)}</span>
|
||||
</div>
|
||||
))}
|
||||
<div className="offers-totals-row offers-totals-total">
|
||||
<div className="admin-totals-row admin-totals-total">
|
||||
<span>Celkem k úhradě:</span>
|
||||
<span>{formatCurrency(editTotals.total, invoice.currency)}</span>
|
||||
</div>
|
||||
@@ -2031,7 +2031,7 @@ export default function InvoiceDetail() {
|
||||
|
||||
{/* Notes */}
|
||||
<motion.div
|
||||
className="offers-editor-section"
|
||||
className="admin-editor-section"
|
||||
initial={{ opacity: 0, y: 12 }}
|
||||
animate={{ opacity: 1, y: 0 }}
|
||||
transition={{ duration: 0.25, delay: 0.15 }}
|
||||
|
||||
Reference in New Issue
Block a user