ershisan99/coolify
1
0
Fork 0
mirror of https://github.com/ershisan99/coolify.git synced 2025-12-31 12:34:03 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: ui

Browse Source
This commit is contained in:
Andras Bacsai
2022-11-29 13:00:44 +01:00
parent 028ee6d7b1
commit 876c81fad8
9 changed files with 89 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/ui/src/lib/components/ContextMenu.svelte
View File

@@ -1,4 +1,4 @@
<nav class="header justify-between px-0 mb-5" style="border-bottom: 2px solid #666;">
<slot />
<slot name="actions"></slot>
<nav class="header justify-between px-2 mb-5 lg:px-10">
<slot />
<slot name="actions" />
</nav>

16
apps/ui/src/lib/components/LocalePicker.svelte
View File

@@ -1,11 +1,11 @@
<script>
import { locale, locales } from '$lib/translations';
import { locale, locales } from '$lib/translations';
</script>
<div >
<select bind:value={$locale} class="w-14">
{#each $locales as l}
<option value={l}>{l}</option>
{/each}
</select>
</div>
<div>
<select bind:value={$locale} class="w-14">
{#each $locales as l}
<option value={l}>{l}</option>
{/each}
</select>
</div>

23
apps/ui/src/lib/components/badges/DestinationBadge.svelte
View File

@@ -1,15 +1,14 @@
<script>
import Tooltip from "../Tooltip.svelte";
import {initials} from '$lib/common';
export let name;
export let thingId;
let id = 'destination' + thingId;
import Tooltip from '../Tooltip.svelte';
import { initials } from '$lib/common';
export let name;
export let thingId;
let id = 'destination' + thingId;
</script>
{#if (name||'').length > 0}
<span class="badge rounded uppercase text-xs " id={id}>
{initials(name)}
</span>
<Tooltip triggeredBy="#{id}" placement="right">{name}</Tooltip>
{/if}
{#if (name || '').length > 0}
<span class="badge rounded uppercase text-xs " {id}>
{initials(name)}
</span>
<Tooltip triggeredBy="#{id}" placement="right">{name}</Tooltip>
{/if}

36
apps/ui/src/lib/components/badges/PublicBadge.svelte
View File

@@ -1,19 +1,19 @@
<div title="Public">
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 "
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
fill="none"
stroke-linecap="round"
stroke-linejoin="round"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<circle cx="12" cy="12" r="9" />
<line x1="3.6" y1="9" x2="20.4" y2="9" />
<line x1="3.6" y1="15" x2="20.4" y2="15" />
<path d="M11.5 3a17 17 0 0 0 0 18" />
<path d="M12.5 3a17 17 0 0 1 0 18" />
</svg>
</div>
<svg
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 "
viewBox="0 0 24 24"
stroke-width="1.5"
stroke="currentColor"
fill="none"
stroke-linecap="round"
stroke-linejoin="round"
>
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<circle cx="12" cy="12" r="9" />
<line x1="3.6" y1="9" x2="20.4" y2="9" />
<line x1="3.6" y1="15" x2="20.4" y2="15" />
<path d="M11.5 3a17 17 0 0 0 0 18" />
<path d="M12.5 3a17 17 0 0 1 0 18" />
</svg>
</div>

37
apps/ui/src/lib/components/badges/StatusBadge.svelte
View File

@@ -1,25 +1,26 @@
<script lang="ts">
import {getStatus} from '$lib/container/status'
import { getStatus } from '$lib/container/status';
import { onDestroy, onMount } from 'svelte';
export let thing:any;
let getting = getStatus(thing)
let refreshing:any;
let status:any;
// AutoUpdates Status every 5 seconds
onMount( ()=>{
refreshing = setInterval( () =>{
getStatus(thing).then( (r) => status = r )
}, 5000)
})
onDestroy( () =>{
clearInterval(refreshing);
})
export let thing: any;
let getting = getStatus(thing);
let refreshing: any;
let status: any;
// AutoUpdates Status every 5 seconds
onMount(() => {
refreshing = setInterval(() => {
getStatus(thing).then((r) => (status = r));
}, 5000);
});
onDestroy(() => {
clearInterval(refreshing);
});
</script>
{#await getting}
<span class="badge badge-lg rounded uppercase">...</span>
<span class="badge badge-lg rounded uppercase">...</span>
{:then status}
<span class="badge badge-lg rounded uppercase badge-status-{status}">
{status}
</span>
<span class="badge badge-lg rounded uppercase badge-status-{status}">
{status}
</span>
{/await}

25
apps/ui/src/lib/components/badges/TeamsBadge.svelte
View File

@@ -1,17 +1,16 @@
<script lang="ts">
import Tooltip from "../Tooltip.svelte";
import {initials} from '$lib/common';
export let teams:any;
export let thing:any;
let id = 'teams' + thing.id;
import Tooltip from '../Tooltip.svelte';
import { initials } from '$lib/common';
export let teams: any;
export let thing: any;
let id = 'teams' + thing.id;
</script>
<span>
🏢
{#each teams as team}
<a href={`/iam/teams/${team.id}`} {id} style="color: #99f8; text-decoration: none;">
{initials(team.name)}
</a>
<Tooltip triggeredBy="#{id}" placement="right" color="bg-sky-500/50">{team.name}</Tooltip>
{/each}
</span>
{#each teams as team}
<a href={`/iam/teams/${team.id}`} {id} class="no-underline">
Team: {initials(team.name)}
</a>
<Tooltip triggeredBy="#{id}" placement="right" color="bg-destinations">{team.name}</Tooltip>
{/each}
</span>

8
apps/ui/src/lib/components/grids/Grid3.svelte
View File

@@ -1,3 +1,5 @@
<div class="grid grid-col gap-8 auto-cols-max grid-cols-1 md:grid-cols-2 lg:md:grid-cols-3 xl:grid-cols-4 p-4" >
<slot/>
</div>
<div
class="grid grid-col gap-8 auto-cols-max grid-cols-1 md:grid-cols-2 lg:md:grid-cols-3 xl:grid-cols-4 p-4 lg:px-10"
>
<slot />
</div>