diff --git a/src/components/ActionsGroup/ActionsGroup.less b/src/components/ActionsGroup/ActionsGroup.less index 09e903435..b360ebdad 100644 --- a/src/components/ActionsGroup/ActionsGroup.less +++ b/src/components/ActionsGroup/ActionsGroup.less @@ -27,18 +27,27 @@ width: @width; padding: 0 1rem; cursor: pointer; + border-radius: 2rem; + outline: none; .icon { width: calc(@width / 2); height: calc(@height / 2); color: var(--primary-foreground-color); opacity: 0.7; + } - &:hover { + &:hover, &:focus { + .icon { opacity: 1; } } + &:focus-visible { + outline: 2px solid var(--primary-foreground-color); + outline-offset: -2px; + } + &.disabled { pointer-events: none; } diff --git a/src/components/ActionsGroup/ActionsGroup.tsx b/src/components/ActionsGroup/ActionsGroup.tsx index 052f25016..844efd3d0 100644 --- a/src/components/ActionsGroup/ActionsGroup.tsx +++ b/src/components/ActionsGroup/ActionsGroup.tsx @@ -28,6 +28,7 @@ const ActionsGroup = ({ items, className }: Props) => {
{