X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fsass%2Fbootstrap.scss;h=259af7a779e4fa36ec0748c7e39ba4648c724f4e;hb=99fa338673bfbe8695c1b529dfa6345db3a15d39;hp=897182e538d0ef82d9fa747b0331c297a4744715;hpb=ed5bb517266c80904c44bf44a335f1003f5aa277;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/sass/bootstrap.scss b/client/src/sass/bootstrap.scss index 897182e53..259af7a77 100644 --- a/client/src/sass/bootstrap.scss +++ b/client/src/sass/bootstrap.scss @@ -27,15 +27,24 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/'; } /* rules for dropdowns excepts when in button group, to avoid impacting the dropdown-toggle */ -.dropdown:not(.btn-group):not(.dropdown-root):not(.action-dropdown):not(.input-group-prepend) { +.dropdown { z-index: z(dropdown) !important; +} - &.list-overflow-menu, - &.parent-entry { - z-index: z(header) - 1 !important; - } +.list-overflow-menu, +.parent-entry { + z-index: z(header) - 1 !important; +} + +.btn-group, +.dropdown-root, +.action-dropdown, +.input-group-prepend, +.column-toggle { + z-index: inherit !important; } + .dropdown-menu { z-index: z(dropdown) + 1 !important; @@ -147,8 +156,30 @@ $icon-font-path: '~@neos21/bootstrap3-glyphicons/assets/fonts/'; // On desktop browsers, make the content and header horizontally sticked to right not move when modal open and close .modal-open { overflow-y: scroll !important; // Make sure vertical scroll bar is always visible on desktop browsers to get disabled scrollbar effect - position: fixed; // Fix the body position to disable any scroll content - width: 100vw; // Make sure the content fits all the available width when position: fixed + width: 100vw; // Make sure the content fits all the available width +} + +// On touchscreen devices, simply overflow: hidden to avoid detached overlay on scroll +@media (hover: none) and (pointer: coarse) { + .modal-open, .menu-open { + overflow: hidden !important; + } + + // On touchscreen devices display content overlay when opened menu + .menu-open { + .main-col { + &::before { + background-color: black; + width: 100vw; + height: 100vh; + opacity: 0.75; + content: ''; + display: block; + position: fixed; + z-index: z('menu') - 1; + } + } + } } // Nav customizations @@ -310,6 +341,7 @@ ngb-tooltip-window { position: absolute; right: .5rem; height: 95%; + font-size: 14px; &:hover { color: rgba(0, 0, 0, 0.7);