🎨

src/client/components/global/header.vue

@@ -1,5 +1,5 @@
 <template>
-<div class="fdidabkb" :class="{ slim: narrow, thin }" :style="{ background: bg }" @click="onClick" ref="el">
+<div class="fdidabkb" :class="{ slim: narrow, thin: thin_ }" :style="{ background: bg }" @click="onClick" ref="el">
 	<template v-if="info">
 		<div class="titleContainer" @click="showTabsPopup">
 			<i v-if="info.icon" class="icon" :class="info.icon"></i>
@@ -37,7 +37,7 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, onMounted, onUnmounted, PropType, ref } from 'vue';
+import { computed, defineComponent, onMounted, onUnmounted, PropType, ref, inject } from 'vue';
 import * as tinycolor from 'tinycolor2';
 import { popupMenu } from '@client/os';
 import { url } from '@client/config';
@@ -182,6 +182,7 @@ export default defineComponent({
 			showTabsPopup,
 			preventDrag,
 			onClick,
+			thin_: props.thin || inject('shouldHeaderThin', false)
 		};
 	},
 });

src/client/components/modal-page-window.vue

@@ -44,7 +44,8 @@ export default defineComponent({
 		return {
 			navHook: (path) => {
 				this.navigate(path);
-			}
+			},
+			shouldHeaderThin: true,
 		};
 	},
 

src/client/components/page-window.vue

@@ -46,7 +46,8 @@ export default defineComponent({
 		return {
 			navHook: (path) => {
 				this.navigate(path);
-			}
+			},
+			shouldHeaderThin: true,
 		};
 	},
 

src/client/components/post-form.vue

@@ -1,6 +1,6 @@
 <template>
 <div class="gafaadew" :class="{ modal, _popup: modal }"
-	v-size="{ max: [500] }"
+	v-size="{ max: [310, 500] }"
 	@dragover.stop="onDragover"
 	@dragenter="onDragenter"
 	@dragleave="onDragleave"
@@ -914,5 +914,17 @@ export default defineComponent({
 			}
 		}
 	}
+
+	&.max-width_310px {
+		> .form {
+			> footer {
+				> button {
+					font-size: 14px;
+					width: 44px;
+				height: 44px;
+				}
+			}
+		}
+	}
 }
 </style>