🎨

packages/frontend/src/components/MkModalPageWindow.vue

@@ -10,7 +10,7 @@
 			</span>
 			<button class="_button" @click="$refs.modal.close()"><i class="ti ti-x"></i></button>
 		</div>
-		<div class="body">
+		<div class="body" style="container-type: inline-size;">
 			<MkStickyContainer>
 				<template #header><MkPageHeader v-if="pageMetadata?.value && !pageMetadata?.value.hideHeader" :info="pageMetadata?.value"/></template>
 				<RouterView :router="router"/>

packages/frontend/src/components/MkPageWindow.vue

@@ -17,7 +17,7 @@
 		</template>
 	</template>
 
-	<div class="yrolvcoq" :style="{ background: pageMetadata?.value?.bg }">
+	<div class="yrolvcoq" :style="{ background: pageMetadata?.value?.bg }" style="container-type: inline-size;">
 		<RouterView :router="router"/>
 	</div>
 </XWindow>

packages/frontend/src/pages/admin/index.vue

@@ -16,7 +16,7 @@
 			</div>
 		</MkSpacer>
 	</div>
-	<div v-if="!(narrow && currentPage?.route.name == null)" class="main">
+	<div v-if="!(narrow && currentPage?.route.name == null)" class="main" style="container-type: inline-size;">
 		<RouterView/>
 	</div>
 </div>

packages/frontend/src/pages/settings/index.vue

@@ -11,7 +11,7 @@
 					</div>
 				</div>
 				<div v-if="!(narrow && currentPage?.route.name == null)" class="main">
-					<div class="bkzroven">
+					<div class="bkzroven" style="container-type: inline-size;">
 						<RouterView/>
 					</div>
 				</div>

packages/frontend/src/ui/classic.vue

@@ -11,7 +11,7 @@
 		</div>
 
 		<main class="main" :style="{ background: pageMetadata?.value?.bg }" @contextmenu.stop="onContextmenu">
-			<div class="content">
+			<div class="content" style="container-type: inline-size;">
 				<RouterView/>
 			</div>
 		</main>

packages/frontend/src/ui/deck/column.vue

@@ -392,6 +392,7 @@ function onDrop(ev) {
 		overflow-x: clip;
 		-webkit-overflow-scrolling: touch;
 		box-sizing: border-box;
+		container-type: inline-size;
 		background-color: var(--bg);
 	}
 }

packages/frontend/src/ui/universal.vue

@@ -5,7 +5,7 @@
 	<MkStickyContainer class="contents">
 		<template #header><XStatusBars :class="$style.statusbars"/></template>
 		<main style="min-width: 0;" :style="{ background: pageMetadata?.value?.bg }" @contextmenu.stop="onContextmenu">
-			<div :class="$style.content">
+			<div :class="$style.content" style="container-type: inline-size;">
 				<RouterView/>
 			</div>
 			<div :class="$style.spacer"></div>

packages/frontend/src/ui/visitor/a.vue

@@ -24,7 +24,7 @@
 			<header v-show="mainRouter.currentRoute?.name !== 'index'" ref="header" class="header">
 				<XHeader :info="pageInfo"/>
 			</header>
-			<main ref="main">
+			<main ref="main" style="container-type: inline-size;">
 				<RouterView/>
 			</main>
 			<div class="powered-by">

packages/frontend/src/ui/visitor/b.vue

@@ -11,7 +11,7 @@
 
 		<div class="contents">
 			<XHeader v-if="!root" class="header" :info="pageInfo"/>
-			<main>
+			<main style="container-type: inline-size;">
 				<RouterView/>
 			</main>
 			<div v-if="!root" class="powered-by">

packages/frontend/src/ui/zen.vue

@@ -1,5 +1,5 @@
 <template>
-<div class="mk-app">
+<div class="mk-app" style="container-type: inline-size;">
 	<RouterView/>
 
 	<XCommon/>