From 40ac91d29451bce7f5b6241059feee9f6d8aba0d Mon Sep 17 00:00:00 2001
From: Mykola Zahorulko <mykola.zahorulko@brandsmanago.pl>
Date: Wed, 20 Aug 2025 15:23:37 +0200
Subject: [PATCH] Add container padding feature

---
 container-padding/README.md                   | 21 +++++++++++++
 container-padding/container-padding.less      | 30 +++++++++++++++++++
 .../device-view-handler.js                    |  0
 3 files changed, 51 insertions(+)
 create mode 100644 container-padding/README.md
 create mode 100644 container-padding/container-padding.less
 rename device-view-handler.js => device-view-handler/device-view-handler.js (100%)

diff --git a/container-padding/README.md b/container-padding/README.md
new file mode 100644
index 0000000..1c881bd
--- /dev/null
+++ b/container-padding/README.md
@@ -0,0 +1,21 @@
+# Responsible paddings #
+
+### How to use  ###
+Put the code in design system component, and use the mixin. Do not forget to delete any other padding except of the body element. Of course write the right container width.
+Other paddings might be in the following components:
+1. Design system
+2. GRID
+3. Javascript + CSS + TXT
+4. Układ topu
+5. Główne skrypty strefy banerowej
+
+
+Created by • **[IdoMods](https://idomods.pl/)** • 2025
+
+
+
+Design system
+GRID
+Javascript + CSS + TXT
+Układ topu
+Główne skrypty strefy banerowej
\ No newline at end of file
diff --git a/container-padding/container-padding.less b/container-padding/container-padding.less
new file mode 100644
index 0000000..6886ad9
--- /dev/null
+++ b/container-padding/container-padding.less
@@ -0,0 +1,30 @@
+// Remove any other paddings inside other containers such content, layout on every page, so there is padding only on BODY
+.responsive-padding() {
+  padding-left: 96px;
+  padding-right: 96px;
+
+  @media (max-width: 1440px) {
+    padding-left: 64px;
+    padding-right: 64px;
+  }
+
+  @media (max-width: 1280px) {
+    padding-left: 48px;
+    padding-right: 48px;
+  }
+
+  @media (max-width: 978px) {
+    padding-left: 32px;
+    padding-right: 32px;
+  }
+
+  @media (max-width: 756px) {
+    padding-left: 24px;
+    padding-right: 24px;
+  }
+
+  @media (max-width: 480px) {
+    padding-left: 16px;
+    padding-right: 16px;
+  }
+}
\ No newline at end of file
diff --git a/device-view-handler.js b/device-view-handler/device-view-handler.js
similarity index 100%
rename from device-view-handler.js
rename to device-view-handler/device-view-handler.js