hendrik/lens
1
0 Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Keeping Icon focus state only for keyboard (#1234)

Browse Source 
* Passing toolbar prop into action menus

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Toggling .mouse-intent

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Icon focus restyling

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

* Adding what-input dependency

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>
This commit is contained in:
Alex Andreev authored and GitHub committed 2020-11-10 12:36:06 +03:00
1 parent 14e83a4b2a
commit b2f3cdd0d2
7 files changed
+26 -6
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/renderer/components/icon/icon.scss
+12 -3
View File
@@ -5,6 +5,7 @@
--big-size: 32px;
--color-active: #{$iconActiveColor};
--bgc-active: #{$iconActiveBackground};
--focus-color: var(--icon-focus-color, #{$lensBlue});
display: inline-flex;
flex-shrink: 0;
@@ -106,7 +107,7 @@
&.active {
color: var(--color-active);
box-shadow: 0 0 0 3px $iconActiveBackground;
box-shadow: 0 0 0 2px $iconActiveBackground;
background-color: $iconActiveBackground;
}
@@ -115,8 +116,16 @@
transition: 250ms color, 250ms opacity, 150ms background-color, 150ms box-shadow;
border-radius: 50%;
&.focusable:focus {
@extend .active;
&.focusable:focus:not(:hover) {
box-shadow: 0 0 0 2px var(--focus-color);
[data-whatintent='mouse'] & {
box-shadow: none;
&.active {
box-shadow: 0 0 0 2px $iconActiveBackground;
}
}
}
&:hover {