diff --git a/html/channel.ejs b/html/channel.ejs index 899fe4d0..cba349df 100644 --- a/html/channel.ejs +++ b/html/channel.ejs @@ -377,6 +377,28 @@ text-transform:uppercase; .subs { margin: 0.6em;text-align: left;margin-left: 0px;margin-top: -1em;font-family: "PokeTube flex";font-weight: 1000;font-stretch: ultra-expanded; } + #popup-container { + display: none; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + background-color: #111; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); + padding: 20px; + border-radius: 8px; + z-index: 1; + width: 45em; + height: 24em; + } + #close-btn { + cursor: pointer; + position: absolute; + top: 10px; + right: 10px; + font-size: 18px; + color: #555; + } .video-grid { display: flex; flex-wrap: wrap; @@ -453,6 +475,8 @@ color:#ea9999 !important; .channel-info{ text-align:center; } + + .sticky-top { position: sticky; top: 0px; @@ -561,6 +585,16 @@ color:#ea9999 !important; <% } %> + + <% } %> + <% if (isMobile) { %> @@ -639,7 +673,7 @@ color:#ea9999 !important; <% try { %> <%- getFirstLine(cinv.description).slice(0, 60) %> - + <% } catch (error) { %>

Error: <%= error.message %>

@@ -1445,7 +1479,17 @@ document.getElementById('search').addEventListener('keyup', function () { } }); }); - + + document.getElementById('popup-trigger').addEventListener('click', function (event) { + event.preventDefault(); + document.getElementById('popup-container').style.display = 'block'; + document.body.style.overflow = 'hidden'; + }); + + function closePopup() { + document.getElementById('popup-container').style.display = 'none'; + document.body.style.overflow = 'auto'; + } // @license-end