Fix toolbar CSS: force bottom:0 to prevent off-screen hiding on mobile

The .new-toolbox element was positioned at bottom:-96px by default and
only shown via .visible class on mouse activity. Mobile has no hover,
so toolbar was permanently hidden. Force bottom:0 with !important.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Jeff Emmett 2026-03-12 06:19:49 +00:00
parent 3f5899070f
commit 0550308450
1 changed files with 13 additions and 6 deletions

View File

@ -1,19 +1,26 @@
<!-- Load custom CSS after Jitsi CSS --> <!-- Load custom CSS after Jitsi CSS -->
<link rel="stylesheet" href="css/custom/custom.css"> <link rel="stylesheet" href="css/custom/custom.css">
<style> <style>
/* Force toolbar visible on mobile - override auto-hide */ /* Force toolbar always visible on mobile and desktop */
.new-toolbox { .new-toolbox {
visibility: visible !important; bottom: 0 !important;
opacity: 1 !important; opacity: 1 !important;
visibility: visible !important;
pointer-events: auto !important; pointer-events: auto !important;
transition: none !important;
} }
.new-toolbox .toolbox-content-wrapper {
opacity: 1 !important;
visibility: visible !important;
}
.new-toolbox .toolbox-content-items {
opacity: 1 !important;
visibility: visible !important;
}
/* Ensure mobile toolbar shows */
.toolbox-content-mobile { .toolbox-content-mobile {
display: flex !important; display: flex !important;
visibility: visible !important;
opacity: 1 !important; opacity: 1 !important;
}
.toolbox-content-items {
visibility: visible !important; visibility: visible !important;
opacity: 1 !important;
} }
</style> </style>