Fix/change width related css for md content (#209)

Monil-KTX · web-flow · commit 587a2805f948 · 2025-10-10T15:18:15.000+05:30
* fix: adjust max-width for responsive design in CSS files

* fix: update max-width for responsive design in navbar and CSS
diff --git a/docs/stylesheets/extra.css b/docs/stylesheets/extra.css
@@ -1501,6 +1501,6 @@ nav.md-grid {
 /* 2xl (≥1536px) */
 @media (min-width: 1536px) {
   .md-main__inner.md-grid {
-    max-width: 1736px;
+    max-width: 70rem;
   }
 }
diff --git a/overrides/css/output.css b/overrides/css/output.css
@@ -457,6 +457,7 @@ legend {
   padding: 0;
 }
 
+ol,
 ul,
 menu {
   list-style: none;
@@ -837,6 +838,10 @@ video {
   width: 100%;
 }
 
+.tw-max-w-\[70rem\] {
+  max-width: 70rem;
+}
+
 .tw-flex-1 {
   flex: 1 1 0%;
 }
diff --git a/overrides/partials/navbar.html b/overrides/partials/navbar.html
@@ -29,7 +29,7 @@
 <!-- Header -->
 <header class="{{ class }}" data-md-component="header">
   <nav
-    class="tw-container tw-mx-auto tw-px-4 sm:tw-px-6 lg:tw-px-8 xl:tw-px-10 md-header__inner tw-items-center lg:tw-justify-between"
+    class="tw-container tw-mx-auto tw-px-4 sm:tw-px-6 lg:tw-px-8 xl:tw-px-10 md-header__inner tw-items-center lg:tw-justify-between tw-max-w-[70rem]"
     aria-label="{{ lang.t('header') }}"
   >
     <!-- Left section (Logo + Docs Title) -->

Original file line number	Diff line number	Diff line change
`@@ -29,7 +29,7 @@`
`29`	`29`	`<!-- Header -->`
`30`	`30`	`<header class="{{ class }}" data-md-component="header">`
`31`	`31`	`<nav`
`32`		`- class="tw-container tw-mx-auto tw-px-4 sm:tw-px-6 lg:tw-px-8 xl:tw-px-10 md-header__inner tw-items-center lg:tw-justify-between"`
	`32`	`+ class="tw-container tw-mx-auto tw-px-4 sm:tw-px-6 lg:tw-px-8 xl:tw-px-10 md-header__inner tw-items-center lg:tw-justify-between tw-max-w-[70rem]"`
`33`	`33`	`aria-label="{{ lang.t('header') }}"`
`34`	`34`	`>`
`35`	`35`	`<!-- Left section (Logo + Docs Title) -->`