From 51d7700c8c8e81706e0d0313d853b8e989f8a4da Mon Sep 17 00:00:00 2001
From: Ian Johnson <ian@ianjohnson.dev>
Date: Mon, 4 Sep 2023 00:52:37 -0400
Subject: [PATCH] Autodoc: tweak page layout

Closes #17011
Closes #17012

This commit allows the logo to scale more freely to fit its container,
and removes some extra margins so that the content scroll bar is flush
with the right side of the viewport.
---
 lib/docs/index.html | 22 +++++++---------------
 1 file changed, 7 insertions(+), 15 deletions(-)

diff --git a/lib/docs/index.html b/lib/docs/index.html
index b6f4e9c1df..bd88ed925c 100644
--- a/lib/docs/index.html
+++ b/lib/docs/index.html
@@ -70,7 +70,6 @@
         display: flex;
         flex-direction: column;
         justify-content: center;
-        margin: 0 1rem;
 
         height: 100%;
         overflow: hidden;
@@ -91,14 +90,12 @@
       }
 
       .flex-left {
-        width: 12rem;
-        max-width: 15vw;
-        min-width: 9.5rem;
         overflow: auto;
         -webkit-overflow-scrolling: touch;
         overflow-wrap: break-word;
         flex-shrink: 0;
         flex-grow: 0;
+        margin-right: 0.5rem;
 
         z-index: 300;
       }
@@ -135,13 +132,11 @@
       }
 
       .logo {
-        width: 168px;
-        margin-right: 1rem;
+        margin: 0.5rem;
       }
 
       .logo > svg {
         display: block;
-        overflow: visible;
       }
 
       ul.guides-api-switch {
@@ -276,7 +271,7 @@
       .column {
         flex-basis: 0;
         flex-grow: 1;
-        min-width: 24rem;
+        min-width: min(24rem, 90%);
       }
 
       
@@ -750,9 +745,6 @@
           padding-left: 1.4rem;
           padding-right: 1.4rem;
         }
-        .logo {
-          max-width: 6.5rem;
-        }
         .flex-main > .flex-filler {
           display: none;
         }
@@ -951,7 +943,7 @@
       <a href="https://github.com/ziglang/zig/wiki/How-to-read-the-standard-library-source-code">Learn more about stdlib source code</a>.
     </div>
     <div id="main" class="flex-main">
-      <div class="flex-horizontal" style="justify-content: center;padding:0.5rem;">
+      <div class="flex-horizontal" style="justify-content: center; padding: 0 0.5rem;">
         <div class="flex-left">
           <div class="logo">
             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 140">
@@ -1021,7 +1013,7 @@
         </div>
         </div>
       </div>
-      <div style="height:100%; overflow:hidden; margin: 0 1rem;">
+      <div style="height:100%; overflow:hidden;">
         <div id="sectSearchResults" class="docs hidden">
           <details id="searchHelp">
             <summary id="searchHelpSummary" class="normal">How to search effectively</summary>
@@ -1084,7 +1076,7 @@
           </ul>
           <p>Press <kbd>?</kbd> to see keyboard shortcuts and <kbd>Esc</kbd> to return.</p>
         </div>
-        <div id="guides" class="flex-horizontal hidden" style="align-items:flex-start;height:100%;oveflow:hidden;">
+        <div id="guides" class="flex-horizontal hidden" style="align-items:flex-start;height:100%;overflow:hidden;">
           <div id="guidesMenu" class="sidebar">
             <h2 id="guidesMenuTitle">Table of Contents</h2>
             <div id="guideTocListEmpty" style="margin:0 1rem;"><i>No content to display.</i></div>
@@ -1092,7 +1084,7 @@
           </div>
           <div id="activeGuide" class="hidden"></div>
         </div> 
-        <div id="docs" class="hidden" style="align-items:flex-start;height:100%;oveflow:hidden;">
+        <div id="docs" class="hidden" style="align-items:flex-start;height:100%;overflow:hidden;">
           <section id="docs-scroll" class="docs">
             <p id="status">Loading...</p>
             <div id="fnProto" class="hidden">