From ef313c4114117624efb5ddeb9aa6ddd47542e5ec Mon Sep 17 00:00:00 2001
From: Francesco Sansalvadore <f.sansalvadore@gmail.com>
Date: Thu, 13 Apr 2023 10:20:41 +0200
Subject: [PATCH] feat: style for wide mdx images

---
 apps/www/styles/index.css | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/apps/www/styles/index.css b/apps/www/styles/index.css
index 711070a73fb..0b9958c6353 100644
--- a/apps/www/styles/index.css
+++ b/apps/www/styles/index.css
@@ -251,9 +251,34 @@ table {
 *
 */
 .next-image--dynamic-fill {
+  display: block;
   width: 100%;
+  border-radius: 6px;
+  overflow: hidden;
   grid-column: 1 / -1;
 }
+.next-image--dynamic-fill.wide {
+  @apply my-0 max-w-none -mx-8 w-[calc(100%_+_4rem)];
+}
+@media (min-width: 560px) {
+  .next-image--dynamic-fill.wide {
+    width: calc(100% + 6rem);
+    margin: 0 -3rem;
+  }
+}
+@media (min-width: 1280px) {
+  .next-image--dynamic-fill.wide {
+    width: calc(100% + 10rem);
+    margin: 0 -5rem;
+  }
+}
+@media (min-width: 1535px) {
+  .next-image--dynamic-fill.wide {
+    width: calc(100% + 14rem);
+    margin: 0 -7rem;
+  }
+}
+
 .next-image--dynamic-fill > span {
   position: relative !important;
 }