Mirrors/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2025-12-16 11:57:51 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix: horizontal scroll issue on mobile

Browse Source 
#1854
This commit is contained in:
Timothy J. Baek
2024-04-30 15:08:34 -07:00
parent 35437fb3a3
commit 27ff386115
2 changed files with 18 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/lib/components/layout/Sidebar.svelte
View File

@@ -53,28 +53,29 @@
show = window.innerWidth > BREAKPOINT;
await chats.set(await getChatList(localStorage.token));
let touchstartX = 0;
let touchendX = 0;
let touchstart;
let touchend;
function checkDirection() {
const screenWidth = window.innerWidth;
const swipeDistance = Math.abs(touchendX - touchstartX);
if (swipeDistance >= screenWidth / 4) {
if (touchendX < touchstartX) {
const swipeDistance = Math.abs(touchend.screenX - touchstart.screenX);
if (touchstart.clientX < 40 && swipeDistance >= screenWidth / 4) {
if (touchend.screenX < touchstart.screenX) {
show = false;
}
if (touchendX > touchstartX) {
if (touchend.screenX > touchstart.screenX) {
show = true;
}
}
}
const onTouchStart = (e) => {
touchstartX = e.changedTouches[0].screenX;
touchstart = e.changedTouches[0];
console.log(touchstart.clientX);
};
const onTouchEnd = (e) => {
touchendX = e.changedTouches[0].screenX;
touchend = e.changedTouches[0];
checkDirection();
};
@@ -84,14 +85,14 @@
}
};
document.addEventListener('touchstart', onTouchStart);
document.addEventListener('touchend', onTouchEnd);
window.addEventListener('touchstart', onTouchStart);
window.addEventListener('touchend', onTouchEnd);
window.addEventListener('resize', onResize);
return () => {
document.removeEventListener('touchstart', onTouchStart);
document.removeEventListener('touchend', onTouchEnd);
document.removeEventListener('resize', onResize);
window.removeEventListener('touchstart', onTouchStart);
window.removeEventListener('touchend', onTouchEnd);
window.removeEventListener('resize', onResize);
};
});