From 0c0e0f2377829b4e091f8347e722dc315528b4ea Mon Sep 17 00:00:00 2001
From: Nikita Gorin <36075690+NikitaCG@users.noreply.github.com>
Date: Fri, 20 Oct 2023 18:43:45 +0300
Subject: [PATCH] feat: sync paddings values with page-constructor indents
 values (#133)

---
 src/blocks/Layout/Layout.tsx       |  4 ++--
 src/components/Wrapper/Wrapper.tsx |  2 +-
 src/constants.ts                   |  2 +-
 src/models/paddings.ts             |  2 +-
 styles/mixins.scss                 | 16 ++++++++++++----
 test-utils/constants.ts            |  2 +-
 6 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/src/blocks/Layout/Layout.tsx b/src/blocks/Layout/Layout.tsx
index e699ee8e..67b1215a 100644
--- a/src/blocks/Layout/Layout.tsx
+++ b/src/blocks/Layout/Layout.tsx
@@ -36,8 +36,8 @@ export const Layout = ({
     fullWidth,
     mobileOrder,
     children,
-    paddingTop = 'xs',
-    paddingBottom = 'xs',
+    paddingTop = '0',
+    paddingBottom = '0',
 }: PropsWithChildren<LayoutProps>) => {
     const layout: LayoutType = useMemo(() => {
         const layoutConfig: LayoutType = {
diff --git a/src/components/Wrapper/Wrapper.tsx b/src/components/Wrapper/Wrapper.tsx
index 4aef19f6..1102c411 100644
--- a/src/components/Wrapper/Wrapper.tsx
+++ b/src/components/Wrapper/Wrapper.tsx
@@ -24,7 +24,7 @@ export const Wrapper: React.FunctionComponent<WrapperProps> = ({
     <section
         className={b(
             {
-                ['padding-top']: paddings?.top || 'xs',
+                ['padding-top']: paddings?.top || '0',
                 ['padding-bottom']: paddings?.bottom || 'l',
                 ['padding-left']: paddings?.left || '',
                 ['padding-right']: paddings?.right || '',
diff --git a/src/constants.ts b/src/constants.ts
index 3cc377c6..e2a2a2d4 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -33,5 +33,5 @@ export enum BlogMetrikaGoalIds {
 
 export const DEFAULT_PADDINGS: Paddings = {
     [PaddingsDirections.bottom]: 'l',
-    [PaddingsDirections.top]: 'xs',
+    [PaddingsDirections.top]: '0',
 };
diff --git a/src/models/paddings.ts b/src/models/paddings.ts
index f94c1f64..010dc3e1 100644
--- a/src/models/paddings.ts
+++ b/src/models/paddings.ts
@@ -5,7 +5,7 @@ export enum PaddingsDirections {
     right = 'right',
 }
 
-export type PaddingSize = 'xs' | 's' | 'm' | 'l' | 'xl';
+export type PaddingSize = '0' | 'xs' | 's' | 'm' | 'l' | 'xl';
 
 export type Paddings = {
     [key in PaddingsDirections]?: PaddingSize;
diff --git a/styles/mixins.scss b/styles/mixins.scss
index f6578f43..f3402cad 100644
--- a/styles/mixins.scss
+++ b/styles/mixins.scss
@@ -4,12 +4,16 @@
 
 @mixin paddings() {
     &_padding-top {
+        &_0 {
+            padding-top: 0;
+        }
+
         &_xs {
-            padding-top: 0px;
+            padding-top: $indentXS;
         }
 
         &_s {
-            padding-top: $indentXS;
+            padding-top: $indentSM;
         }
 
         &_m {
@@ -26,12 +30,16 @@
     }
 
     &_padding-bottom {
+        &_0 {
+            padding-bottom: 0;
+        }
+
         &_xs {
-            padding-bottom: 0px;
+            padding-bottom: $indentXS;
         }
 
         &_s {
-            padding-bottom: $indentXS;
+            padding-bottom: $indentSM;
         }
 
         &_m {
diff --git a/test-utils/constants.ts b/test-utils/constants.ts
index f4846ef2..2ebb2c30 100644
--- a/test-utils/constants.ts
+++ b/test-utils/constants.ts
@@ -1,5 +1,5 @@
 import {PaddingSize} from '../src/models/paddings';
 
-export const PADDING_SIZES: PaddingSize[] = ['xs', 's', 'm', 'l', 'xl'];
+export const PADDING_SIZES: PaddingSize[] = ['0', 'xs', 's', 'm', 'l', 'xl'];
 
 export const ERROR_INPUT_DATA_MESSAGE = 'There are errors in input test data';