fixes

Author: aspeddro

pages/docs/manual/v10.0.0/api.mdx

@@ -1,4 +1,4 @@
-# Overview
+# Introduction
 
 ReScript ships 3 modules in its standard library.
 

pages/docs/manual/v11.0.0/api.mdx

@@ -1,4 +1,4 @@
-# Overview
+# Introduction
 
 ## ReScript Core
 

pages/docs/manual/v12.0.0/api.mdx

@@ -1,4 +1,4 @@
-# Overview
+# Introduction
 
 ## Stdlib
 

pages/docs/manual/v8.0.0/api.mdx

@@ -1,4 +1,4 @@
-# Overview
+# Introduction
 
 We ship 3 modules in our standard library.
 

pages/docs/manual/v9.0.0/api.mdx

@@ -1,4 +1,4 @@
-# Overview
+# Introduction
 
 ReScript ships 3 modules in its standard library.
 

src/Blog.res

@@ -142,7 +142,7 @@ module FeatureCard = {
     }
     <section
       className="flex sm:px-4 md:px-8 lg:px-0 flex-col justify-end lg:flex-row sm:items-center h-full">
-      <div className="w-full h-full sm:self-start md:self-auto max-h-[25.4375]rem">
+      <div className="w-full h-full sm:self-start md:self-auto max-h-[25.4375rem]">
         <Link href={`/blog/${slug}`} className="relative block pt-2/3">
           {switch badge {
           | Some(badge) =>

src/components/CodeExample.res

@@ -198,15 +198,15 @@ module Toggle = {
         }
 
         let borderColor = if selected === i {
-          "border-[#696B7D #EDF0F2]"
+          "border-t-[#696b7d]"
         } else {
-          "border[transparent]"
+          "border-t-[transparent]"
         }
 
         <span
           key
           className={paddingX ++
-          (`${borderColor} flex-none px-5 inline-block p-1 first:rounded-tl ` ++
+          (` ${borderColor} flex-none px-5 inline-block p-1 first:rounded-tl ` ++
           activeClass)}
           onClick>
           {React.string(label)}
@@ -257,7 +257,7 @@ module Toggle = {
       <div className="relative pt-6 w-full rounded-none text-gray-80">
         //text within code-box
         <div
-          className="absolute flex w-full font-sans bg-transparent text-14 text-gray-40 mt-[-26px] ">
+          className="absolute flex w-full font-sans bg-transparent text-14 text-gray-40 mt-[-26px] overflow-x-auto">
           <div className="flex xs:ml-0"> {React.array(tabElements)} </div>
           <div className="flex-1 w-full bg-gray-20 border-b rounded-tr border-gray-20 items-center">
             buttonDiv

src/layouts/ApiOverviewLayout.res

@@ -2,9 +2,9 @@ module Sidebar = SidebarLayout.Sidebar
 
 let makeCategories: string => array<Sidebar.Category.t> = version => [
   {
-    name: "",
+    name: "Overview",
     items: [
-      {name: "Overview", href: `/docs/manual/${version}/api`},
+      {name: "Introduction", href: `/docs/manual/${version}/api`},
       if version >= "v12.0.0" {
         {name: "Stdlib", href: `/docs/manual/${version}/api/stdlib`}
       } else {

src/layouts/LandingPageLayout.res

@@ -326,14 +326,7 @@ module MainUSP = {
           //image (right)
           <div className="relative mt-10 lg:mt-0">
             <div
-              className="relative w-full z-2 bg-gray-90 rounded-lg flex md:mt-0 items-center justify-center rounded-lg max-w-[35rem]"
-              // TODO(aspeddro)
-              // style={ReactDOM.Style.make(
-              //   ~maxWidth="35rem",
-              //   ~boxShadow="0px 4px 55px 0px rgba(230,72,79,0.10)",
-              //   (),
-              // )}
-            >
+              className="relative w-full z-2 bg-gray-90 flex md:mt-0 items-center justify-center rounded-lg max-w-[35rem] shadow-[0px_4px_55px_0px_rgba(230,72,79,0.10)]">
               media
             </div>
             <img

src/layouts/SidebarLayout.res

@@ -138,10 +138,10 @@ module Sidebar = {
         id="sidebar"
         className={(
           isOpen ? "fixed w-full left-0 h-full z-20 min-w-320" : "hidden "
-        ) ++ " md:block md:w-48 md:-ml-4 lg:w-1/5 md:h-auto md:relative overflow-y-visible bg-white mt-28 md:mt-0"}>
+        ) ++ " md:block md:w-48 md:-ml-4 lg:w-1/5 h-auto md:relative overflow-y-visible bg-white mt-28 md:mt-0"}>
         <aside
           id="sidebar-content"
-          className="relative top-0 px-4 w-full block md:top-[7rem] md:pt-10 md:sticky border-r border-gray-20 overflow-y-auto pb-24 h-[calc(100vh-7rem)]">
+          className="relative top-0 px-4 w-full block md:pt-10 md:top-[7rem] md:sticky border-r border-gray-20 overflow-y-auto pb-24 h-auto max-h-[calc(100vh-7rem)]">
           <button
             onClick={evt => {
               ReactEvent.Mouse.preventDefault(evt)