Merge pull request #700 from bigcapitalhq/fix-company-logo-dimenstion…

…-pdf-template fix: Set max width/height to company logo of pdf templates
bigcapitalhq · Oct 8, 2024 · cf78255 · cf78255
2 parents 0a5e40a + f9aa6ab
commit cf78255
Show file tree

Hide file tree

Showing 7 changed files with 32 additions and 29 deletions.
diff --git a/packages/server/resources/views/modules/credit-note-standard.pug b/packages/server/resources/views/modules/credit-note-standard.pug
@@ -30,17 +30,17 @@ block head
       flex: 1 1 0%;
     }
     .#{prefix}-big-title {
-      font-size: 60px;
+      font-size: 30px;
       margin: 0;
       line-height: 1;
       font-weight: 500;
       color: #333;
     }
     .#{prefix}-logo-wrap img {
-      height: auto;
-      width: auto;
-      max-width: 400px;
-      max-height: 160px;
+      width: 100%;
+      height: 100%;
+      max-width: 260px;
+      max-height: 100px;
     }
     .#{prefix}-terms-list {
       display: flex;

diff --git a/packages/server/resources/views/modules/estimate-regular.pug b/packages/server/resources/views/modules/estimate-regular.pug
@@ -30,17 +30,17 @@ block head
       flex: 1 1 0%;
     }
     .#{prefix}-big-title {
-      font-size: 60px;
+      font-size: 30px;
       margin: 0;
       line-height: 1;
       font-weight: 500;
       color: #333;
     }
     .#{prefix}-logo-wrap img {
-      height: auto;
-      width: auto;
-      max-width: 400px;
-      max-height: 160px;
+      width: 100%;
+      height: 100%;
+      max-width: 260px;
+      max-height: 100px;
     }
     .#{prefix}-terms {
       display: flex;

diff --git a/packages/server/resources/views/modules/invoice-standard.pug b/packages/server/resources/views/modules/invoice-standard.pug
@@ -30,17 +30,17 @@ block head
       flex: 1 1 0%;
     }
     .#{prefix}-big-title {
-      font-size: 60px;
+      font-size: 30px;
       margin: 0;
       line-height: 1;
       font-weight: 500;
       color: #333;
     }
     .#{prefix}-logo-wrap img {
-      height: auto;
-      width: auto;
-      max-width: 400px;
-      max-height: 160px;
+      width: 100%;
+      height: 100%;
+      max-width: 260px;
+      max-height: 100px;
     }
     .#{prefix}-details {
       display: flex;

diff --git a/packages/server/resources/views/modules/payment-receive-standard.pug b/packages/server/resources/views/modules/payment-receive-standard.pug
@@ -31,17 +31,17 @@ block head
       flex: 1 1 0%;
     }
     .#{prefix}-big-title{ 
-      font-size: 60px;
+      font-size: 30px;
       margin: 0;
       line-height: 1;
       font-weight: 500;
       color: #333;
     }
     .#{prefix}-logo-wrap img {
-      height: auto;
-      width: auto;
-      max-width: 400px;
-      max-height: 160px;
+      width: 100%;
+      height: 100%;
+      max-width: 260px;
+      max-height: 100px;
     }
     .#{prefix}-terms-list{ 
       display: flex;

diff --git a/packages/server/resources/views/modules/receipt-regular.pug b/packages/server/resources/views/modules/receipt-regular.pug
@@ -28,13 +28,13 @@ block head
       flex: 1 1 0%;
     }
     .#{prefix}-logo-wrap img {
-      height: auto;
-      width: auto;
-      max-width: 400px;
-      max-height: 160px;
+      width: 100%;
+      height: 100%;
+      max-width: 260px;
+      max-height: 100px;
     }
     .#{prefix}-big-title {
-      font-size: 60px;
+      font-size: 30px;
       margin: 0;
       line-height: 1;
       font-weight: 500;

diff --git a/...es/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoicePaperTemplate.module.scss b/...es/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoicePaperTemplate.module.scss
@@ -4,15 +4,15 @@
   background-color: #fff;
   color: #111;
   box-shadow: inset 0 4px 0px 0 var(--invoice-primary-color), 0 10px 15px rgba(0, 0, 0, 0.05);
-  padding: 24px 30px;
+  padding: 30px 30px;
   font-size: 12px;
   position: relative;
   margin: 0 auto;
   width: 794px;
   height: 1123px;
 }
 .bigTitle{
-  font-size: 60px;
+  font-size: 30px;
   margin: 0;
   line-height: 1;
   font-weight: 500;
@@ -105,7 +105,10 @@
   overflow: hidden;
 
   img{
-    max-width: 100%;
+    width: 100%;
+    height: 100%;
+    max-width: 260px;
+    max-height: 100px;
   }
 }
 .logoImg {

diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/PaperTemplate.tsx b/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/PaperTemplate.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import clsx from 'classnames';
 import { get } from 'lodash';
-import { Box, Group, GroupProps, Stack } from '@/components';
+import { Box, Group, GroupProps } from '@/components';
 import styles from './InvoicePaperTemplate.module.scss';
 
 export interface PaperTemplateProps {