LBRYCommunity/lbry-desktop
1
0
Fork 0
Code Issues 596 Pull requests 6 Projects Releases 238 Packages Wiki Activity

Fix hover bug on iPad requiring double click (1545)

Browse source
This commit is contained in:
Anthony 2022-05-25 09:21:12 +08:00 committed by infinite-persistence
commit 58270ab758
No known key found for this signature in database
GPG key ID: B9C3252EDC3D0AA0
1 changed files with 55 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

101
ui/scss/component/_claim-list.scss
View file

@ -250,9 +250,11 @@
} }
} }
&:hover { @media (any-pointer: fine) {
.claim__menu-button { &:hover {
opacity: 1; .claim__menu-button {
opacity: 1;
}
} }
} }
@ -410,31 +412,34 @@
@include handleChannelGif(6rem); @include handleChannelGif(6rem);
} }
// show watch later button and duration divs when hovered // any-pointer media query prevents double click hover bug on ipad
&:hover { @media (any-pointer: fine) {
.media__thumb { // show watch later button and duration divs when hovered
box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset; &:hover {
} .media__thumb {
.claim-preview__title { box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset;
color: var(--color-link); }
} .claim-preview__title {
.claim-preview__hover-actions { color: var(--color-link);
display: block; }
} .claim-preview__hover-actions {
.claim-preview__file-property-overlay { display: block;
opacity: 1; }
} .claim-preview__file-property-overlay {
.button--file-action { opacity: 1;
.icon { }
stroke: #f3f4f6; .button--file-action {
.icon {
stroke: #f3f4f6;
}
}
.ff-canvas {
opacity: 0 !important;
transition: opacity 1s !important;
}
.ff-image {
opacity: 1 !important;
} }
}
.ff-canvas {
opacity: 0 !important;
transition: opacity 1s !important;
}
.ff-image {
opacity: 1 !important;
} }
} }
@ -970,24 +975,26 @@
} }
} }
&:hover { @media (any-pointer: fine) {
cursor: pointer; &:hover {
cursor: pointer;
.media__thumb { .media__thumb {
box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset; box-shadow: 0 0 0 1px rgba(var(--color-primary-dynamic), 1) inset;
background-size: 108%; background-size: 108%;
} }
.claim-tile__title { .claim-tile__title {
color: var(--color-link); color: var(--color-link);
} }
.claim__menu-button { .claim__menu-button {
opacity: 1; opacity: 1;
} }
.collection-preview__overlay-thumbs { .collection-preview__overlay-thumbs {
opacity: 1; opacity: 1;
transition: 0.3s; transition: 0.3s;
}
} }
} }
@ -1476,10 +1483,12 @@ $claim-preview-progress-bar-height: 5px;
} }
@media (min-width: $breakpoint-small) { @media (min-width: $breakpoint-small) {
.claim-preview--tile:not(:hover), @media (any-pointer: fine) {
.claim-preview__wrapper:not(:hover) { .claim-preview--tile:not(:hover),
.claim__menu-button:not(:focus):not([aria-expanded='true']) { .claim-preview__wrapper:not(:hover) {
opacity: 0; .claim__menu-button:not(:focus):not([aria-expanded='true']) {
opacity: 0;
}
} }
} }
} }