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

Design patch 7 (#1286)

Browse source 
* Adjust thumbnail hover effect

* Increase thumbnail border transparency
This commit is contained in:
Rave | 図書館猫 2022-04-05 16:59:38 +02:00 committed by GitHub
parent 63079638a4
commit a0254740bc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
ui/component/fileWatchLaterLink/view.jsx
View file

@ -36,7 +36,7 @@ function FileWatchLaterLink(props: Props) {
const title = hasClaimInWatchLater ? __('Remove from Watch Later') : __('Add to Watch Later');
// label that is shown after hover
const label = !hasClaimInWatchLater ? __('Add') : __('Added');
const label = !hasClaimInWatchLater ? __('Watch later') : __('Remove');
return (
<Button

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

@ -378,7 +378,7 @@
flex-shrink: 0;
margin-right: var(--spacing-s);
box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.3) inset;
box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.2) inset;
}
.media__thumb-placeholder-text {
@ -1290,19 +1290,25 @@ $claim-preview-progress-bar-height: 5px;
.button--file-action {
width: auto;
max-width: 25.59px;
transition: max-width 0.1s;
transition: max-width 0.2s;
padding: 0.3rem !important;
.button__content {
flex-direction: row-reverse;
}
.button__label {
margin-top: 0;
margin-top: -1px;
padding-top: 0px;
margin-bottom: -4px;
margin-left: var(--spacing-xxs);
margin-left: 4px;
margin-right: var(--spacing-xxs);
text-overflow: hidden;
}
&:hover {
width: auto;
max-width: 60px;
min-width: 25.59px;
max-width: 140px;
}
}
}

2
ui/scss/component/_media.scss
View file

@ -10,7 +10,7 @@
background-position: center;
background-repeat: no-repeat;
background-size: cover;
box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.3) inset;
box-shadow: 0px 0px 0px 1px rgba(var(--color-primary-dynamic), 0.2) inset;
}
// M E D I A