docs: second round of polishing (#8724)

* docs: second round of polishing

* fix overflowing width

www/packages/docs-ui/src/layouts/main-content.tsx

@@ -33,10 +33,10 @@ export const MainContentLayout = ({
   return (
     <div
       className={clsx(
-        "relative",
+        "relative max-w-full",
         "h-full flex-1",
         "flex flex-col",
-        "gap-docs_0.5 lg:pt-docs_0.5 lg:mr-docs_0.25",
+        "gap-docs_0.5 lg:pt-docs_0.25 lg:mr-docs_0.25",
         !desktopSidebarOpen && "lg:ml-docs_0.25",
         mainWrapperClasses
       )}

www/packages/docs-ui/src/layouts/tight.tsx

@@ -17,7 +17,8 @@ export const TightLayout = ({
           "w-full h-fit",
           "max-w-inner-content-xs sm:max-w-inner-content-sm md:max-w-inner-content-md",
           "lg:max-w-inner-content-lg xl:max-w-inner-content-xl xxl:max-w-inner-content-xxl",
-          "xxxl:max-w-inner-content-xxxl"
+          "xxxl:max-w-inner-content-xxxl",
+          "px-docs_1 md:px-docs_4 lg:px-0"
         )}
       >
         {children}