From 394ffff6f448fc843b0d75d46c49494bbc16b9aa Mon Sep 17 00:00:00 2001
From: Charles de Dreuille <charles.dedreuille@gmail.com>
Date: Thu, 3 Apr 2025 14:44:19 +0100
Subject: [PATCH] Build CSS

Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>
---
 packages/canon/css/components.css | 14 +++++++++++++-
 packages/canon/css/container.css  | 14 +++++++++++++-
 packages/canon/css/styles.css     | 14 +++++++++++++-
 3 files changed, 39 insertions(+), 3 deletions(-)

diff --git a/packages/canon/css/components.css b/packages/canon/css/components.css
index bc473d2006..a4291f7823 100644
--- a/packages/canon/css/components.css
+++ b/packages/canon/css/components.css
@@ -103,11 +103,23 @@
 }
 
 .canon-Container {
-  max-width: 75rem;
+  max-width: min(120rem, 100%);
   margin: 0 auto;
   padding: 0 1rem;
 }
 
+@media (width >= 640px) {
+  .canon-Container {
+    padding: 0 2rem;
+  }
+}
+
+@media (width >= 1024px) {
+  .canon-Container {
+    padding: 0 3rem;
+  }
+}
+
 .canon-Icon {
   width: 1rem;
   height: 1rem;
diff --git a/packages/canon/css/container.css b/packages/canon/css/container.css
index d9fe861f3b..bcdd296ca2 100644
--- a/packages/canon/css/container.css
+++ b/packages/canon/css/container.css
@@ -1,5 +1,17 @@
 .canon-Container {
-  max-width: 75rem;
+  max-width: min(120rem, 100%);
   margin: 0 auto;
   padding: 0 1rem;
 }
+
+@media (width >= 640px) {
+  .canon-Container {
+    padding: 0 2rem;
+  }
+}
+
+@media (width >= 1024px) {
+  .canon-Container {
+    padding: 0 3rem;
+  }
+}
diff --git a/packages/canon/css/styles.css b/packages/canon/css/styles.css
index b5093e217c..bb56f7c309 100644
--- a/packages/canon/css/styles.css
+++ b/packages/canon/css/styles.css
@@ -9309,11 +9309,23 @@
 }
 
 .canon-Container {
-  max-width: 75rem;
+  max-width: min(120rem, 100%);
   margin: 0 auto;
   padding: 0 1rem;
 }
 
+@media (width >= 640px) {
+  .canon-Container {
+    padding: 0 2rem;
+  }
+}
+
+@media (width >= 1024px) {
+  .canon-Container {
+    padding: 0 3rem;
+  }
+}
+
 .canon-Icon {
   width: 1rem;
   height: 1rem;