ui: Improvements

This commit is contained in:
Andras Bacsai
2022-04-02 17:43:24 +02:00
parent 066f5b25e0
commit 7a74ba1796
14 changed files with 501 additions and 125 deletions

View File

@@ -31,37 +31,20 @@
</script>
<script lang="ts">
import Clickhouse from '$lib/components/svg/databases/Clickhouse.svelte';
import CouchDb from '$lib/components/svg/databases/CouchDB.svelte';
import MongoDb from '$lib/components/svg/databases/MongoDB.svelte';
import MySql from '$lib/components/svg/databases/MySQL.svelte';
import PostgreSql from '$lib/components/svg/databases/PostgreSQL.svelte';
import Redis from '$lib/components/svg/databases/Redis.svelte';
import DatabaseLinks from '$lib/components/DatabaseLinks.svelte';
export let database;
export let settings;
export let privatePort;
</script>
<div class="flex items-center space-x-2 p-6 text-2xl font-bold">
<div class="md:max-w-64 truncate text-base tracking-tight md:block md:text-2xl">
{database.name}
<div class="-mb-6 flex-col">
<div class="md:max-w-64 truncate text-base tracking-tight md:text-2xl lg:block">
Configuration
</div>
<span class="text-xs">{database.name}</span>
</div>
<span class="relative">
{#if database.type === 'clickhouse'}
<Clickhouse />
{:else if database.type === 'couchdb'}
<CouchDb />
{:else if database.type === 'mongodb'}
<MongoDb />
{:else if database.type === 'mysql'}
<MySql />
{:else if database.type === 'postgresql'}
<PostgreSql />
{:else if database.type === 'redis'}
<Redis />
{/if}
</span>
<DatabaseLinks {database} />
</div>
<Databases bind:database {privatePort} {settings} />