1
0
mirror of https://github.com/lana-k/sqliteviz.git synced 2025-12-07 02:28:54 +08:00

fix some minor style issues

This commit is contained in:
lana-k
2020-11-14 23:08:19 +01:00
parent 20c1e3f1cc
commit d586e43d6e
3 changed files with 19 additions and 4 deletions

View File

@@ -1,6 +1,6 @@
{ {
"name": "sqliteviz", "name": "sqliteviz",
"version": "0.5.0", "version": "1.0.0",
"license" : "Apache-2.0", "license" : "Apache-2.0",
"private": true, "private": true,
"scripts": { "scripts": {

View File

@@ -1,5 +1,5 @@
<template> <template>
<div> <div class="db-upload-container">
<label for="assetsFieldHandle"> <label for="assetsFieldHandle">
<div class="drop-area" @dragover="dragover" @dragleave="dragleave" @drop="drop"> <div class="drop-area" @dragover="dragover" @dragleave="dragleave" @drop="drop">
<input <input
@@ -9,7 +9,7 @@
ref="file" ref="file"
accept=".db,.sqlite,.sqlite3" accept=".db,.sqlite,.sqlite3"
/> />
<div> <div class="text">
Drop the database file to upload here or click to choose a file from your computer. Drop the database file to upload here or click to choose a file from your computer.
</div> </div>
</div> </div>
@@ -57,8 +57,10 @@ label {
padding: 8px; padding: 8px;
border-radius: var(--border-radius-big); border-radius: var(--border-radius-big);
height: 100%; height: 100%;
width: 100%;
box-sizing: border-box; box-sizing: border-box;
} }
.drop-area { .drop-area {
background-color: var(--color-bg-light-3); background-color: var(--color-bg-light-3);
border-radius: var(--border-radius-big); border-radius: var(--border-radius-big);
@@ -71,6 +73,7 @@ label {
justify-content: center; justify-content: center;
height: 100%; height: 100%;
} }
input { input {
display: none; display: none;
} }

View File

@@ -53,14 +53,26 @@ export default {
#db-uploader { #db-uploader {
flex-grow: 1; flex-grow: 1;
margin: 24px; padding: 24px;
width: 100%;
box-sizing: border-box;
} }
.warning { .warning {
padding: 12px 24px; padding: 12px 24px;
width: 100%;
box-sizing: border-box;
}
>>> .db-upload-container {
width: 100%;
} }
>>>.drop-area { >>>.drop-area {
padding: 0 15px; padding: 0 15px;
} }
>>>.drop-area .text {
max-width: 200px;
}
</style> </style>