From 6aa3c301e37a9cdc449dda0fa8af5be4fbf03d01 Mon Sep 17 00:00:00 2001
From: Essem <smswessem@gmail.com>
Date: Thu, 1 Jun 2023 16:21:06 -0500
Subject: [PATCH] Attempt to split column scrolling

---
 packages/client/src/init.ts          |  1 +
 packages/client/src/style.scss       |  1 +
 packages/client/src/ui/universal.vue | 20 ++++++--------------
 3 files changed, 8 insertions(+), 14 deletions(-)

diff --git a/packages/client/src/init.ts b/packages/client/src/init.ts
index 5d9ae12f36..13d3d31b16 100644
--- a/packages/client/src/init.ts
+++ b/packages/client/src/init.ts
@@ -219,6 +219,7 @@ import { getAccountFromId } from "@/scripts/get-account-from-id";
 
 		const rootEl = document.createElement("div");
 		rootEl.id = MISSKEY_MOUNT_DIV_ID;
+		rootEl.style.height = "100%";
 		document.body.appendChild(rootEl);
 		return rootEl;
 	})();
diff --git a/packages/client/src/style.scss b/packages/client/src/style.scss
index eefa610d00..454751da3c 100644
--- a/packages/client/src/style.scss
+++ b/packages/client/src/style.scss
@@ -111,6 +111,7 @@ html._themeChanging_ {
 html, body {
 	margin: 0;
 	padding: 0;
+	height: 100%;
 }
 
 .swiper-slide {
diff --git a/packages/client/src/ui/universal.vue b/packages/client/src/ui/universal.vue
index eb2857b2f5..ff942c5f73 100644
--- a/packages/client/src/ui/universal.vue
+++ b/packages/client/src/ui/universal.vue
@@ -20,7 +20,7 @@
 		</MkStickyContainer>
 
 		<div v-if="isDesktop" ref="widgetsEl" class="widgets">
-			<XWidgets @mounted="attachSticky" />
+			<XWidgets />
 		</div>
 
 		<button
@@ -380,17 +380,6 @@ const onContextmenu = (ev: MouseEvent) => {
 	);
 };
 
-const attachSticky = (el: any) => {
-	const sticky = new StickySidebar(widgetsEl);
-	window.addEventListener(
-		"scroll",
-		() => {
-			sticky.calc(window.scrollY);
-		},
-		{ passive: true }
-	);
-};
-
 function top() {
 	window.scroll({ top: 0, behavior: "smooth" });
 }
@@ -451,7 +440,7 @@ console.log(mainRouter.currentRoute.value.name);
 	$widgets-hide-threshold: 1090px;
 
 	// ほんとは単に 100vh と書きたいところだが... https://css-tricks.com/the-trick-to-viewport-units-on-mobile/
-	min-height: calc(var(--vh, 1vh) * 100);
+	height: 100%;
 	box-sizing: border-box;
 	display: flex;
 
@@ -534,7 +523,7 @@ console.log(mainRouter.currentRoute.value.name);
 			width: 750px;
 			background: var(--panel);
 			border-radius: 0;
-			overflow: clip;
+			overflow: auto;
 			--margin: 12px;
 			background: var(--bg);
 		}
@@ -554,6 +543,7 @@ console.log(mainRouter.currentRoute.value.name);
 	> .contents {
 		width: 100%;
 		min-width: 0;
+		overflow: auto;
 		$widgets-hide-threshold: 1090px;
 		@media (max-width: $widgets-hide-threshold) {
 			padding-bottom: calc(env(safe-area-inset-bottom, 0px) + 96px);
@@ -563,7 +553,9 @@ console.log(mainRouter.currentRoute.value.name);
 	> .widgets {
 		padding: 0 var(--margin);
 		width: 300px;
+		flex: 0 0 auto;
 		box-sizing: content-box;
+		overflow: auto;
 
 		@media (max-width: $widgets-hide-threshold) {
 			display: none;