primer/css
1
1
Fork 0
mirror of https://github.com/primer/css.git synced 2024-12-23 22:24:11 +03:00
Code Issues Projects Releases Wiki Activity

hover interaction tests

Browse Source
This commit is contained in:
Katie Langerman 2022-08-05 16:15:13 +00:00
parent a981edd6ad
commit f89caeadf2
1 changed files with 13 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/actionlist/action-list-item.scss
View File

@ -623,6 +623,7 @@
position: absolute; position: absolute;
right: 0; right: 0;
top: 0; top: 0;
visibility: hidden;
&:hover, &:hover,
&:focus { &:focus {
@ -630,21 +631,18 @@
background-color: var(--color-action-list-item-default-hover-bg); background-color: var(--color-action-list-item-default-hover-bg);
border: $border-width $border-style var(--color-btn-hover-bg); border: $border-width $border-style var(--color-btn-hover-bg);
} }
}
&::before { .ActionList-item {
position: absolute; &:hover,
top: 50%; &:focus-within {
left: 50%; .ActionList-item-button {
width: 100%; visibility: visible;
height: 100%; }
min-height: 32px;
content: '';
transform: translateX(-50%) translateY(-50%);
background-color: aqua;
// background-color: var(--color-action-list-item-default-hover-bg);
// opacity: 0;
// transition: 0.2s cubic-bezier(0.3, 0, 0.5, 1);
// transition-property: opacity;
// visibility: hidden;
} }
} }
// notes to katie
// offer hover prop for leading/trailing action
// button styles
// sub-group items etc etc