fix layout

packages/frontend/src/pages/admin/custom-emojis-grid.local.list.vue

@@ -13,7 +13,7 @@
 			</MkButton>
 		</div>
 
-		<div style="overflow-y: scroll; padding-top: 8px; padding-bottom: 8px;">
+		<div :class="$style.gridArea">
 			<MkGrid :data="gridItems" :gridSetting="gridSetting" :columnSettings="columnSettings" @event="onGridEvent"/>
 		</div>
 
@@ -302,6 +302,14 @@ function refreshGridItems() {
 	gap: 8px;
 }
 
+.gridArea {
+	overflow: scroll;
+	padding-top: 8px;
+	padding-bottom: 8px;
+	height: 570px;
+	resize: vertical;
+}
+
 .pages {
 	display: flex;
 	justify-content: center;

packages/frontend/src/pages/admin/custom-emojis-grid.local.register.vue

@@ -51,7 +51,7 @@
 		</ul>
 	</div>
 
-	<div v-if="gridItems.length > 0" style="overflow-y: scroll;">
+	<div v-if="gridItems.length > 0" :class="$style.gridArea">
 		<MkGrid
 			:data="gridItems"
 			:columnSettings="columnSettings"
@@ -378,6 +378,14 @@ onMounted(async () => {
 	}
 }
 
+.gridArea {
+	overflow: scroll;
+	padding-top: 8px;
+	padding-bottom: 8px;
+	height: 400px;
+	resize: vertical;
+}
+
 .buttons {
 	margin-top: 16px;
 	display: flex;

packages/frontend/src/pages/admin/custom-emojis-grid.remote.vue

@@ -15,7 +15,7 @@
 	</div>
 
 	<div v-if="gridItems.length > 0">
-		<div style="overflow-y: scroll; padding-top: 8px; padding-bottom: 8px;">
+		<div :class="$style.gridArea">
 			<MkGrid :data="gridItems" :columnSettings="columnSettings" @event="onGridEvent"/>
 		</div>
 
@@ -222,6 +222,14 @@ onMounted(async () => {
 	gap: 8px;
 }
 
+.gridArea {
+	overflow: scroll;
+	padding-top: 8px;
+	padding-bottom: 8px;
+	height: 620px;
+	resize: vertical;
+}
+
 .pages {
 	display: flex;
 	justify-content: center;