| @@ -29,9 +29,9 @@ | ||
| 29 | 29 | return ( |
| 30 | 30 | <BaseControl id="code-block-pro-show-highlighting"> |
| 31 | 31 | <CheckboxControl |
| 32 | 32 | data-cy="enable-highlighting" |
| 33 | - label={__('Enable line highlighting', 'code-block-pro')} | |
| 33 | + label={__('Line highlights', 'code-block-pro')} | |
| 34 | 34 | help={__( |
| 35 | 35 | 'Highlight individual lines to bring attention to specific code.', |
| 36 | 36 | 'code-block-pro', |
| 37 | 37 | )} |
| @@ -66,7 +66,19 @@ | ||
| 66 | 66 | /> |
| 67 | 67 | </div> |
| 68 | 68 | </BaseControl> |
| 69 | 69 | )} |
| 70 | + <CheckboxControl | |
| 71 | + data-cy="enable-highlighting-hover" | |
| 72 | + label={__('Line highlights on hover', 'code-block-pro')} | |
| 73 | + help={__( | |
| 74 | + 'Every line will be highlighted when hovered.', | |
| 75 | + 'code-block-pro', | |
| 76 | + )} | |
| 77 | + checked={attributes.highlightingHover ?? false} | |
| 78 | + onChange={(highlightingHover) => { | |
| 79 | + setAttributes({ highlightingHover }); | |
| 80 | + }} | |
| 81 | + /> | |
| 70 | 82 | </BaseControl> |
| 71 | 83 | ); |
| 72 | 84 | }; |