Disable ColorButtons for Codable

This commit is contained in:
Henrik Giesel 2021-06-18 01:44:15 +02:00
parent c23665cf63
commit 2322d170fc

View file

@ -11,6 +11,7 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
import ColorPicker from "components/ColorPicker.svelte";
import WithShortcut from "components/WithShortcut.svelte";
import WithColorHelper from "./WithColorHelper.svelte";
import OnlyEditable from "./OnlyEditable.svelte";
import { textColorIcon, highlightColorIcon, arrowIcon } from "./icons";
import { appendInParentheses } from "./helpers";
@ -28,51 +29,61 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<ButtonGroup {api}>
<WithColorHelper let:colorHelperIcon let:color let:setColor>
<ButtonGroupItem>
<WithShortcut shortcut={"F7"} let:createShortcut let:shortcutLabel>
<IconButton
tooltip={appendInParentheses(
tr.editingSetForegroundColor(),
shortcutLabel
)}
on:click={wrapWithForecolor(color)}
on:mount={createShortcut}
>
{@html textColorIcon}
{@html colorHelperIcon}
</IconButton>
</WithShortcut>
</ButtonGroupItem>
<OnlyEditable let:disabled>
<ButtonGroupItem>
<WithShortcut shortcut={"F7"} let:createShortcut let:shortcutLabel>
<IconButton
tooltip={appendInParentheses(
tr.editingSetForegroundColor(),
shortcutLabel
)}
{disabled}
on:click={wrapWithForecolor(color)}
on:mount={createShortcut}
>
{@html textColorIcon}
{@html colorHelperIcon}
</IconButton>
</WithShortcut>
</ButtonGroupItem>
<ButtonGroupItem>
<WithShortcut shortcut={"F8"} let:createShortcut let:shortcutLabel>
<IconButton
tooltip={appendInParentheses(
tr.editingChangeColor(),
shortcutLabel
)}
widthMultiplier={0.5}
>
{@html arrowIcon}
<ColorPicker on:change={setColor} on:mount={createShortcut} />
</IconButton>
</WithShortcut>
</ButtonGroupItem>
<ButtonGroupItem>
<WithShortcut shortcut={"F8"} let:createShortcut let:shortcutLabel>
<IconButton
tooltip={appendInParentheses(
tr.editingChangeColor(),
shortcutLabel
)}
{disabled}
widthMultiplier={0.5}
>
{@html arrowIcon}
<ColorPicker on:change={setColor} on:mount={createShortcut} />
</IconButton>
</WithShortcut>
</ButtonGroupItem>
</OnlyEditable>
</WithColorHelper>
<WithColorHelper let:colorHelperIcon let:color let:setColor>
<ButtonGroupItem>
<IconButton on:click={wrapWithBackcolor(color)}>
{@html highlightColorIcon}
{@html colorHelperIcon}
</IconButton>
</ButtonGroupItem>
<OnlyEditable let:disabled>
<ButtonGroupItem>
<IconButton on:click={wrapWithBackcolor(color)} {disabled}>
{@html highlightColorIcon}
{@html colorHelperIcon}
</IconButton>
</ButtonGroupItem>
<ButtonGroupItem>
<IconButton tooltip={tr.editingChangeColor()} widthMultiplier={0.5}>
{@html arrowIcon}
<ColorPicker on:change={setColor} />
</IconButton>
</ButtonGroupItem>
<ButtonGroupItem>
<IconButton
tooltip={tr.editingChangeColor()}
widthMultiplier={0.5}
{disabled}
>
{@html arrowIcon}
<ColorPicker on:change={setColor} />
</IconButton>
</ButtonGroupItem>
</OnlyEditable>
</WithColorHelper>
</ButtonGroup>