chore: fix toolbar image option color

This commit is contained in:
Aman Harwara
2023-07-13 15:45:09 +05:30
parent ff56f04b2e
commit e4f1af1e94
4 changed files with 17 additions and 6 deletions

View File

@@ -1,4 +1,4 @@
<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M1 5C1 2.79086 2.79086 1 5 1H27C29.2091 1 31 2.79086 31 5V27C31 29.2091 29.2091 31 27 31H5C2.79086 31 1 29.2091 1 27V5Z" fill="#7049CF"/>
<svg viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg" class="text-[#7049CF]">
<path d="M1 5C1 2.79086 2.79086 1 5 1H27C29.2091 1 31 2.79086 31 5V27C31 29.2091 29.2091 31 27 31H5C2.79086 31 1 29.2091 1 27V5Z" fill="currentColor"/>
<path d="M24 14.4V24H8L16 16L19.2 19.2L24 14.4ZM12.8 10.4C12.8 11.0365 12.5471 11.647 12.0971 12.0971C11.647 12.5471 11.0365 12.8 10.4 12.8C9.76348 12.8 9.15303 12.5471 8.70294 12.0971C8.25286 11.647 8 11.0365 8 10.4C8 9.76348 8.25286 9.15303 8.70294 8.70294C9.15303 8.25286 9.76348 8 10.4 8C11.0365 8 11.647 8.25286 12.0971 8.70294C12.5471 9.15303 12.8 9.76348 12.8 10.4Z" fill="white"/>
</svg>

Before

Width:  |  Height:  |  Size: 616 B

After

Width:  |  Height:  |  Size: 644 B

View File

@@ -1 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor" class="bi bi-file-image"><path d="M8.002 5.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0z"/><path d="M12 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2zM3 2a1 1 0 0 1 1-1h8a1 1 0 0 1 1 1v8l-2.083-2.083a.5.5 0 0 0-.76.063L8 11 5.835 9.7a.5.5 0 0 0-.611.076L3 12V2z"/></svg>

Before

Width:  |  Height:  |  Size: 364 B

View File

@@ -1,3 +1,9 @@
export function GetRemoteImageBlock(onSelect: () => void) {
return { name: 'Image from URL', iconName: 'file-image', keywords: ['image', 'url'], onSelect }
return {
name: 'Image from URL',
iconName: 'file-image',
iconClassName: '!text-current',
keywords: ['image', 'url'],
onSelect,
}
}

View File

@@ -65,7 +65,13 @@ const MobileToolbarPlugin = () => {
}, [editor])
const items = useMemo(
() => [
(): {
name: string
iconName: string
iconClassName?: string
keywords?: string[]
onSelect: () => void
}[] => [
{
name: 'Bold',
iconName: 'bold',
@@ -222,7 +228,7 @@ const MobileToolbarPlugin = () => {
onClick={item.onSelect}
key={item.name}
>
<Icon type={item.iconName} size="medium" />
<Icon type={item.iconName} size="medium" className={item.iconClassName} />
</button>
)
})}