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 color = '';
|
||||
export let description = '';
|
||||
|
||||
export let edit = false;
|
||||
export let onDelete: Function = () => {};
|
||||
</script>
|
||||
|
||||
<div class="flex gap-2">
|
||||
|
|
@ -59,3 +62,18 @@
|
|||
/>
|
||||
</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"
|
||||
>
|
||||
{#if selectedTab == 'general'}
|
||||
<Display bind:name bind:description />
|
||||
<Display
|
||||
bind:name
|
||||
bind:description
|
||||
{edit}
|
||||
onDelete={() => {
|
||||
showDeleteConfirmDialog = true;
|
||||
}}
|
||||
/>
|
||||
{:else if selectedTab == 'permissions'}
|
||||
<Permissions bind:permissions {defaultPermissions} />
|
||||
{:else if selectedTab == 'users'}
|
||||
|
|
@ -286,37 +293,25 @@
|
|||
{/if}
|
||||
</div> -->
|
||||
|
||||
<div class="flex justify-between pt-3 text-sm font-medium gap-1.5">
|
||||
{#if edit}
|
||||
{#if ['general', 'permissions'].includes(selectedTab)}
|
||||
<div class="flex justify-end pt-3 text-sm font-medium gap-1.5">
|
||||
<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"
|
||||
type="button"
|
||||
on:click={() => {
|
||||
showDeleteConfirmDialog = true;
|
||||
}}
|
||||
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('Delete')}
|
||||
{$i18n.t('Save')}
|
||||
|
||||
{#if loading}
|
||||
<div class="ml-2 self-center">
|
||||
<Spinner />
|
||||
</div>
|
||||
{/if}
|
||||
</button>
|
||||
{:else}
|
||||
<div></div>
|
||||
{/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>
|
||||
</div>
|
||||
{/if}
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -73,8 +73,8 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<div class=" max-h-full h-full w-full flex flex-col">
|
||||
<div class="w-full h-fit">
|
||||
<div class=" max-h-full h-full w-full flex flex-col overflow-y-hidden">
|
||||
<div class="w-full h-fit mb-1.5">
|
||||
<div class="flex flex-1 h-fit">
|
||||
<div class=" self-center mr-3">
|
||||
<Search />
|
||||
|
|
@ -87,7 +87,7 @@
|
|||
</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">
|
||||
{#if users.length > 0}
|
||||
{#each users as user, userIdx (user.id)}
|
||||
|
|
|
|||
Loading…
Reference in a new issue