starred/windmill
1
0
Fork 0
mirror of https://github.com/windmill-labs/windmill.git synced 2026-08-21 16:02:28 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(frontend): improve component list (#4028)

Browse Source
This commit is contained in:
Faton Ramadani
2024-07-05 11:41:38 +02:00
committed by GitHub
parent c4673f8dc5
commit 448d5ad228
1 changed files with 12 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/components/apps/editor/componentsPanel/ComponentList.svelte
+12 -12
View File
@@ -199,7 +199,7 @@
<ListItem title={`${title}`} subtitle={`(${components.length})`}>
<div class="flex flex-wrap gap-3 py-2">
{#each components as item (item)}
<div class="w-20 relative">
<div class="w-[64px] relative">
{#if DEPRECATED_COMPONENTS[item]}
<div
class="absolute -top-2 -right-2 bg-gray-100 text-gray-900 dark:bg-gray-800 dark:text-gray-100 rounded-md py-0.5 px-1 flex flex-row gap-1 items-center"
@@ -227,7 +227,7 @@
})
}}
title={componentsRecord[item].name}
class="cursor-move transition-all border w-20 shadow-sm h-16 p-2 flex flex-col gap-2 items-center
class="cursor-move transition-all border w-[64px] shadow-sm h-16 p-2 flex flex-col gap-2 items-center
justify-center bg-surface rounded-md hover:bg-blue-50 dark:hover:bg-blue-900 duration-200 hover:border-blue-500"
>
<svelte:component this={componentsRecord[item].icon} class="text-primary" />
@@ -239,11 +239,11 @@
{/each}
{#if presets}
{#each presets as presetItem (presetItem)}
<div class="w-20">
<div class="w-[64px]">
<button
on:click={() => addPresetComponent(presetItem)}
title={presetsRecord[presetItem].name}
class="transition-all border w-20 shadow-sm h-16 p-2 flex flex-col gap-2 items-center
class="transition-all border w-[64px] shadow-sm h-16 p-2 flex flex-col gap-2 items-center
justify-center bg-surface rounded-md hover:bg-blue-50 dark:hover:bg-blue-900 duration-200 hover:border-blue-500"
>
<svelte:component
@@ -266,13 +266,13 @@
<div class="flex flex-wrap gap-3 py-2">
{#if groups}
{#each groups as group (group.path)}
<div class="w-20">
<div class="w-[64px]">
<button
on:click={() => {
addGroup(group)
}}
title={group.name}
class="transition-all border w-20 shadow-sm h-16 p-2 flex flex-col gap-2 items-center
class="transition-all border w-[64px] shadow-sm h-16 p-2 flex flex-col gap-2 items-center
justify-center bg-surface rounded-md hover:bg-blue-50 dark:hover:bg-blue-900 duration-200 hover:border-blue-500"
>
<LayoutDashboard class="text-secondary" />
@@ -283,13 +283,13 @@
</div>
{/each}
{/if}
<div class="w-20">
<div class="w-[64px]">
<button
on:click={() => {
addNewGroup()
}}
title=""
class="transition-all border w-20 shadow-sm h-16 p-2 flex flex-col gap-2 items-center
class="transition-all border w-[64px] shadow-sm h-16 p-2 flex flex-col gap-2 items-center
justify-center bg-surface rounded-md hover:bg-blue-50 dark:hover:bg-blue-900 duration-200 hover:border-blue-500"
>
<Plus class="text-secondary" />
@@ -302,13 +302,13 @@
<div class="flex flex-wrap gap-3 py-2">
{#if customComponents}
{#each customComponents as cc (cc.path)}
<div class="w-20">
<div class="w-[64px]">
<button
on:click={() => {
addCustomComponent(cc)
}}
title={cc.name}
class="transition-all border w-20 shadow-sm h-16 p-2 flex flex-col gap-2 items-center
class="transition-all border w-[64px] shadow-sm h-16 p-2 flex flex-col gap-2 items-center
justify-center bg-surface rounded-md hover:bg-blue-50 dark:hover:bg-blue-900 duration-200 hover:border-blue-500"
>
<LayoutDashboard class="text-secondary" />
@@ -319,7 +319,7 @@
</div>
{/each}
{/if}
<div class="w-20">
<div class="w-[64px]">
<button
on:click={() => {
if (!$enterpriseLicense) {
@@ -329,7 +329,7 @@
}
}}
title=""
class="transition-all border w-20 shadow-sm h-16 p-2 flex flex-col gap-2 items-center
class="transition-all border w-[64px] shadow-sm h-16 p-2 flex flex-col gap-2 items-center
justify-center bg-surface rounded-md hover:bg-blue-50 dark:hover:bg-blue-900 duration-200 hover:border-blue-500"
>
<Plus class="text-secondary" />