make video boxes closer to figma design

This commit is contained in:
2022-01-06 17:38:36 +05:00
parent 2442944d69
commit ed3eefdd0a
4 changed files with 38 additions and 13 deletions

View File

@ -542,7 +542,6 @@ input:checked + label +.calendar-location+.description {
}
.metadata label {
text-align: center;
vertical-align: sub;
flex-grow: 1;
font-weight: normal;

View File

@ -4,9 +4,9 @@
}
.video-box {
border:2px solid var(--tv-dark);
max-width:560px;
margin:auto;
border-top: 1px solid var(--tv-dark);
max-width: 560px;
margin: auto;
margin-bottom: 2em;
color: var(--tv-dark);
}
@ -124,8 +124,8 @@ input:checked + label + .video.date +.description {
.video-thumbnail-duration-overlay {
display: inline-block;
background-color: var(--tv-light);
color: chocolate;
background-color: var(--tv-dark);
color: white;
font-size: 14px;
line-height: 1.1;
z-index: 10;
@ -157,3 +157,25 @@ input:checked + label + .video.date +.description {
.video-thumbnail:hover .play-overlay .play-icon {
transform:translate(-50%,-50%) scale(1);
}
.video-box .dot {
fill: var(--tv-dark);
}
.video.channel a {
width: max-content;
background: var(--tv-dark);
padding: 0.5em;
position: relative;
bottom: 19px;
z-index: 1;
transform: rotate(2deg);
color: white;
}
.video.channel {
background: var(--tv-light);
display: flex;
justify-content: center;
border: none;
}