diff --git a/resources/assets/javascripts/bootstrap/fullscreen.js b/resources/assets/javascripts/bootstrap/fullscreen.js index 990eae7e8a0d1b985f6ad3fd2d41b505fcfb865c..e83e8273991b58ee8822d6ec22e2f1ec52e197fb 100644 --- a/resources/assets/javascripts/bootstrap/fullscreen.js +++ b/resources/assets/javascripts/bootstrap/fullscreen.js @@ -1,22 +1,28 @@ STUDIP.ready(() => { - $('#fullscreen-on').on('click', event => { + document.getElementById('fullscreen-on').addEventListener('click', event => { event.preventDefault(); STUDIP.Vue.emit('toggle-compact-navigation', true); }); - $('#fullscreen-off').on('click', event => { + + document.getElementById('fullscreen-off').addEventListener('click', event => { event.preventDefault(); STUDIP.Vue.emit('toggle-compact-navigation', false); - }); - $('#focusmode-on, .fullscreen-trigger').on('click', event => { - event.preventDefault(); - STUDIP.Fullscreen.activate(); - }); + }) + + for (const elem of document.querySelectorAll('#focusmode-on, .fullscreen-trigger')) { + elem.addEventListener('click', event => { + event.preventDefault(); + STUDIP.Fullscreen.activate(); + }); + } + // Listen for fullscreen exit, ending focus mode with it. document.addEventListener('fullscreenchange', event => { if (!document.fullscreenElement) { STUDIP.Fullscreen.deactivate(); } }); + // Fullscreen exit on Safari document.addEventListener('webkitfullscreenchange', event => { if (!document.webkitFullscreenElement) { diff --git a/resources/assets/stylesheets/scss/responsive.scss b/resources/assets/stylesheets/scss/responsive.scss index a1e09d412b6518d405c99fe30a9087c3b354cbdc..9267c8dd016eac3ec6def011b58d20d8f2ce895e 100644 --- a/resources/assets/stylesheets/scss/responsive.scss +++ b/resources/assets/stylesheets/scss/responsive.scss @@ -405,6 +405,7 @@ $sidebarOut: -330px; .contentbar-wrapper-left { flex: 1; + max-width: calc(100% - 70px); min-width: 0; & > .contentbar-icon { @@ -445,7 +446,17 @@ $sidebarOut: -330px; .cw-ribbon-tools { right: 0; - top: 96px; + top: 4px; + + .cw-tabs-nav { + height: 52px; + + button { + &.is-active::after { + margin-top: 10px; + } + } + } } } } @@ -453,7 +464,7 @@ $sidebarOut: -330px; #toc { position: absolute; right: -8px; - top: 82px; + top: -21px; } #toc_header { @@ -626,6 +637,28 @@ $sidebarOut: -330px; .cw-companion-box-wrapper { padding-top: 120px; } + + .cw-structural-element-consumemode { + position: unset; + + .cw-ribbon-wrapper-consume { + position: unset; + + .cw-ribbon-consume { + position: unset; + + .cw-ribbon-consume-bottom { + height: unset; + } + } + } + } + } + + #toc { + position: absolute; + right: -29px; + top: -25px; } }