Optimize layout

frontend/src/components/HelloWorld.vue

@@ -81,13 +81,13 @@ function disconnect() {
 				<div class="justify-center items-center flex flex-col">
 					<n-select children-field="children" label-field="label" value-field="value" filterable
 						:options="data.serialOptions" @click="getAvailablePorts" placeholder="选择串口"
-						v-model:value="data.name" class="w-2/6 m-1.5" />
+						v-model:value="data.name" class="w-3/6 m-1.5" />
 				</div>
 				<n-space align="center" justify="center">
 					<n-button type="primary" @click="connect" class="m-1.5" text-color="#18a058">连接</n-button>
 					<n-button type="error" disabled @click="disconnect" class="m-1.5" secondary>断开</n-button>
 				</n-space>
-				<n-alert title="连接状态" v-bind:type="data.alertBox" class="w-2/6 mx-auto inset-x-0 m-1.5">{{
+				<n-alert title="连接状态" v-bind:type="data.alertBox" class="w-2/3 mx-auto inset-x-0 m-1.5 max-w-lg">{{
 						data.resultText
 				}}
 				</n-alert>

frontend/src/components/Settings.vue

@@ -95,7 +95,7 @@ function setKey() {
             <n-text>对于更广泛的用途，您可以在这里自定义按键对应关系。</n-text>
         </div>
         <div class="justify-center items-center flex flex-col">
-            <div class="grid grid-cols-2 content-center justify-center items-center gap-4 w-3/6">
+            <div class="grid grid-cols-2 content-center justify-center items-center gap-4 w-3/6 min-w-max">
                 <n-select children-field="children" label-field="label" value-field="value" filterable
                     :options="data.availableDevices" placeholder="选择设备" v-model:value="data.manualSelectDevice"
                     @click="getDevices" />

main.go

@@ -17,7 +17,7 @@ func main() {
 	// Create application with options
 	err := wails.Run(&options.App{
 		Title:            "joycon-terminal",
-		Width:            1024,
+		Width:            512,
 		Height:           768,
 		Assets:           assets,
 		BackgroundColour: &options.RGBA{R: 27, G: 38, B: 54, A: 1},