Show Full-Video Labels on thumbnails

Co-authored-by: mini-bomba <mini-bomba@users.noreply.github.com>
This commit is contained in:
Ajay
2023-03-10 03:49:01 -05:00
parent 3ace3b9650
commit 758f0b7526
8 changed files with 278 additions and 30 deletions

View File

@@ -803,3 +803,42 @@ input::-webkit-inner-spin-button {
color: #fff;
opacity: .7;
}
/* full video labels on thumbnails */
.sponsorThumbnailLabel {
display: none;
position: absolute;
top: 0;
left: 0;
padding: 0.5em;
margin: 0.5em;
border-radius: 2em;
z-index: 1000;
background-color: var(--category-color, #000);
opacity: 70%;
box-shadow: 0 0 8px 2px #333;
}
.sponsorThumbnailLabel.sponsorThumbnailLabelVisible {
display: flex;
}
.sponsorThumbnailLabel svg {
height: 2em;
fill: var(--category-text-color, #fff);
}
.sponsorThumbnailLabel span {
display: none;
padding-left: 0.25em;
font-size: 1.5em;
color: var(--category-text-color, #fff);
}
.sponsorThumbnailLabel:hover {
border-radius: 0.25em;
}
.sponsorThumbnailLabel:hover span {
display: inline;
}