Add links

Author: pomber

playground/src/app.jsx

@@ -10,10 +10,10 @@ const defaultCode = `
 
 Edit me.
 
-~~~python hello.py
+\`\`\`python hello.py
 # mark[16:24]
 print("This is Code Hike")
-~~~
+\`\`\`
 
 `;
 
@@ -57,6 +57,8 @@ function App() {
             <span>v0.5.1</span>
           </h1>
         </a>
+        <a href="https://codehike.org/docs">Docs</a>
+        <a href="https://codehike.org/#demos">Demos</a>
       </header>
       <main>
         <SplitPane

playground/src/index.css

@@ -23,12 +23,13 @@ body,
 header {
   display: flex;
   align-items: center;
-  gap: 0.4rem;
+  gap: 0.8rem;
   background-color: #111;
   color: #fafafa;
   height: 3.2rem;
   min-height: 3.2rem;
   border-bottom: 1px solid #444;
+  padding: 0 1.5rem;
 }
 
 header h1 {
@@ -46,11 +47,18 @@ header h1 span {
 }
 
 header a.code-hike {
+  gap: 0.5rem;
+  display: flex;
+  margin-right: auto;
+}
+
+header a {
   color: inherit;
   text-decoration: inherit;
-  display: flex;
-  margin-left: 1.5rem;
-  gap: 0.5rem;
+  font-size: 1.05rem;
+}
+header a:hover {
+  color: rgb(179, 209, 245);
 }
 
 header svg {