diff --git a/components/disclaimer.html b/components/disclaimer.html index 72bb5b11..fe39512b 100644 --- a/components/disclaimer.html +++ b/components/disclaimer.html @@ -20,21 +20,18 @@ > diff --git a/css/style.css b/css/style.css index 9131c86d..bccc913b 100644 --- a/css/style.css +++ b/css/style.css @@ -484,27 +484,37 @@ footer a:hover { background-color: rgb(0 0 0 / 0.9); z-index: 50; /* remove display: none; */ + display: flex; flex-direction: column; overflow-y: auto; overscroll-behavior: contain; } +#disclaimerModal.hidden { + display: none !important; +} + #disclaimerModal .modal-content { - width: 100%; + width: min(960px, calc(100% - 2rem)); + max-height: min(90vh, 820px); display: flex; flex-direction: column; background-color: var(--color-bg); + box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.45); } -#disclaimerModal .modal-scroll { +#disclaimerModal .modal-header { + min-height: 1.5rem; +} + +#disclaimerModal .modal-body { padding: 1.5rem; flex: 1; overflow-y: auto; } -/* Disclaimer Modal Button Container */ -#disclaimerModal .button-container { - padding: 1rem 1.5rem; +#disclaimerModal .modal-footer { + padding: 1.25rem 1.5rem 1.75rem; background-color: #1a2234; border-top: 1px solid rgba(255, 255, 255, 0.1); } @@ -517,9 +527,14 @@ footer a:hover { justify-content: center; } - #disclaimerModal .modal-scroll { + #disclaimerModal .modal-body { + padding: 2rem 2.5rem 1.5rem; max-height: calc(90vh - 5rem); } + + #disclaimerModal .modal-footer { + padding: 1.5rem 2.5rem 2rem; + } } /* Mobile-specific styles for Disclaimer Modal */ @@ -531,6 +546,17 @@ footer a:hover { #disclaimerModal .modal-content { min-height: 100vh; border-radius: 0; + max-height: none; + width: 100%; + } + + #disclaimerModal .modal-body { + padding: 1.5rem 1.5rem 1rem; + max-height: none; + } + + #disclaimerModal .modal-footer { + padding: 1rem 1.5rem 2rem; } } diff --git a/js/app.js b/js/app.js index 9d0fb2bb..8f3ec6f9 100644 --- a/js/app.js +++ b/js/app.js @@ -5265,6 +5265,8 @@ class bitvidApp { // Hide login button if present if (this.loginButton) { this.loginButton.classList.add("hidden"); + this.loginButton.setAttribute("hidden", ""); + this.loginButton.style.display = "none"; } // Optionally hide logout or userStatus if (this.logoutButton) { @@ -5277,9 +5279,13 @@ class bitvidApp { // Show the upload button, profile button, etc. if (this.uploadButton) { this.uploadButton.classList.remove("hidden"); + this.uploadButton.removeAttribute("hidden"); + this.uploadButton.style.display = "inline-flex"; } if (this.profileButton) { this.profileButton.classList.remove("hidden"); + this.profileButton.removeAttribute("hidden"); + this.profileButton.style.display = "inline-flex"; } // Show the "Subscriptions" link if it exists @@ -5313,6 +5319,8 @@ class bitvidApp { // Show the login button again if (this.loginButton) { this.loginButton.classList.remove("hidden"); + this.loginButton.removeAttribute("hidden"); + this.loginButton.style.display = ""; } // Hide logout or userStatus @@ -5329,9 +5337,13 @@ class bitvidApp { // Hide upload & profile if (this.uploadButton) { this.uploadButton.classList.add("hidden"); + this.uploadButton.setAttribute("hidden", ""); + this.uploadButton.style.display = "none"; } if (this.profileButton) { this.profileButton.classList.add("hidden"); + this.profileButton.setAttribute("hidden", ""); + this.profileButton.style.display = "none"; } if (this.profileChannelLink) { this.profileChannelLink.classList.add("hidden");