diff options
Diffstat (limited to 'yt_watch_template.html')
| -rw-r--r-- | yt_watch_template.html | 35 |
1 files changed, 32 insertions, 3 deletions
diff --git a/yt_watch_template.html b/yt_watch_template.html index f78f7e8..7d5f4ae 100644 --- a/yt_watch_template.html +++ b/yt_watch_template.html @@ -48,6 +48,35 @@ #related .medium-item{ grid-template-columns: 160px 1fr 0fr; } + + .download-dropdown{ + z-index:1; + justify-self:start; + min-width:0px; + } + + .download-dropdown-label{ + background-color: #e9e9e9; + border-style: outset; + border-width: 2px; + font-weight: bold; + } + + .download-dropdown-content{ + display:none; + background-color: #e9e9e9; + } + .download-dropdown:hover .download-dropdown-content { + display: grid; + grid-auto-rows:30px; + padding-bottom: 50px; + } + .download-dropdown-content a{ + white-space: nowrap; + display:grid; + grid-template-columns: 60px 90px auto; + max-height: 1.2em; + } </style> </head> <body> @@ -68,9 +97,9 @@ $video_sources <time datetime="$upload_date">Published on $upload_date</time> <span class="likes-dislikes">$likes likes $dislikes dislikes</span> - <div class="dropdown"> - <button class="dropdown-label">Download</button> - <div class="dropdown-content"> + <div class="download-dropdown"> + <button class="download-dropdown-label">Download</button> + <div class="download-dropdown-content"> $download_options </div> </div> |