feat(frontend): UI nits

This commit is contained in:
Faton Ramadani
2024-08-15 11:49:30 +02:00
parent 4925d2e07f
commit 64150cf3ec
3 changed files with 25 additions and 13 deletions
@@ -952,7 +952,6 @@
globalRefreshes[detail.moduleId]?.({ job: detail.id, index: detail.index })
}}
modules={job.raw_flow?.modules ?? []}
failureModule={job.raw_flow?.failure_module}
/>
</div>
<div
@@ -6,6 +6,7 @@
import type { FlowModule } from '$lib/gen'
import BarsStaggered from '$lib/components/icons/BarsStaggered.svelte'
import type { WhitelabelCustomUi } from '$lib/components/custom_ui'
import { twMerge } from 'tailwind-merge'
const dispatch = createEventDispatcher()
export let trigger = false
@@ -28,16 +29,22 @@
placement="bottom-center"
let:close
>
<button
title="Add step"
slot="trigger"
id={`flow-editor-add-step-${index}`}
type="button"
class="text-primary bg-surface border-[1px] mx-[1px] border-gray-300 dark:border-gray-500 focus:outline-none hover:bg-surface-hover focus:ring-4 focus:ring-surface-selected font-medium rounded-full text-sm w-[25px] h-[25px] flex items-center justify-center"
>
<Cross class="mx-[5px]" size={15} />
</button>
<div id="flow-editor-insert-module" class="z-50">
<svelte:fragment slot="trigger">
<button
title="Add step"
id={`flow-editor-add-step-${index}`}
type="button"
class={twMerge(
'w-6 h-6 flex items-center justify-center',
'border border-gray-300 dark:border-gray-500',
'text-primary text-sm',
'bg-surface focus:outline-none hover:bg-surface-hover focus:ring-4 focus:ring-surface-selected rounded-full '
)}
>
<Cross size={14} />
</button>
</svelte:fragment>
<div id="flow-editor-insert-module">
<StepGen on:insert {index} bind:funcDesc bind:open {close} {modules} {disableAi} />
{#if funcDesc.length === 0}
@@ -8,6 +8,7 @@
import type { GraphEventHandlers } from '../../graphBuilder'
import { getStraightLinePath } from '../utils'
import InsertTriggerButton from '$lib/components/flows/map/InsertTriggerButton.svelte'
import { twMerge } from 'tailwind-merge'
export let sourceX: number
export let sourceY: number
@@ -100,9 +101,14 @@
})
}}
type="button"
class="text-primary bg-surface border-[1px] mx-[1px] border-gray-300 dark:border-gray-500 focus:outline-none hover:bg-surface-hover focus:ring-4 focus:ring-surface-selected font-medium rounded-full text-sm w-[25px] h-[25px] flex items-center justify-center"
class={twMerge(
'w-6 h-6 flex items-center justify-center',
'border border-gray-300 dark:border-gray-500',
'text-primary text-sm',
'bg-surface focus:outline-none hover:bg-surface-hover focus:ring-4 focus:ring-surface-selected rounded-full '
)}
>
<ClipboardCopy class="m-[5px]" size={15} />
<ClipboardCopy size={14} />
</button>
{/if}
</div>