update many things

src/app/domains/consumer/components/invoices/shared-saleInvoice.component.html

@@ -4,24 +4,32 @@
   <uikit-empty-state> </uikit-empty-state>
 } @else {
   <div class="flex flex-col gap-6">
-    <app-card-data cardTitle="اطلاعات فاکتور" [editable]="false">
+    <app-card-data cardTitle="اطلاعات فاکتور" [editable]="false" [backRoute]="backRoute">
       <ng-template #moreActions>
-        <button pButton type="button" label="چاپ" icon="pi pi-print" outlined (click)="printInvoice()"></button>
+        <button
+          pButton
+          type="button"
+          label="چاپ"
+          icon="pi pi-print"
+          outlined
+          size="small"
+          (click)="printInvoice()"
+        ></button>
       </ng-template>
       <div class="flex flex-col gap-4">
-        <div class="grid grid-cols-3 gap-4 items-center">
+        <div class="listKeyValue">
           <app-key-value label="کد رهگیری" [value]="invoice.code" />
           <app-key-value label="تاریخ فاکتور" [value]="invoice.invoice_date" type="dateTime" />
           <app-key-value label="تاریخ ایجاد فاکتور" [value]="invoice.created_at" type="dateTime" />
           <app-key-value label="وضعیت صدور به سامانه‌ی مودیان">
             <catalog-tax-provider-status-tag [status]="invoice.status.value" [translate]="invoice.status.translate" />
           </app-key-value>
-          <div class="col-span-3">
+          <div class="col-span-full">
             <app-key-value label="توضیحات" [value]="invoice.notes" />
           </div>
         </div>
         <p-divider align="center"> اطلاعات پرداخت </p-divider>
-        <div class="grid grid-cols-3 gap-4 items-center">
+        <div class="grid md:grid-cols-3 sm:grid-cols-2 sm:gap-4 gap-3 items-center">
           <app-key-value label="مجموع قابل پرداخت" [value]="invoice.total_amount" type="price" />
           @for (payment of invoice.payments; track $index) {
             <app-key-value
@@ -33,7 +41,7 @@
         </div>
 
         <p-divider align="center"> اطلاعات صادر کننده </p-divider>
-        <div class="grid grid-cols-3 gap-4 items-center">
+        <div class="listKeyValue">
           <app-key-value label="کسب و کار" [value]="invoice.pos!.complex.business_activity.name" />
           <app-key-value label="مجموعه" [value]="invoice.pos!.complex.name" />
           <app-key-value label="پایانه‌ی فروش" [value]="invoice.pos!.name" />
@@ -43,7 +51,7 @@
         @if (variant !== "customer") {
           <p-divider align="center"> اطلاعات مشتری </p-divider>
           @if (invoice.customer) {
-            <div class="grid grid-cols-3 gap-4 items-center">
+            <div class="listKeyValue">
               @if (invoice.customer.type === "INDIVIDUAL") {
                 <app-key-value label="نوع مشتری" value="حقیقی" />
                 <app-key-value label="نام" [value]="invoice.customer.individual?.first_name" />
@@ -60,7 +68,7 @@
               }
             </div>
           } @else if (invoice.unknown_customer) {
-            <div class="grid grid-cols-3 gap-4 items-center">
+            <div class="listKeyValue">
               <app-key-value label="نوع مشتری" value="نوع دوم" />
               <app-key-value label="عنوان" [value]="invoice.unknown_customer.name" />
               <app-key-value label="کد ثبتی" [value]="invoice.unknown_customer.national_code" />