From 61f581db09a364d3607975e423c1e5838454b52f Mon Sep 17 00:00:00 2001
From: Furkan Sahin <furkan-dev@proton.me>
Date: Wed, 1 Jun 2022 08:40:20 -0500
Subject: Play around with action bar CSS, make main background grey

---
 src/components/EditorActions.svelte | 20 +++++++++++++++++---
 1 file changed, 17 insertions(+), 3 deletions(-)

(limited to 'src/components/EditorActions.svelte')

diff --git a/src/components/EditorActions.svelte b/src/components/EditorActions.svelte
index fa2a041..aacbf0e 100644
--- a/src/components/EditorActions.svelte
+++ b/src/components/EditorActions.svelte
@@ -108,9 +108,15 @@
   <FileUpload accept="application/json" bind:files={dbFile}>
     <Label>Import DB</Label>
   </FileUpload>
-  <Button variant="raised" ripple={false} on:click={exportDB}>
+  <Button
+    variant="raised"
+    ripple={false}
+    on:click={exportDB}
+    style="overflow: hidden; margin-left: 0.1em; margin-right: 0.5em;"
+  >
     <Label>Export DB</Label>
   </Button>
+  <div id="info" />
 </div>
 <Snackbar bind:this={snackbar} labelText={snackbarText}>
   <Label />
@@ -120,9 +126,17 @@
 </Snackbar>
 
 <style>
+
   #action-bar {
+    display: flex;
+    justify-content: space-evenly;
+    align-content: center;
+    border-radius: 1em;
+    /* background-image: linear-gradient(to right, red, purple); */
+    background-size: 100vw;
+    max-height: 2em;
     max-width: 100vw;
-    overflow-x: auto;
-    white-space: nowrap;
+    overflow: hidden;
+    padding: 0.6em;
   }
 </style>
-- 
cgit v1.2.3