From acb7b5d37e9fe54fc97155de2f775b851ba93bb6 Mon Sep 17 00:00:00 2001 From: Justin Davidson Date: Fri, 7 Jul 2017 10:24:55 +1000 Subject: [PATCH] Add YouTube play icon to video thumbnail if thumbnail exists --- google-youtube.html | 27 +++++++++++++++++++++++++++ youtube-play-icon.svg | 39 +++++++++++++++++++++++++++++++++++++++ 2 files changed, 66 insertions(+) create mode 100644 youtube-play-icon.svg diff --git a/google-youtube.html b/google-youtube.html index 9d5dbd9..397ae0e 100755 --- a/google-youtube.html +++ b/google-youtube.html @@ -75,11 +75,38 @@ cursor: pointer; @apply(--google-youtube-thumbnail); } + + .playicon { + visibility: visible; + position: absolute; + left: 45%; + top: 44%; + width: 8vw; + max-width: 80px; + cursor: pointer; + z-index: 1; + opacity: 0.7; + transition: opacity 0.3s ease; + } + + .playicon:hover { + opacity: 1; + } + + @media screen and (max-width: 767px) { + .playicon { + left: 43%; + top: 37%; + width: 12vw; + max-width: 200px; + } + }