Browse Source

and add images

Getty Ritter 1 year ago
parent
commit
a06d76f6d0
3 changed files with 33 additions and 9 deletions
  1. BIN
      imgs/matzo-logo.png
  2. 13 0
      imgs/matzo-logo.svg
  3. 20 9
      index.html

BIN
imgs/matzo-logo.png


File diff suppressed because it is too large
+ 13 - 0
imgs/matzo-logo.svg


+ 20 - 9
index.html

@@ -6,7 +6,7 @@
     <meta property="og:title" content="Matzo Playground" />
     <meta property="og:type" content="website" />
     <meta property="og:url" content="https://gdritter.com/mtz.html" />
-    <meta property="og:image" content="https://gdritter.com/imgs/matzo.png" />
+    <meta property="og:image" content="https://gdritter.com/imgs/matzo-logo.png" />
 
     <meta charset="utf-8">
     <script type="text/javascript">
@@ -19,6 +19,11 @@
        font-family: "Fira Mono", "Roboto", monospace;
      }
 
+     a {
+       color: #b9794a;
+       font-weight: bold;
+     }
+
      .content {
        height: 100%;
        margin: 0;
@@ -78,10 +83,15 @@
      header, footer {
        display: flex;
        justify-content: space-between;
-       background-color: #bbb;
+       background-color: #ddd;
      }
-     header > span {
-       padding: 0.5em 2em;
+     header > div {
+       display: flex;
+       align-items: center;
+       padding: 0.5em 1em;
+     }
+     #logo {
+       padding-right: 1em;
      }
      footer > span {
        padding: 0.5em 2em;
@@ -90,15 +100,16 @@
   </head>
   <body><div class="content">
     <header>
-      <span>
-        Playground for the <a href="https://github.com/aisamanra/matzo/">Matzo Language</a>
-      </span>
-      <span>
+      <div>
+        <img id="logo" src="./matzo-logo.svg" height="24pt">
+        <span>Playground for the <a href="https://github.com/aisamanra/matzo/">Matzo Language</a></span>
+      </div>
+      <div>
         <select id="examples">
           <option value="hello">hello.matzo</option>
           %EXAMPLES%
         </select><br/>
-      </span>
+      </div>
     </header>
     <div class="all">
       <div class="panel">