From 6f56f68447351021fd48d37fbf22c0ff7e896f3f Mon Sep 17 00:00:00 2001
From: Thomas Hackl <hackl@data-quest.de>
Date: Mon, 17 Jul 2023 08:47:08 +0000
Subject: [PATCH] =?UTF-8?q?Resolve=20"Forum:=20Schreiben=20von=20Beitr?=
=?UTF-8?q?=C3=A4gen=20kaputt"?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Closes #2919 and #2921
Merge request studip/studip!1968
---
.../assets/javascripts/bootstrap/sidebar.js | 2 +-
resources/assets/javascripts/lib/sidebar.js | 23 ++++++++-----------
.../assets/stylesheets/scss/sidebar.scss | 8 +++++--
3 files changed, 17 insertions(+), 16 deletions(-)
diff --git a/resources/assets/javascripts/bootstrap/sidebar.js b/resources/assets/javascripts/bootstrap/sidebar.js
index 5e89a7fc472..df21f16acf7 100644
--- a/resources/assets/javascripts/bootstrap/sidebar.js
+++ b/resources/assets/javascripts/bootstrap/sidebar.js
@@ -3,7 +3,6 @@ import eventBus from '../lib/event-bus.ts';
STUDIP.ready(() => {
// Manually nudge sidebar under main header.
STUDIP.Sidebar.place();
-
STUDIP.Sidebar.observeBody();
STUDIP.Sidebar.observeFooter();
STUDIP.Sidebar.observeSidebar();
@@ -11,4 +10,5 @@ STUDIP.ready(() => {
document.defaultView.addEventListener('resize',() => {
STUDIP.Sidebar.reset();
});
+
});
diff --git a/resources/assets/javascripts/lib/sidebar.js b/resources/assets/javascripts/lib/sidebar.js
index 17362fa017c..17c96b90a3b 100644
--- a/resources/assets/javascripts/lib/sidebar.js
+++ b/resources/assets/javascripts/lib/sidebar.js
@@ -22,7 +22,7 @@ const Sidebar = {
const sidebar = document.getElementById('sidebar');
if (sidebar) {
const sObserver = new IntersectionObserver(STUDIP.Sidebar.fits, options);
- sObserver.observe();
+ sObserver.observe(sidebar, options);
}
},
@@ -36,11 +36,11 @@ const Sidebar = {
for (const mutation of mutations) {
if ((!mutation.oldValue || mutation.oldValue.indexOf('fixed') === -1)
&& mutation.target.classList.contains('fixed')) {
- sidebar.classList.add('fixed');
sidebar.style.top = '';
+ sidebar.classList.add('fixed');
} else if (mutation.oldValue && mutation.oldValue.indexOf('fixed') !== -1
&& !mutation.target.classList.contains('fixed')) {
- sidebar.classList.remove('fixed');
+ STUDIP.Sidebar.reset();
}
}
});
@@ -64,17 +64,18 @@ const Sidebar = {
* Observe if the footer is visible in viewport.
*/
const fObserver = new IntersectionObserver(STUDIP.Sidebar.footerVisible, options);
- fObserver.observe(document.getElementById('main-footer'));
+ fObserver.observe(document.getElementById('main-footer'), options);
},
reset() {
const sidebar = document.getElementById('sidebar');
if (sidebar) {
- sidebar.classList.remove('oversized', 'adjusted', 'fixed');
+ sidebar.classList.remove('oversized', 'was-oversized', 'fixed');
sidebar.style.top = '';
+ STUDIP.Sidebar.place();
+ STUDIP.Sidebar.observeSidebar();
}
- STUDIP.Sidebar.observe();
},
fits(entries, observer) {
@@ -85,7 +86,7 @@ const Sidebar = {
if (entry.isIntersecting) {
sidebar.classList.remove('oversized');
} else {
- sidebar.classList.add('oversized', 'adjusted');
+ sidebar.classList.add('oversized', 'was-oversized');
}
});
}
@@ -97,13 +98,9 @@ const Sidebar = {
entries.forEach(entry => {
// Footer is visible on current page.
if (entry.isIntersecting) {
- if (sidebar.classList.contains('no-footer')) {
- sidebar.classList.remove('no-footer');
- }
+ sidebar.classList.remove('no-footer');
} else {
- if (!sidebar.classList.contains('no-footer')) {
- sidebar.classList.add('no-footer');
- }
+ sidebar.classList.add('no-footer');
}
});
}
diff --git a/resources/assets/stylesheets/scss/sidebar.scss b/resources/assets/stylesheets/scss/sidebar.scss
index 60114c7dbab..d03ede60577 100644
--- a/resources/assets/stylesheets/scss/sidebar.scss
+++ b/resources/assets/stylesheets/scss/sidebar.scss
@@ -1,7 +1,7 @@
#sidebar {
- background: $white;
border-left: 0;
display: inline-block;
+ height: max-content;
margin-bottom: $page-margin + 35px;
margin-top: 15px;
padding: 0 5px 7px 15px;
@@ -11,7 +11,11 @@
width: $sidebar-width;
z-index: 2;
- &.adjusted {
+ &.fixed {
+ top: 55px;
+ }
+
+ &.was-oversized {
height: calc(100vh - 265px);
position: fixed;
overflow-x: hidden;
--
GitLab