mirror_php/moodle
1
0
Fork 0
mirror of https://github.com/moodle/moodle.git synced 2025-04-20 07:56:06 +02:00
Code Issues Projects Releases Wiki Activity

MDL-73771 theme: Fix scrollbar position

Browse Source
This commit is contained in:
Carlos Castillo 2023-03-08 09:15:41 -05:00
parent 449a8b0b31
commit f17b006dcb
6 changed files with 27 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
theme/boost/amd/build/drawers.min.js vendored
View File

File diff suppressed because one or more lines are too long

2
theme/boost/amd/build/drawers.min.js.map
View File

File diff suppressed because one or more lines are too long

16
theme/boost/amd/src/drawers.js
View File

@ -47,6 +47,7 @@ const CLASSES = {
SCROLLED: 'scrolled',
SHOW: 'show',
NOTINITIALISED: 'not-initialized',
TOGGLERIGHT: '.drawer-right-toggle',
};
/**
@ -589,6 +590,11 @@ const scroller = () => {
const body = document.querySelector('body');
const drawerLayout = document.querySelector(SELECTORS.CONTAINER);
if (drawerLayout) {
// If there is not visible scrollbar then remove extra margin from right drawer.
const drawerRight = document.querySelector(SELECTORS.CONTAINER + ' ' + CLASSES.TOGGLERIGHT);
if (!scrollbarVisible(drawerLayout) && drawerRight) {
drawerRight.style.marginRight = '0';
}
drawerLayout.addEventListener("scroll", () => {
if (drawerLayout.scrollTop >= window.innerHeight) {
body.classList.add(CLASSES.SCROLLED);
@ -599,6 +605,16 @@ const scroller = () => {
}
};
/**
* Check if there is a visible scrollbar in the given html element.
*
* @param {object} htmlNode The html element.
* @returns {boolean} true if the scroll height is greater than client height.
*/
const scrollbarVisible = (htmlNode) => {
return htmlNode.scrollHeight > htmlNode.clientHeight;
};
/**
* Set the last used attribute for the last used toggle button for a drawer.
*

3
theme/boost/scss/moodle/layout.scss
View File

@ -181,6 +181,9 @@
#page.drawers .main-inner {
margin-top: 1.5rem;
}
#page.drawers .drawer-right-toggle {
margin-right: 0.7rem;
}
}
@include media-breakpoint-up(md) {

4
theme/boost/style/moodle.css
View File

@ -20756,7 +20756,9 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
@media (min-width: 576px) {
#page.drawers .main-inner {
margin-top: 1.5rem; } }
margin-top: 1.5rem; }
#page.drawers .drawer-right-toggle {
margin-right: 0.7rem; } }
@media (min-width: 768px) {
#page.drawers {

4
theme/classic/style/moodle.css
View File

@ -20702,7 +20702,9 @@ span[data-flexitour="container"][x-placement="right"], span[data-flexitour="cont
@media (min-width: 576px) {
#page.drawers .main-inner {
margin-top: 1.5rem; } }
margin-top: 1.5rem; }
#page.drawers .drawer-right-toggle {
margin-right: 0.7rem; } }
@media (min-width: 768px) {
#page.drawers {