Merge pull request #5 from fisher60/feature/minor-changes-for-quality…

…-of-life Feature/minor changes for quality of life
YakshaLang · Dec 21, 2023 · 7da1f5d · 7da1f5d
2 parents d188a40 + 4357fca
commit 7da1f5d
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 27 deletions.
diff --git a/src/components/Footer.astro b/src/components/Footer.astro
@@ -3,38 +3,38 @@
         <img src="/imgs/yaksha_logo.png" class="w-24 mt-8" />
         <div>
             <p class="font-bold">Yaksha - The Programming Language</p>
-            <p>Copyright (C) 2023 Bhathiya Perera</p>
-            <p>Website designed by <a class="link text-blue-500" href="https://abandontech.cloud">AbandonTech</a></p>
+            <p>&#169 2023 YakshaLang</p>
+            <p>Website designed by <a class="link text-blue-500" href="https://abandontech.cloud" target="_blank" rel="noreferrer">AbandonTech</a></p>
         </div>
     </aside>
     <nav class="grid grid-flow-col gap-4 pb-4">
         <!-- Github -->
-        <a href="https://github.com/YakshaLang" class="text-primary-500 hover:text-secondary visited:text-green-500">
+        <a href="https://github.com/YakshaLang" class="text-primary-500 hover:text-secondary visited:text-green-500" target="_blank" rel="noreferrer">
             <svg class="w-8 h-8" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"/></svg>
         </a>
         <!-- Reddit -->
-        <a href="https://www.reddit.com/r/yakshalang/" class="text-primary-500 hover:text-secondary visited:text-green-500">
+        <a href="https://www.reddit.com/r/yakshalang/" class="text-primary-500 hover:text-secondary visited:text-green-500" target="_blank" rel="noreferrer">
             <svg class="w-8 h-8" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M14.238 15.348c.085.084.085.221 0 .306-.465.462-1.194.687-2.231.687l-.008-.002-.008.002c-1.036 0-1.766-.225-2.231-.688-.085-.084-.085-.221 0-.305.084-.084.222-.084.307 0 .379.377 1.008.561 1.924.561l.008.002.008-.002c.915 0 1.544-.184 1.924-.561.085-.084.223-.084.307 0zm-3.44-2.418c0-.507-.414-.919-.922-.919-.509 0-.923.412-.923.919 0 .506.414.918.923.918.508.001.922-.411.922-.918zm13.202-.93c0 6.627-5.373 12-12 12s-12-5.373-12-12 5.373-12 12-12 12 5.373 12 12zm-5-.129c0-.851-.695-1.543-1.55-1.543-.417 0-.795.167-1.074.435-1.056-.695-2.485-1.137-4.066-1.194l.865-2.724 2.343.549-.003.034c0 .696.569 1.262 1.268 1.262.699 0 1.267-.566 1.267-1.262s-.568-1.262-1.267-1.262c-.537 0-.994.335-1.179.804l-2.525-.592c-.11-.027-.223.037-.257.145l-.965 3.038c-1.656.02-3.155.466-4.258 1.181-.277-.255-.644-.415-1.05-.415-.854.001-1.549.693-1.549 1.544 0 .566.311 1.056.768 1.325-.03.164-.05.331-.05.5 0 2.281 2.805 4.137 6.253 4.137s6.253-1.856 6.253-4.137c0-.16-.017-.317-.044-.472.486-.261.82-.766.82-1.353zm-4.872.141c-.509 0-.922.412-.922.919 0 .506.414.918.922.918s.922-.412.922-.918c0-.507-.413-.919-.922-.919z"/></svg>
         </a>
         <!-- Discord -->
-        <a href="https://discord.gg/SUsJu4PnwU" class="text-primary-500 hover:text-secondary visited:text-green-500">
+        <a href="https://discord.gg/SUsJu4PnwU" class="text-primary-500 hover:text-secondary visited:text-green-500" target="_blank" rel="noreferrer">
             <svg class="w-8 h-8" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 127.14 96.36"><path d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z"/></svg>
         </a>
         <!-- Twitch -->
-        <a href="https://www.twitch.tv/jadoggx86" class="text-primary-500 hover:text-secondary visited:text-green-500">
+        <a href="https://www.twitch.tv/jadoggx86" class="text-primary-500 hover:text-secondary visited:text-green-500" target="_blank" rel="noreferrer">
             <svg class="w-8 h-8" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10.224 17.806l1.776-1.776h3.343l2.09-2.09v-6.686h-10.03v8.776h2.821v1.776zm3.866-8.149h1.254v3.653h-1.254v-3.653zm-3.344 0h1.254v3.653h-1.254v-3.653zm1.254-9.657c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm6.687 14.567l-3.657 3.657h-2.716l-1.777 1.776h-1.88v-1.776h-3.344v-9.821l.941-2.403h12.433v8.567z"/></svg>
         </a>
         <!-- RSS -->
         <a href="/rss.xml" class="text-primary-500 hover:text-secondary visited:text-green-500">
