Skip to content

Commit a01a0e7

Browse files
committed
fix: Display focus rings on flyout buttons and labels
1 parent 15a4d50 commit a01a0e7

File tree

1 file changed

+11
-0
lines changed

1 file changed

+11
-0
lines changed

packages/blockly/core/css.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -648,4 +648,15 @@ input[type=number] {
648648
stroke: var(--blockly-active-node-color);
649649
stroke-width: var(--blockly-selection-width);
650650
}
651+
/* Flyout buttons and labels */
652+
.blocklyKeyboardNavigation .blocklyFlyout .blocklyFlyoutLabel.blocklyActiveFocus,
653+
.blocklyKeyboardNavigation .blocklyFlyout .blocklyFlyoutButton.blocklyActiveFocus {
654+
outline: none;
655+
}
656+
.blocklyKeyboardNavigation .blocklyFlyout .blocklyFlyoutLabel.blocklyActiveFocus > .blocklyFlyoutLabelText,
657+
.blocklyKeyboardNavigation .blocklyFlyout .blocklyFlyoutButton.blocklyActiveFocus > .blocklyFlyoutButtonBackground {
658+
outline-offset: 2px;
659+
outline: var(--blockly-selection-width) solid var(--blockly-active-node-color);
660+
border-radius: 2px;
661+
}
651662
`;

0 commit comments

Comments
 (0)