improve introduction page of example/docs

4 files changed, 64 insertions, 58 deletions

diff --git a/examples/docs/public/theme.css b/examples/docs/public/theme.css
index 3089840dd..1bd29c2f6 100644
--- a/examples/docs/public/theme.css
+++ b/examples/docs/public/theme.css
@@ -58,7 +58,7 @@
   color-scheme: light;
   --theme-accent: hsla(var(--color-blue), 1);
   --theme-text-accent: hsla(var(--color-blue), 1);
-  --theme-accent-opacity: 0.1;
+  --theme-accent-opacity: 0.15;
   --theme-divider: hsla(var(--color-gray-95), 1);
   --theme-text: hsla(var(--color-gray-10), 1);
   --theme-text-light: hsla(var(--color-gray-40), 1);
@@ -85,9 +85,9 @@ body {
 
 :root.theme-dark {
   color-scheme: dark;
-  --theme-accent-opacity: 0.4;
-  --theme-accent: hsla(var(--color-orange), 1);
-  --theme-text-accent: hsla(var(--color-orange), 1);
+  --theme-accent-opacity: 0.15;
+  --theme-accent: hsla(var(--color-blue), 1);
+  --theme-text-accent: hsla(var(--color-blue), 1);
   --theme-divider: hsla(var(--color-gray-10), 1);
   --theme-text: hsla(var(--color-gray-90), 1);
   --theme-text-light: hsla(var(--color-gray-80), 1);
diff --git a/examples/docs/src/components/RightSidebar/MoreMenu.astro b/examples/docs/src/components/RightSidebar/MoreMenu.astro
index 6be2d86ee..c23da0c7b 100644
--- a/examples/docs/src/components/RightSidebar/MoreMenu.astro
+++ b/examples/docs/src/components/RightSidebar/MoreMenu.astro
@@ -1,6 +1,8 @@
 ---
 import ThemeToggleButton from './ThemeToggleButton.jsx';
+import * as CONFIG from '../../config.js';
 const {editHref} = Astro.props;
+const showMoreSection = (CONFIG.COMMUNITY_INVITE_URL || editHref);
 ---
 <style>
   .edit-on-github {
@@ -10,58 +12,56 @@ const {editHref} = Astro.props;
     font-size: 1rem;
   }
 </style>
-<h2 class="heading">More</h2>
+{showMoreSection && <h2 class="heading">More</h2>}
 <ul>
-  <li class={`header-link depth-2`}>
-    <a class="edit-on-github" href={editHref} target="_blank">
-      <svg
-        aria-hidden="true"
-        focusable="false"
-        data-prefix="fas"
-        data-icon="pen"
-        class="svg-inline--fa fa-pen fa-w-16"
-        role="img"
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 512 512"
-        height="1em"
-        width="1em"
-      >
-        <path
-          fill="currentColor"
-          d="M290.74 93.24l128.02 128.02-277.99 277.99-114.14 12.6C11.35 513.54-1.56 500.62.14 485.34l12.7-114.22 277.9-277.88zm207.2-19.06l-60.11-60.11c-18.75-18.75-49.16-18.75-67.91 0l-56.55 56.55 128.02 128.02 56.55-56.55c18.75-18.76 18.75-49.16 0-67.91z"
-        ></path>
-      </svg>
-      <span>Edit this page</span>
-    </a>
-  </li>
-  <li class={`header-link depth-2`}>
-    <a href="https://github.com/snowpackjs/astro/blob/main/CONTRIBUTING.md#translations" target="_blank">
-      <svg aria-hidden="true" focusable="false" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 88.6 77.3" height="1.24em" width="1.24em" style="margin: -2px;"> <path fill="currentColor" d="M61,24.6h7.9l18.7,51.6h-7.7l-5.4-15.5H54.3l-5.6,15.5h-7.2L61,24.6z M72.6,55l-8-22.8L56.3,55H72.6z" /> <path fill="currentColor" d="M53.6,60.6c-10-4-16-9-22-14c0,0,1.3,1.3,0,0c-6,5-20,13-20,13l-4-6c8-5,10-6,19-13c-2.1-1.9-12-13-13-19h8          c4,9,10,14,10,14c10-8,10-19,10-19h8c0,0-1,13-12,24l0,0c5,5,10,9,19,13L53.6,60.6z M1.6,16.6h56v-8h-23v-7h-9v7h-24V16.6z" /> </svg>
-      <span>Translate this page</span>
-    </a>
-  </li>
-  <li class={`header-link depth-2`}>
-    <a href="https://astro.build/chat" target="_blank">
-      <svg
-        aria-hidden="true"
-        focusable="false"
-        data-prefix="fas"
-        data-icon="comment-alt"
-        class="svg-inline--fa fa-comment-alt fa-w-16"
-        role="img"
-        xmlns="http://www.w3.org/2000/svg"
-        viewBox="0 0 512 512"
-        height="1em"
-        width="1em"
-      >
-        <path
-          fill="currentColor"
-          d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"
-        ></path>
-      </svg>
-      <span>Join our community</span>
-    </a>
-  </li>
+  {editHref &&
+    <li class={`header-link depth-2`}>
+      <a class="edit-on-github" href={editHref} target="_blank">
+        <svg
+          aria-hidden="true"
+          focusable="false"
+          data-prefix="fas"
+          data-icon="pen"
+          class="svg-inline--fa fa-pen fa-w-16"
+          role="img"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 512 512"
+          height="1em"
+          width="1em"
+        >
+          <path
+            fill="currentColor"
+            d="M290.74 93.24l128.02 128.02-277.99 277.99-114.14 12.6C11.35 513.54-1.56 500.62.14 485.34l12.7-114.22 277.9-277.88zm207.2-19.06l-60.11-60.11c-18.75-18.75-49.16-18.75-67.91 0l-56.55 56.55 128.02 128.02 56.55-56.55c18.75-18.76 18.75-49.16 0-67.91z"
+          ></path>
+        </svg>
+        <span>Edit this page</span>
+      </a>
+    </li>
+  }
+  {CONFIG.COMMUNITY_INVITE_URL && 
+    <li class={`header-link depth-2`}>
+      <a href="https://astro.build/chat" target="_blank">
+        <svg
+          aria-hidden="true"
+          focusable="false"
+          data-prefix="fas"
+          data-icon="comment-alt"
+          class="svg-inline--fa fa-comment-alt fa-w-16"
+          role="img"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 512 512"
+          height="1em"
+          width="1em"
+        >
+          <path
+            fill="currentColor"
+            d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"
+          ></path>
+        </svg>
+        <span>Join our community</span>
+      </a>
+    </li>
+  }
 </ul>
 <div style="margin: 2rem 0; text-align: center;">
   <ThemeToggleButton client:visible />
diff --git a/examples/docs/src/config.ts b/examples/docs/src/config.ts
index a9001b8ab..a892aedda 100644
--- a/examples/docs/src/config.ts
+++ b/examples/docs/src/config.ts
@@ -16,6 +16,12 @@ export const KNOWN_LANGUAGES = {
   English: 'en',
 };
 
+// Uncomment this to add an "Edit this page" button to every page of documentation.
+// export const GITHUB_EDIT_URL = `https://github.com/snowpackjs/astro/blob/main/docs/`;
+
+// Uncomment this to add an "Join our Community" button to every page of documentation.
+// export const COMMUNITY_INVITE_URL = `https://astro.build/chat`;
+
 // Uncomment this to enable site search.
 // See "Algolia" section of the README for more information.
 // export const ALGOLIA = {
diff --git a/examples/docs/src/layouts/MainLayout.astro b/examples/docs/src/layouts/MainLayout.astro
index 04416316d..620f2e06b 100644
--- a/examples/docs/src/layouts/MainLayout.astro
+++ b/examples/docs/src/layouts/MainLayout.astro
@@ -6,19 +6,19 @@ import Footer from '../components/Footer/Footer.astro';
 import PageContent from '../components/PageContent/PageContent.astro';
 import LeftSidebar from '../components/LeftSidebar/LeftSidebar.astro';
 import RightSidebar from '../components/RightSidebar/RightSidebar.astro';
-import { SITE } from "../config.ts";
+import * as CONFIG from "../config.ts";
 
 const { content = {} } = Astro.props;
 const currentPage = Astro.request.url.pathname;
 const currentFile = `src/pages${currentPage.replace(/\/$/, "")}.md`;
-const githubEditUrl = `https://github.com/snowpackjs/astro/blob/main/docs/${currentFile}`;
+const githubEditUrl = CONFIG.GITHUB_EDIT_URL && (CONFIG.GITHUB_EDIT_URL + currentFile);
 ---
 
 <html dir="{content.dir ?? 'ltr'}" lang="{content.lang ?? 'en-us'}" class="initial">
   <head>
     <HeadCommon />
     <HeadSEO {content} canonicalURL={Astro.request.canonicalURL} />
-    <title>{content.title ? `${content.title} 🚀 ${SITE.title}` : SITE.title}</title>
+    <title>{content.title ? `${content.title} 🚀 ${CONFIG.SITE.title}` : CONFIG.SITE.title}</title>
     <style>
       body {
         width: 100%;