mirror of
https://github.com/open-webui/open-webui.git
synced 2025-12-11 20:05:19 +00:00
refac: styling
This commit is contained in:
parent
73734b186b
commit
ed6aabfbfd
3 changed files with 45 additions and 32 deletions
|
|
@ -8,6 +8,9 @@
|
||||||
export let name = '';
|
export let name = '';
|
||||||
export let color = '';
|
export let color = '';
|
||||||
export let description = '';
|
export let description = '';
|
||||||
|
|
||||||
|
export let edit = false;
|
||||||
|
export let onDelete: Function = () => {};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class="flex gap-2">
|
<div class="flex gap-2">
|
||||||
|
|
@ -59,3 +62,18 @@
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{#if edit}
|
||||||
|
<div class="flex flex-col w-full mt-2">
|
||||||
|
<div class=" mb-0.5 text-xs text-gray-500">{$i18n.t('Actions')}</div>
|
||||||
|
|
||||||
|
<div class="flex-1">
|
||||||
|
<button
|
||||||
|
class="text-xs bg-transparent hover:underline cursor-pointer"
|
||||||
|
on:click={() => onDelete()}
|
||||||
|
>
|
||||||
|
{$i18n.t('Delete')}
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
|
|
|
||||||
|
|
@ -228,7 +228,14 @@
|
||||||
class="flex-1 mt-1 lg:mt-1 lg:h-[30rem] lg:max-h-[30rem] overflow-y-auto scrollbar-hidden"
|
class="flex-1 mt-1 lg:mt-1 lg:h-[30rem] lg:max-h-[30rem] overflow-y-auto scrollbar-hidden"
|
||||||
>
|
>
|
||||||
{#if selectedTab == 'general'}
|
{#if selectedTab == 'general'}
|
||||||
<Display bind:name bind:description />
|
<Display
|
||||||
|
bind:name
|
||||||
|
bind:description
|
||||||
|
{edit}
|
||||||
|
onDelete={() => {
|
||||||
|
showDeleteConfirmDialog = true;
|
||||||
|
}}
|
||||||
|
/>
|
||||||
{:else if selectedTab == 'permissions'}
|
{:else if selectedTab == 'permissions'}
|
||||||
<Permissions bind:permissions {defaultPermissions} />
|
<Permissions bind:permissions {defaultPermissions} />
|
||||||
{:else if selectedTab == 'users'}
|
{:else if selectedTab == 'users'}
|
||||||
|
|
@ -286,37 +293,25 @@
|
||||||
{/if}
|
{/if}
|
||||||
</div> -->
|
</div> -->
|
||||||
|
|
||||||
<div class="flex justify-between pt-3 text-sm font-medium gap-1.5">
|
{#if ['general', 'permissions'].includes(selectedTab)}
|
||||||
{#if edit}
|
<div class="flex justify-end pt-3 text-sm font-medium gap-1.5">
|
||||||
<button
|
<button
|
||||||
class="px-3.5 py-1.5 text-sm font-medium dark:bg-black dark:hover:bg-gray-900 dark:text-white bg-white text-black hover:bg-gray-100 transition rounded-full flex flex-row space-x-1 items-center"
|
class="px-3.5 py-1.5 text-sm font-medium bg-black hover:bg-gray-900 text-white dark:bg-white dark:text-black dark:hover:bg-gray-100 transition rounded-full flex flex-row space-x-1 items-center {loading
|
||||||
type="button"
|
? ' cursor-not-allowed'
|
||||||
on:click={() => {
|
: ''}"
|
||||||
showDeleteConfirmDialog = true;
|
type="submit"
|
||||||
}}
|
disabled={loading}
|
||||||
>
|
>
|
||||||
{$i18n.t('Delete')}
|
{$i18n.t('Save')}
|
||||||
|
|
||||||
|
{#if loading}
|
||||||
|
<div class="ml-2 self-center">
|
||||||
|
<Spinner />
|
||||||
|
</div>
|
||||||
|
{/if}
|
||||||
</button>
|
</button>
|
||||||
{:else}
|
</div>
|
||||||
<div></div>
|
{/if}
|
||||||
{/if}
|
|
||||||
|
|
||||||
<button
|
|
||||||
class="px-3.5 py-1.5 text-sm font-medium bg-black hover:bg-gray-900 text-white dark:bg-white dark:text-black dark:hover:bg-gray-100 transition rounded-full flex flex-row space-x-1 items-center {loading
|
|
||||||
? ' cursor-not-allowed'
|
|
||||||
: ''}"
|
|
||||||
type="submit"
|
|
||||||
disabled={loading}
|
|
||||||
>
|
|
||||||
{$i18n.t('Save')}
|
|
||||||
|
|
||||||
{#if loading}
|
|
||||||
<div class="ml-2 self-center">
|
|
||||||
<Spinner />
|
|
||||||
</div>
|
|
||||||
{/if}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -73,8 +73,8 @@
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div class=" max-h-full h-full w-full flex flex-col">
|
<div class=" max-h-full h-full w-full flex flex-col overflow-y-hidden">
|
||||||
<div class="w-full h-fit">
|
<div class="w-full h-fit mb-1.5">
|
||||||
<div class="flex flex-1 h-fit">
|
<div class="flex flex-1 h-fit">
|
||||||
<div class=" self-center mr-3">
|
<div class=" self-center mr-3">
|
||||||
<Search />
|
<Search />
|
||||||
|
|
@ -87,7 +87,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="mt-3 overflow-y-auto flex-1">
|
<div class="flex-1 overflow-y-auto scrollbar-hidden">
|
||||||
<div class="flex flex-col gap-2.5">
|
<div class="flex flex-col gap-2.5">
|
||||||
{#if users.length > 0}
|
{#if users.length > 0}
|
||||||
{#each users as user, userIdx (user.id)}
|
{#each users as user, userIdx (user.id)}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue