From 0f8c43885b517ad7712b4e741aab94f5914bee34 Mon Sep 17 00:00:00 2001
From: Marcell Mars <ki.ber@kom.uni.st>
Date: Sat, 27 Mar 2021 17:02:33 +0100
Subject: [PATCH] styling a bit..

---
 public/global.css | 31 +++++++++++++++++++++++++++----
 src/App.svelte    | 15 ++++++++++-----
 2 files changed, 37 insertions(+), 9 deletions(-)

diff --git a/public/global.css b/public/global.css
index bb28a94..dc2c8bb 100644
--- a/public/global.css
+++ b/public/global.css
@@ -25,10 +25,6 @@ a:visited {
 	color: rgb(0,80,160);
 }
 
-label {
-	display: block;
-}
-
 input, button, select, textarea {
 	font-family: inherit;
 	font-size: inherit;
@@ -61,3 +57,30 @@ button:not(:disabled):active {
 button:focus {
 	border-color: #666;
 }
+
+/* custom part */
+
+form {
+  display: grid;
+  grid-template-columns: auto 1fr;
+  grid-gap: 1rem;
+}
+
+#sandpoints {
+  width: 80%;
+  margin-left: 1rem;
+  margin-top: 1rem;
+}
+
+label {
+  grid-column: 1/2;
+  text-transform: capitalize;
+}
+
+input, button, textarea {
+  grid-column: 2/3;
+}
+
+textarea {
+  height: 10rem;
+}
diff --git a/src/App.svelte b/src/App.svelte
index 29e50b7..9c9e452 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -59,6 +59,9 @@
    el.onload = ()=> {
      console.log("loading...")
      v = repo.content;
+     if (v.startsWith("\n")) {
+       v = v.substring(1)
+     }
      path = repo.path;
      console.log(JSON.stringify(repo))
      generateFrontMatter(repo.frontmatter, path, document.location.protocol.substring(0,4))
@@ -77,12 +80,14 @@
 <svelte:window on:hashchange={hashChanged} />
 <main id="sandpoints">
   <form>
-    <div class="content"><textarea>{v}</textarea></div>
-    <div class="meta">Path: {path}</div>
-    <label for="publish">Publish</label>
-    <input type="checkbox" id="publish" name="publish" />
+      <label for="content">Content:</label>
+      <textarea bind:value={v} oninput='this.style.height = "";this.style.height = this.scrollHeight + 3 + "px"'></textarea>
+    {#if document.location.protocol.substring(0,4) != "file"}
+      <label for="publish">Publish</label>
+      <input type="checkbox" id="publish" name="publish" />
+    {/if}
     <label for="offline">Offline</label>
     <input type="checkbox" id="offline" name="offline" />
-    <div class="btns"><button id="sandpointsButton">BANG</button></div>
+    <button id="sandpointsButton">COMMIT/SAVE</button>
   </form>
 </main>