Change Symbols alignement

This commit is contained in:
Guillaume Tauzin 2022-11-04 15:42:59 +01:00
parent db7cca06aa
commit 9dced69e8d

View file

@ -16,7 +16,7 @@ export function Symbols(props: ISymbolsProps): JSX.Element {
if (componentOption.Image.Url !== undefined || componentOption.Image.Base64Image !== undefined) {
const url = componentOption.Image.Base64Image ?? componentOption.Image.Url;
return (<button type="button"
className='justify-center sidebar-component-card hover:h-full'
className='flex justify-start items-center sidebar-component-card hover:h-full'
key={componentOption.Name}
id={componentOption.Name}
title={componentOption.Name}
@ -30,8 +30,8 @@ export function Symbols(props: ISymbolsProps): JSX.Element {
src={url}
/>
</div>
<div>
{TruncateString(componentOption.Name, 5)}
<div className='ml-5'>
{TruncateString(componentOption.Name, 20)}
</div>
</button>);
}
@ -52,7 +52,7 @@ export function Symbols(props: ISymbolsProps): JSX.Element {
return (
<div className='h-full overflow-y-auto'>
<div className='grid grid-cols-1 md:grid-cols-3 gap-2
<div className='grid grid-cols-1 md:grid-cols-1 gap-2
overflow-auto m-2 md:text-xs font-bold'>
{listElements}
</div>