Make hover on watched video a smooth background transition #1750 (#1812)

* transition duration of 0.5s added to watched videos

* small code reformating

* extra white spaces deleted

* typo in the word transition corrected

* original whitespaces respected

* transition added when hovering end
This commit is contained in:
constraintAutomaton 2021-10-14 18:03:11 -04:00 committed by GitHub
parent abf7f10626
commit ad1fe0c9fb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 6 additions and 1 deletions

View File

@ -1,4 +1,5 @@
$thumbnail-overlay-opacity: 0.85 $thumbnail-overlay-opacity: 0.85
$watched-transition-duration: 0.5s
@mixin is-result @mixin is-result
@at-root @at-root
@ -26,9 +27,11 @@ $thumbnail-overlay-opacity: 0.85
@at-root @at-root
.watched &, .watched#{&} .watched &, .watched#{&}
color: var(--tertiary-text-color) color: var(--tertiary-text-color)
transition-duration: $watched-transition-duration
.watched:hover &, .watched:hover#{&} .watched:hover &, .watched:hover#{&}
color: $col color: $col
transition-duration: $watched-transition-duration
.ft-list-item .ft-list-item
padding: 6px padding: 6px
@ -39,9 +42,11 @@ $thumbnail-overlay-opacity: 0.85
.thumbnailImage .thumbnailImage
opacity: 0.3 opacity: 0.3
transition-duration: $watched-transition-duration
&:hover .thumbnailImage &:hover .thumbnailImage
opacity: 1 opacity: 1
transition-duration: $watched-transition-duration
.videoThumbnail .videoThumbnail
position: relative position: relative