Design and layout tweaks

app/Http/Controllers/InvoiceController.php

@@ -275,7 +275,7 @@ public function exportXml($id)
             ];             
             $document->setDocumentPositionQuantity(
                 $item['quantity'],
-                $units[$item['unit']]
+                $units[$item['unit']] ?? ZugferdUnitCodes::REC20_PIECE
             );
 
             $document->addDocumentPositionTax(

resources/js/components/documents/DocumentTable.vue

@@ -134,11 +134,11 @@ const calcTaxes = (amount: number) => {
                     toLocalDate(invoice.invoiceDate) }}
                 </TableCell>
                 <TableCell class="lg:hidden max-w-[220px] md:max-w-[320px] overflow-hidden text-ellipsis">
-                    <span class="font-bold">{{ invoice.customer?.companyName }}</span><br />
+                    <span class="font-semibold">{{ invoice.customer?.companyName }}</span><br />
                     {{ invoice.title }}
                 </TableCell>
                 <TableCell
-                    class="hidden lg:table-cell max-w-[100px] md:max-w-[120px] lg:max-w-auto overflow-hidden text-ellipsis font-bold">
+                    class="hidden lg:table-cell max-w-[100px] md:max-w-[120px] lg:max-w-auto overflow-hidden text-ellipsis font-semibold">
                     {{ invoice.customer?.companyName }}</TableCell>
                 <TableCell colspan="2"
                     class="hidden lg:table-cell max-w-[120px] md:max-w-[160px] lg:max-w-auto overflow-hidden text-ellipsis">
@@ -156,7 +156,7 @@ const calcTaxes = (amount: number) => {
         <TableFooter>
             <!-- Summe -->
             <TableRow
-                class="border-none bg-slate-200 dark:bg-neutral-900/60 hover:bg-slate-200 dark:hover:bg-neutral-900/60">
+                class="border-none bg-slate-100 dark:bg-neutral-900/60 hover:bg-slate-100 dark:hover:bg-neutral-900/60">
                 <TableCell colspan="2" class="hidden lg:table-cell"></TableCell>
                 <TableCell colspan="2" class="hidden md:table-cell"></TableCell>
                 <TableCell colspan="1"></TableCell>
@@ -169,7 +169,7 @@ const calcTaxes = (amount: number) => {
             </TableRow>
             <!-- Bezahlt -->
             <TableRow v-if="!(totalDue == 0 && totalNotIssued == 0)"
-                class="border-none bg-slate-200 dark:bg-neutral-900/60 hover:bg-slate-200 dark:hover:bg-neutral-900/60">
+                class="border-none bg-slate-100 dark:bg-neutral-900/60 hover:bg-slate-100 dark:hover:bg-neutral-900/60">
                 <TableCell colspan="2" class="hidden lg:table-cell"></TableCell>
                 <TableCell colspan="2" class="hidden md:table-cell"></TableCell>
                 <TableCell colspan="1"></TableCell>
@@ -182,7 +182,7 @@ const calcTaxes = (amount: number) => {
             </TableRow>
 
             <TableRow v-if="totalDue > 0"
-                class="border-none bg-slate-200 dark:bg-neutral-900/60 hover:bg-slate-200 dark:hover:bg-neutral-900/60 text-destructive">
+                class="border-none bg-slate-100 dark:bg-neutral-900/60 hover:bg-slate-100 dark:hover:bg-neutral-900/60 text-destructive">
                 <TableCell colspan="2" class="hidden lg:table-cell"></TableCell>
                 <TableCell colspan="2" class="hidden md:table-cell"></TableCell>
                 <TableCell colspan="1"></TableCell>
@@ -195,7 +195,7 @@ const calcTaxes = (amount: number) => {
             </TableRow>
 
             <TableRow v-if="totalNotIssued > 0"
-                class="border-none bg-slate-200 dark:bg-neutral-900/60 hover:bg-slate-200 dark:hover:bg-neutral-900/60 text-muted-foreground">
+                class="border-none bg-slate-100 dark:bg-neutral-900/60 hover:bg-slate-100 dark:hover:bg-neutral-900/60 text-muted-foreground">
                 <TableCell colspan="2" class="hidden lg:table-cell"></TableCell>
                 <TableCell colspan="2" class="hidden md:table-cell"></TableCell>
                 <TableCell colspan="1"></TableCell>
@@ -212,6 +212,9 @@ const calcTaxes = (amount: number) => {
 </template>
 
 <style>
+.document-table {
+    font-size: 0.833rem;
+}
 .document-table th,
 .document-table td {
     padding-top: 0.694em !important;

resources/js/layouts/app/AppSidebarLayout.vue

@@ -17,7 +17,7 @@ withDefaults(defineProps<Props>(), {
 <template>
     <AppShell variant="sidebar">
         <AppSidebar />
-        <AppContent variant="sidebar" class="overflow-x-hidden bg-slate-200 dark:bg-neutral-900/40">
+        <AppContent variant="sidebar" class="overflow-x-hidden bg-slate-100 dark:bg-neutral-900/40">
             <AppSidebarHeader :breadcrumbs="breadcrumbs" />
             <slot />
         </AppContent>