Improve play button

This commit is contained in:
Zed 2019-08-19 21:27:28 +02:00
parent 59469da857
commit 8b31f58998
2 changed files with 16 additions and 6 deletions

View File

@ -1035,7 +1035,7 @@ video, .video-container img {
opacity: 0.8;
}
.card-overlay-circle {
.overlay-circle {
border-radius: 50%;
background-color: #404040;
width: 40px;
@ -1047,7 +1047,7 @@ video, .video-container img {
border-style: solid;
}
.card-overlay-triangle {
.overlay-triangle {
width: 0;
height: 0;
border-style: solid;
@ -1056,6 +1056,16 @@ video, .video-container img {
margin-left: 14px;
}
.card-overlay:hover .overlay-circle,
.video-overlay:hover .overlay-circle {
border-color: #ff6c60;
}
.card-overlay:hover .overlay-triangle,
.video-overlay:hover .overlay-triangle {
border-color: transparent transparent transparent #ff6c60;
}
.poll-meter {
overflow: hidden;
position: relative;

View File

@ -78,8 +78,8 @@ proc renderVideo(video: Video; prefs: Prefs): VNode =
of m3u8, vmap:
video(poster=thumb, data-url=source, data-autoload="false")
verbatim "<div class=\"video-overlay\" onclick=\"playVideo(this)\">"
verbatim "<div class=\"card-overlay-circle\">"
verbatim "<span class=\"card-overlay-triangle\"</span></div></div>"
verbatim "<div class=\"overlay-circle\">"
verbatim "<span class=\"overlay-triangle\"</span></div></div>"
else:
renderVideoDisabled(video)
@ -114,8 +114,8 @@ proc renderCardImage(card: Card): VNode =
img(src=getSigUrl(get(card.image), "pic"))
if card.kind == player:
tdiv(class="card-overlay"):
tdiv(class="card-overlay-circle"):
span(class="card-overlay-triangle")
tdiv(class="overlay-circle"):
span(class="overlay-triangle")
proc renderCardContent(card: Card): VNode =
buildHtml(tdiv(class="card-content")):