From cc1b34d3e53d33ea94569af5ba4f1c9d6d23edf9 Mon Sep 17 00:00:00 2001
From: freeplay <freeplay@duck.com>
Date: Sun, 25 Jun 2023 18:19:37 -0400
Subject: [PATCH] feat: Make scrollable widgets flexible

---
 packages/client/src/components/MkContainer.vue | 1 +
 packages/client/src/components/MkWidgets.vue   | 5 ++++-
 packages/client/src/ui/universal.widgets.vue   | 8 +++++++-
 3 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/packages/client/src/components/MkContainer.vue b/packages/client/src/components/MkContainer.vue
index 62c198cb16..4c4e91160c 100644
--- a/packages/client/src/components/MkContainer.vue
+++ b/packages/client/src/components/MkContainer.vue
@@ -196,6 +196,7 @@ export default defineComponent({
 	&.scrollable {
 		display: flex;
 		flex-direction: column;
+		flex-grow: 1;
 
 		> .content {
 			overflow: auto;
diff --git a/packages/client/src/components/MkWidgets.vue b/packages/client/src/components/MkWidgets.vue
index d48fc53832..0d64c9fb62 100644
--- a/packages/client/src/components/MkWidgets.vue
+++ b/packages/client/src/components/MkWidgets.vue
@@ -172,6 +172,9 @@ function onContextmenu(widget: Widget, ev: MouseEvent) {
 
 <style lang="scss" scoped>
 .vjoppmmu {
+	display: flex;
+	flex-direction: column;
+	flex-grow: 1;
 	> header {
 		margin: 16px 0;
 
@@ -184,7 +187,7 @@ function onContextmenu(widget: Widget, ev: MouseEvent) {
 	> .widget,
 	.customize-container {
 		contain: content;
-		margin: var(--margin) 0;
+		margin-bottom: var(--margin);
 
 		&:first-of-type {
 			margin-top: 0;
diff --git a/packages/client/src/ui/universal.widgets.vue b/packages/client/src/ui/universal.widgets.vue
index d931e1bf3f..5c5f2073a7 100644
--- a/packages/client/src/ui/universal.widgets.vue
+++ b/packages/client/src/ui/universal.widgets.vue
@@ -88,9 +88,11 @@ function updateWidgets(widgets) {
 	min-height: 100vh;
 	padding: var(--margin) 0;
 	box-sizing: border-box;
+	display: flex;
+	flex-direction: column;
 
 	> * {
-		margin: var(--margin) 0;
+		margin-top: var(--margin);
 		width: 300px;
 
 		&:first-child {
@@ -98,6 +100,10 @@ function updateWidgets(widgets) {
 		}
 	}
 
+	.a:empty {
+		display: none;
+	}
+
 	> .add {
 		margin: 0 auto;
 	}