feat(frontend): Tone down text + display whole text (#1366)

This commit is contained in:
Faton Ramadani
2023-04-06 16:07:34 +02:00
committed by GitHub
parent 4af39f081b
commit f214d5f96b
2 changed files with 13 additions and 13 deletions
@@ -96,20 +96,20 @@
{#if components.length}
<div transition:slide|local={{ duration: 100 }}>
<ListItem title={`${title} (${components.length})`}>
<div class="flex flex-wrap gap-2 py-2">
<div class="flex flex-wrap gap-3 py-2">
{#each components as item (item)}
<button
animate:flip={{ duration: 100 }}
on:click={() => addComponent(item)}
title={componentsRecord[item].name}
class="border w-24 shadow-sm h-16 p-2 flex flex-col gap-2 items-center
justify-center bg-white rounded-md hover:bg-gray-100 duration-200"
>
<svelte:component this={componentsRecord[item].icon} />
<div class="text-xs w-full text-center ellipsize">
<div animate:flip={{ duration: 100 }} class="w-20">
<button
on:click={() => addComponent(item)}
title={componentsRecord[item].name}
class="transition-all border w-20 shadow-sm h-16 p-2 flex flex-col gap-2 items-center justify-center bg-white rounded-md hover:bg-gray-100 duration-200 hover:border-blue-500"
>
<svelte:component this={componentsRecord[item].icon} class="text-gray-600" />
</button>
<div class="text-xs text-center flex-wrap text-gray-600 mt-1">
{componentsRecord[item].name}
</div>
</button>
</div>
{/each}
</div>
</ListItem>
@@ -30,7 +30,7 @@
{#if prefix !== undefined}
<button
on:click|preventDefault={() => isOpenStore.toggle(storeTitle)}
class="w-full flex justify-between items-center text-gray-700 px-2 py-1
class="w-full flex justify-between items-center text-gray-700 px-2 py-1
rounded-sm duration-200 hover:bg-gray-100 {toggleClasses}"
>
<h1 class="text-sm font-semibold text-left">
@@ -46,7 +46,7 @@
</div>
{/if}
{:else}
<h1 class="text-sm font-semibold text-left px-2 py-1">
<h1 class="text-sm font-semibold text-left px-2 py-1 text-gray-600">
<slot name="title">
{title}
</slot>