docs: add github icon on top of demo.tutorialkit.dev TopBar

packages/astro/src/default/components/Github.tsx

@@ -0,0 +1,20 @@
+export function Github() {
+  return (
+    <a
+      href="https://github.com/stackblitz/tutorialkit/tree/main/docs/demo"
+      className="flex items-center text-2xl text-tk-elements-topBar-iconButton-iconColor hover:text-tk-elements-topBar-iconButton-iconColorHover bg-tk-elements-topBar-iconButton-backgroundColor hover:bg-tk-elements-topBar-iconButton-backgroundColorHover p-1 rounded-md"
+      title="Github"
+    >
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        viewBox="0 0 24 24"
+        style={{ height: '1.3rem', width: '1.3rem', fill: 'var(--tk-elements-topBar-iconButton-iconColor)' }}
+      >
+        <g>
+          <rect width="24" height="24" opacity="0"></rect>
+          <path d="M16.24 22a1 1 0 0 1-1-1v-2.6a2.15 2.15 0 0 0-.54-1.66 1 1 0 0 1 .61-1.67C17.75 14.78 20 14 20 9.77a4 4 0 0 0-.67-2.22 2.75 2.75 0 0 1-.41-2.06 3.71 3.71 0 0 0 0-1.41 7.65 7.65 0 0 0-2.09 1.09 1 1 0 0 1-.84.15 10.15 10.15 0 0 0-5.52 0 1 1 0 0 1-.84-.15 7.4 7.4 0 0 0-2.11-1.09 3.52 3.52 0 0 0 0 1.41 2.84 2.84 0 0 1-.43 2.08 4.07 4.07 0 0 0-.67 2.23c0 3.89 1.88 4.93 4.7 5.29a1 1 0 0 1 .82.66 1 1 0 0 1-.21 1 2.06 2.06 0 0 0-.55 1.56V21a1 1 0 0 1-2 0v-.57a6 6 0 0 1-5.27-2.09 3.9 3.9 0 0 0-1.16-.88 1 1 0 1 1 .5-1.94 4.93 4.93 0 0 1 2 1.36c1 1 2 1.88 3.9 1.52a3.89 3.89 0 0 1 .23-1.58c-2.06-.52-5-2-5-7a6 6 0 0 1 1-3.33.85.85 0 0 0 .13-.62 5.69 5.69 0 0 1 .33-3.21 1 1 0 0 1 .63-.57c.34-.1 1.56-.3 3.87 1.2a12.16 12.16 0 0 1 5.69 0c2.31-1.5 3.53-1.31 3.86-1.2a1 1 0 0 1 .63.57 5.71 5.71 0 0 1 .33 3.22.75.75 0 0 0 .11.57 6 6 0 0 1 1 3.34c0 5.07-2.92 6.54-5 7a4.28 4.28 0 0 1 .22 1.67V21a1 1 0 0 1-.94 1z"></path>
+        </g>
+      </svg>
+    </a>
+  );
+}

packages/astro/src/default/components/TopBar.astro

@@ -7,6 +7,9 @@
   <div class="mr-2">
     <slot name="open-in-stackblitz-link" />
   </div>
+  <div class="mr-2">
+    <slot name="github" />
+  </div>
   <div>
     <slot name="theme-switch" />
   </div>

packages/astro/src/default/components/TopBarWrapper.astro

@@ -6,6 +6,7 @@ import { LoginButton } from './LoginButton';
 import { OpenInStackblitzLink } from './OpenInStackblitzLink';
 import Logo from './Logo.astro';
 import { useAuth } from './setup';
+import { Github } from './Github';
 
 interface Props {
   logoLink: string;
@@ -22,5 +23,7 @@ const { logoLink, openInStackBlitz } = Astro.props;
 
   <ThemeSwitch client:load transition:persist slot="theme-switch" />
 
+  <Github client:load transition:persist slot="github" />
+
   {useAuth && <LoginButton client:load transition:persist slot="login-button" />}
 </TopBar>