From d0f89fdf7eb82967217b5d5f919e57e06f334044 Mon Sep 17 00:00:00 2001
From: Neko Ayaka <neko@ayaka.moe>
Date: Fri, 27 Mar 2026 02:32:55 +0800
Subject: [PATCH] chore(stage-tamagotchi): place microphone indicator to
 outside

---
 .../stage-islands/controls-island/index.vue   | 34 +++++++++----------
 1 file changed, 16 insertions(+), 18 deletions(-)

diff --git a/apps/stage-tamagotchi/src/renderer/components/stage-islands/controls-island/index.vue b/apps/stage-tamagotchi/src/renderer/components/stage-islands/controls-island/index.vue
index c8ab7e05f..a99bf9f72 100644
--- a/apps/stage-tamagotchi/src/renderer/components/stage-islands/controls-island/index.vue
+++ b/apps/stage-tamagotchi/src/renderer/components/stage-islands/controls-island/index.vue
@@ -188,22 +188,6 @@ function refreshWindow() {
               </template>
             </ControlButtonTooltip>
 
-            <ControlButtonTooltip disable-hoverable-content>
-              <ControlsIslandHearingConfig :show="blockingOverlays.has('hearing')" @update:show="setOverlay('hearing', $event)">
-                <div class="relative">
-                  <ControlButton :button-style="adjustStyleClasses.button">
-                    <Transition name="fade" mode="out-in">
-                      <IndicatorMicVolume v-if="enabled" :class="adjustStyleClasses.icon" />
-                      <div v-else i-ph:microphone-slash :class="adjustStyleClasses.icon" text="neutral-800 dark:neutral-300" />
-                    </Transition>
-                  </ControlButton>
-                </div>
-              </ControlsIslandHearingConfig>
-              <template #tooltip>
-                {{ t('tamagotchi.stage.controls-island.open-hearing-controls') }}
-              </template>
-            </ControlButtonTooltip>
-
             <ControlButtonTooltip disable-hoverable-content>
               <ControlButton :button-style="adjustStyleClasses.button" @click="toggleAlwaysOnTop()">
                 <div v-if="alwaysOnTop" i-solar:pin-bold :class="adjustStyleClasses.icon" text="neutral-800 dark:neutral-300" />
@@ -233,9 +217,7 @@ function refreshWindow() {
         <ControlButtonTooltip side="left">
           <ControlButton :button-style="adjustStyleClasses.button" @click="expanded = !expanded">
             <div
-
               :class="[adjustStyleClasses.icon, expanded ? 'rotate-180' : 'rotate-0']"
-
               i-solar:alt-arrow-up-line-duotone scale-110 transition-all duration-300
               text="neutral-800 dark:neutral-300"
             />
@@ -245,6 +227,22 @@ function refreshWindow() {
           </template>
         </ControlButtonTooltip>
 
+        <ControlButtonTooltip side="left">
+          <ControlsIslandHearingConfig :show="blockingOverlays.has('hearing')" @update:show="setOverlay('hearing', $event)">
+            <div class="relative">
+              <ControlButton :button-style="adjustStyleClasses.button">
+                <Transition name="fade" mode="out-in">
+                  <IndicatorMicVolume v-if="enabled" :class="adjustStyleClasses.icon" />
+                  <div v-else i-ph:microphone-slash :class="adjustStyleClasses.icon" text="neutral-800 dark:neutral-300" />
+                </Transition>
+              </ControlButton>
+            </div>
+          </ControlsIslandHearingConfig>
+          <template #tooltip>
+            {{ t('tamagotchi.stage.controls-island.open-hearing-controls') }}
+          </template>
+        </ControlButtonTooltip>
+
         <ControlButtonTooltip side="left">
           <ControlButton :button-style="adjustStyleClasses.button" cursor-move :class="{ 'drag-region': isLinux }" @mousedown="startDraggingWindow?.()">
             <div i-ph:arrows-out-cardinal :class="adjustStyleClasses.icon" text="neutral-800 dark:neutral-300" />