From d586e43d6e8dc09ce000a9db6252babfe91abf15 Mon Sep 17 00:00:00 2001
From: lana-k <skochetova89@gmail.com>
Date: Sat, 14 Nov 2020 23:08:19 +0100
Subject: [PATCH] fix some minor style issues

---
 package.json                |  2 +-
 src/components/DbUpload.vue |  7 +++++--
 src/views/Editor.vue        | 14 +++++++++++++-
 3 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index 4afea1e..a3b93ab 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "sqliteviz",
-  "version": "0.5.0",
+  "version": "1.0.0",
   "license" : "Apache-2.0",
   "private": true,
   "scripts": {
diff --git a/src/components/DbUpload.vue b/src/components/DbUpload.vue
index 451ccea..d0f0da6 100644
--- a/src/components/DbUpload.vue
+++ b/src/components/DbUpload.vue
@@ -1,5 +1,5 @@
 <template>
-  <div>
+  <div class="db-upload-container">
     <label for="assetsFieldHandle">
       <div class="drop-area" @dragover="dragover" @dragleave="dragleave" @drop="drop">
         <input
@@ -9,7 +9,7 @@
           ref="file"
           accept=".db,.sqlite,.sqlite3"
         />
-        <div>
+        <div class="text">
           Drop the database file to upload here or click to choose a file from your computer.
         </div>
       </div>
@@ -57,8 +57,10 @@ label {
   padding: 8px;
   border-radius: var(--border-radius-big);
   height: 100%;
+  width: 100%;
   box-sizing: border-box;
 }
+
 .drop-area {
   background-color: var(--color-bg-light-3);
   border-radius: var(--border-radius-big);
@@ -71,6 +73,7 @@ label {
   justify-content: center;
   height: 100%;
 }
+
 input {
   display: none;
 }
diff --git a/src/views/Editor.vue b/src/views/Editor.vue
index d80b63b..aef6b3e 100644
--- a/src/views/Editor.vue
+++ b/src/views/Editor.vue
@@ -53,14 +53,26 @@ export default {
 
 #db-uploader {
   flex-grow: 1;
-  margin: 24px;
+  padding: 24px;
+  width: 100%;
+  box-sizing: border-box;
 }
 
 .warning {
   padding: 12px 24px;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+>>> .db-upload-container {
+  width: 100%;
 }
 
 >>>.drop-area {
   padding: 0 15px;
 }
+
+>>>.drop-area .text {
+  max-width: 200px;
+}
 </style>