-            <svg class="w-8 h-8" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg" 
+            <svg class="w-8 h-8" fill="currentColor" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"
                 viewBox="-143 145 512 512" >
             <path d="M113,145c-141.4,0-256,114.6-256,256s114.6,256,256,256s256-114.6,256-256S254.4,145,113,145z M43.1,518.7
                 c-6.2,6.2-14.7,9.9-24.1,9.9c-9.4,0-17.8-3.8-24-9.9c-6.2-6.2-10-14.6-10-23.9c0-9.4,3.8-17.8,10-24s14.6-10,24-10
                 c9.4,0,17.9,3.8,24,10c6.2,6.2,10,14.6,10,24C53,504.2,49.2,512.6,43.1,518.7z M104.8,529c-0.1-32.1-12.5-62.3-35.1-84.9
                 c-22.6-22.6-52.8-35.2-84.7-35.2V360c46.6,0,88.7,19,119.3,49.6c30.6,30.6,49.5,72.8,49.6,119.4H104.8z M192,529
                 c-0.1-114.2-92.8-207.1-206.9-207.1V273c70.6,0,134.5,28.7,180.8,75.1c46.3,46.4,75,110.3,75.1,180.9H192z"/>
             </svg>
-                        
+
         </a>
     </nav>
 </footer>
diff --git a/src/components/NavBar.astro b/src/components/NavBar.astro
@@ -11,7 +11,7 @@ const activePageStyling = (path: string) => path == currentPath ? "text-secondar
 ---
 
 <nav class="sticky top-0 bg-base-100 z-40 w-full">
-    <div class="max-w-screen-xl flex flex-wrap items-center justify-between mx-auto p-4">
+    <div class="max-w-screen-xl h-24 flex flex-wrap items-center justify-between mx-auto p-4">
         <img src="/imgs/yk-banner1.png" class="h-12" alt="Yaksha Banner" />
 
         <!-- For small devices use consise burger menu, basically just phones -->
@@ -27,7 +27,7 @@ const activePageStyling = (path: string) => path == currentPath ? "text-secondar
                 <li><a href="/docs">Docs</a></li>
                 <li><a href="/tutorials">Tutorials</a></li>
                 <li><a href="/demos">Demos</a></li>
-                <li><a href="https://yaksha.pages.dev/">Playground</a></li>
+                <li><a href="https://yaksha.pages.dev/" target="_blank" rel="noreferrer">Playground</a></li>
                 <li><a href="/yama">YAMA</a></li>
                 <li><a href="/blog">Blog</a></li>
             </ul>
@@ -42,7 +42,7 @@ const activePageStyling = (path: string) => path == currentPath ? "text-secondar
                 <div class="divider divider-horizontal divider-primary" />
                 <a href="/tutorials" class={`${activePageStyling("tutorials")} hover:text-primary`}>Tutorials</a>
                 <a href="/demos" class={`${activePageStyling("demos")} hover:text-primary`}>Demos</a>
-                <a href="https://yaksha.pages.dev/" class={`${activePageStyling("playground")} hover:text-primary`}>Playground</a>
+                <a href="https://yaksha.pages.dev/" class={`${activePageStyling("playground")} hover:text-primary`} target="_blank" rel="noreferrer">Playground</a>
                 <div class="divider divider-horizontal divider-primary" />
                 <a href="/blog" class={`${activePageStyling("blog")} hover:text-primary`}>Blog</a>
                 <a href="/yama" class={`${activePageStyling("yama")} hover:text-primary`}>YAMA</a>

diff --git a/src/layouts/LibsLayout.astro b/src/layouts/LibsLayout.astro
@@ -22,25 +22,27 @@ const sortedHeadings = headings.reduce((acc, heading) => {
 
 <Layout title="Yaksha | Lib">
 
-  <div class="flex bg-base-300">
-    <div class="w-fit bg-base-200 md:w-96">
-      <ul class="sticky top-20 menu">
-          {sortedHeadings.map(heading =>
-          <li>
-            <details open>
-              <summary class="hover:text-primary"><a href={`#${heading.slug}`}>{heading.text}</a></summary>
-              <ul>
-                {heading.children.map(child => 
-                  <li class="hover:text-primary"><a href={`#${child.slug}`}>{child.text}</a></li>
-                )}
-              </ul>
-            </details>
-          </li>)}  
+  <div class="flex bg-base-300 w-full">
+    <div class="hidden md:block bg-base-200 md:w-96">
+      <ul class="sticky max-h-screen flex-nowrap top-24 menu">
+        <div class="max-h-full overflow-y-auto mb-24">
+            {sortedHeadings.map(heading =>
+            <li>
+              <details open>
+                <summary class="hover:text-primary"><a href={`#${heading.slug}`}>{heading.text}</a></summary>
+                <ul>
+                  {heading.children.map(child => 
+                    <li class="hover:text-primary"><a href={`#${child.slug}`}>{child.text}</a></li>
+                  )}
+                </ul>
+              </details>
+            </li>)}
+        </div>
       </ul>
     </div>
 
-    <div class="relative mx-auto prose py-8 px-8 max-w-fit md:max-w-6xl dark:prose-invert prose-headings:scroll-mt-36 md:prose-headings:scroll-mt-96">
-        <slot/>
+    <div class="mx-auto prose prose-sm md:prose-base py-4 md:py-8 px-4 md:px-8 md:max-w-6xl dark:prose-invert prose-headings:scroll-mt-36 md:prose-headings:scroll-mt-96">
+        <slot />
     </div>
   </div>