fix: payment portal page

packages/server/src/modules/SaleInvoices/queries/GetInvoicePaymentLink.transformer.ts

@@ -209,7 +209,7 @@ class GetInvoicePaymentLinkTaxEntryTransformer extends SaleInvoiceTaxEntryTransf
 
 class GetInvoicePaymentLinkBrandingTemplate extends GetPdfTemplateTransformer {
   public includeAttributes = (): string[] => {
-    return ['companyLogoUri', 'primaryColor'];
+    return ['companyLogoUri', 'primaryColor', 'secondaryColor'];
   };
 
   public excludeAttributes = (): string[] => {
@@ -219,4 +219,8 @@ class GetInvoicePaymentLinkBrandingTemplate extends GetPdfTemplateTransformer {
   primaryColor = (template) => {
     return template.attributes?.primaryColor;
   };
+
+  secondaryColor = (template) => {
+    return template.attributes?.secondaryColor;
+  };
 }

packages/webapp/src/containers/PaymentPortal/drawers/PaymentInvoicePreviewDrawer/PaymentInvoicePreviewContent.tsx

@@ -23,6 +23,8 @@ export function PaymentInvoicePreviewContent() {
             termsConditions={sharableLinkMeta?.termsConditions}
             statement={sharableLinkMeta?.invoiceMessage}
             companyName={sharableLinkMeta?.companyName}
+            primaryColor={sharableLinkMeta?.brandingTemplate?.primaryColor}
+            secondaryColor={sharableLinkMeta?.brandingTemplate?.secondaryColor}
             lines={sharableLinkMeta?.entries?.map((entry) => ({
               item: entry.itemName,
               description: entry.description,

packages/webapp/src/hooks/query/pdf-templates.ts

@@ -99,7 +99,7 @@ export const useEditPdfTemplate = (
   >(
     ({ templateId, values }) =>
       apiRequest
-        .post(`/pdf-templates/${templateId}`, transfromToSnakeCase(values))
+        .put(`/pdf-templates/${templateId}`, transfromToSnakeCase(values))
         .then((res) => res.data),
     {
       onSuccess: () => {

packages/webapp/src/style/App.scss

@@ -52,7 +52,6 @@ body {
 .App {
   min-width: 1100px;
   min-height: 100vh;
-  background-color: var(--color-app-background);
 }
 // =======
 

packages/webapp/src/style/_variables.scss

@@ -61,7 +61,6 @@ $ns: bp4;
   --color-ui-menu-select-item-active-background: var(--color-primary);
 
   --color-app-body: #fff;
-  --color-app-background: #fff;
 
   // Splash screen.
   --color-splash-screen-background: #fff;
@@ -359,7 +358,6 @@ body.bp4-dark  {
 
   // App
   --color-app-body: var(--color-dark-gray1);
-  --color-app-background: var(--color-dark-gray1);
 
   // Splash screen.
   --color-splash-screen-background: #fff;

packages/webapp/src/style/objects/buttons.scss

@@ -1,9 +1,9 @@
-
-
 .bp4-button {
   --color-button-color: #555;
-  --color-button-color: var(--color-light-gray3);
 
+  .bp4-dark & {
+    --color-button-color: var(--color-light-gray3);
+  }
   min-width: 32px;
   min-height: 32px;
   padding-left: 12px;