Fix corner rounding of alignment buttons in editor (#2989)

* Fix corner rounding of alignment buttons in editor

* Fix formatting

* Fix cascading button-rounding issues
This commit is contained in:
Lucas Scharenbroch 2024-02-06 21:11:14 -06:00 committed by GitHub
parent 312d396505
commit 146a3d936e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 40 additions and 26 deletions

View file

@ -158,6 +158,7 @@ Viktor Ricci <ricci@primateer.de>
Harvey Randall <harveyrandall2001@gmail.com> Harvey Randall <harveyrandall2001@gmail.com>
Pedro Lameiras <pedrolameiras@tecnico.ulisboa.pt> Pedro Lameiras <pedrolameiras@tecnico.ulisboa.pt>
Kai Knoblich <kai@FreeBSD.org> Kai Knoblich <kai@FreeBSD.org>
Lucas Scharenbroch <lucasscharenbroch@gmail.com>
******************** ********************

View file

@ -127,36 +127,49 @@ License: GNU AGPL, version 3 or later; http://www.gnu.org/licenses/agpl.html
<Popover slot="floating" --popover-padding-inline="0"> <Popover slot="floating" --popover-padding-inline="0">
<ButtonToolbar wrap={false}> <ButtonToolbar wrap={false}>
<ButtonGroup> <ButtonGroup>
<CommandIconButton <DynamicallySlottable
key="justifyLeft" slotHost={ButtonGroupItem}
tooltip={tr.editingAlignLeft()} {createProps}
--border-left-radius="5px" {updatePropsList}
--border-right-radius="0px" {setSlotHostContext}
{api}
> >
{@html justifyLeftIcon} <ButtonGroupItem>
</CommandIconButton> <CommandIconButton
key="justifyLeft"
tooltip={tr.editingAlignLeft()}
>
{@html justifyLeftIcon}
</CommandIconButton>
</ButtonGroupItem>
<CommandIconButton <ButtonGroupItem>
key="justifyCenter" <CommandIconButton
tooltip={tr.editingCenter()} key="justifyCenter"
> tooltip={tr.editingCenter()}
{@html justifyCenterIcon} >
</CommandIconButton> {@html justifyCenterIcon}
</CommandIconButton>
</ButtonGroupItem>
<CommandIconButton <ButtonGroupItem>
key="justifyRight" <CommandIconButton
tooltip={tr.editingAlignRight()} key="justifyRight"
> tooltip={tr.editingAlignRight()}
{@html justifyRightIcon} >
</CommandIconButton> {@html justifyRightIcon}
</CommandIconButton>
</ButtonGroupItem>
<CommandIconButton <ButtonGroupItem>
key="justifyFull" <CommandIconButton
tooltip={tr.editingJustify()} key="justifyFull"
--border-right-radius="5px" tooltip={tr.editingJustify()}
> >
{@html justifyFullIcon} {@html justifyFullIcon}
</CommandIconButton> </CommandIconButton>
</ButtonGroupItem>
</DynamicallySlottable>
</ButtonGroup> </ButtonGroup>
<ButtonGroup> <ButtonGroup>