diff --git a/launcher/public/output.css b/launcher/public/output.css
index c79dd0828..d60891487 100755
--- a/launcher/public/output.css
+++ b/launcher/public/output.css
@@ -4380,6 +4380,26 @@ video {
   padding-top: 2rem;
 }
 
+.pt-\[0\.20rel\]{
+  padding-top: 0.20rel;
+}
+
+.pt-\[0\.20rem\]{
+  padding-top: 0.20rem;
+}
+
+.pt-\[0\.10rem\]{
+  padding-top: 0.10rem;
+}
+
+.pt-\[0\.05rem\]{
+  padding-top: 0.05rem;
+}
+
+.pt-0\.5{
+  padding-top: 0.125rem;
+}
+
 .text-left{
   text-align: left;
 }
diff --git a/launcher/src/components/UI/language-page/components/MenuBody.vue b/launcher/src/components/UI/language-page/components/MenuBody.vue
index be63eaf0b..129531039 100644
--- a/launcher/src/components/UI/language-page/components/MenuBody.vue
+++ b/launcher/src/components/UI/language-page/components/MenuBody.vue
@@ -91,7 +91,7 @@ const checkSettings = async () => {
     }
 
     // Handle volume settings
-    langStore.currentVolume = savedVolume?.volume ?? 0.95;
+    langStore.currentVolume = savedVolume?.volume ?? 0;
   } catch (error) {
     console.error("Failed to load saved settings:", error);
   }
@@ -101,7 +101,7 @@ const checkVolume = async () => {
   try {
     const savedConfig = await ControlService.readConfig();
     const { savedVolume } = savedConfig || {};
-    langStore.currentVolume = savedVolume?.volume ?? 0.95;
+    langStore.currentVolume = savedVolume?.volume ?? 0;
   } catch (error) {
     console.error("Failed to load saved settings:", error);
   }
diff --git a/launcher/src/components/UI/node-page/components/alert/NodeAlert.vue b/launcher/src/components/UI/node-page/components/alert/NodeAlert.vue
index bfd131a21..03a87ce3f 100755
--- a/launcher/src/components/UI/node-page/components/alert/NodeAlert.vue
+++ b/launcher/src/components/UI/node-page/components/alert/NodeAlert.vue
@@ -2,16 +2,37 @@
   <div class="status-box flex flex-col justify-between items-center">
     <div class="status-box_header h-[8%] w-full flex">
       <div
-        class="status-box_icon-box border border-gray-600 rounded-md bg-[#151618] w-3/4 h-full flex justify-center items-center"
+        class="status-box_icon-box border border-gray-600 rounded-md bg-[#151618] w-3/4 h-full flex justify-start items-center pl-2"
       >
         <div class="icon-line">
-          <div class="status-icon" :class="{ active: perfect }">
+          <div
+            v-if="alertShowState === 'showAll' || alertShowState === 'green'"
+            class="status-icon"
+            :class="{ active: perfect }"
+            @click="alertPicker(perfect ? 'green' : 'showAll')"
+          >
             <img src="/img/icon/node-alert-icons/NOTIFICATION-GRÜN.png" alt="green" />
           </div>
-          <div class="status-icon" :class="{ active: warning || pointStatus.length !== 0 }">
+          <div
+            v-if="alertShowState === 'showAll' || alertShowState === 'yellow'"
+            class="status-icon"
+            :class="{ active: warning || pointStatus.length !== 0 }"
+            @click="alertPicker(warning || pointStatus.length !== 0 ? 'yellow' : 'showAll')"
+          >
             <img src="/img/icon/node-alert-icons/alert-general-yellow.png" alt="green" />
           </div>
-          <div class="status-icon" :class="{ active: alarm }">
+          <div
+            v-if="alertShowState === 'showAll' || alertShowState === 'red'"
+            class="status-icon"
+            :class="{
+              active: alarm || notSetAddresses.length !== 0 || synchronizationErrorControl || errorAlarm,
+            }"
+            @click="
+              alertPicker(
+                alarm || notSetAddresses.length !== 0 || synchronizationErrorControl || errorAlarm ? 'red' : 'showAll'
+              )
+            "
+          >
             <img src="/img/icon/node-alert-icons/alert-general-red.png" alt="green" />
           </div>
         </div>
@@ -33,7 +54,11 @@
     <div class="status-box_messages bg-[#151618] border border-gray-600 rounded-md overflow-x-hidden overflow-y-auto">
       <AlertSkeleton v-for="i in skeletons" v-show="loadingAlerts" :key="i" />
       <div v-show="!loadingAlerts" class="status_innerBox overflow-x-hidden overflow-y-auto space-y-1 px-[2px]">
-        <router-link v-if="storageWarning" to="/control" class="status-message_yellow h-9">
+        <router-link
+          v-if="storageWarning && (alertShowState === 'showAll' || alertShowState === 'yellow')"
+          to="/control"
+          class="status-message_yellow h-9"
+        >
           <div class="message-icon">
             <img src="/img/icon/node-alert-icons/alert-storage-yellow.png" alt="warn_storage" />
           </div>
@@ -44,7 +69,11 @@
             <div class="val-message">{{ availDisk }} GB Free</div>
           </div>
         </router-link>
-        <router-link v-if="cpuWarning" to="/control" class="status-message_yellow h-9">
+        <router-link
+          v-if="cpuWarning && (alertShowState === 'showAll' || alertShowState === 'yellow')"
+          to="/control"
+          class="status-message_yellow h-9"
+        >
           <div class="message-icon">
             <img src="/img/icon/node-alert-icons/alert-cpu-yellow.png" alt="warn_storage" />
           </div>
@@ -57,20 +86,26 @@
             </div>
           </div>
         </router-link>
-        <router-link v-for="point in pointStatus" :key="point" to="/control" class="status-message_yellow h-9">
-          <div class="message-icon">
-            <img src="/img/icon/control-page-icons/PORT_LIST_ICON.png" alt="warn_storage" />
-          </div>
-          <div class="message-text_container">
-            <div class="main-message">
-              <span>{{ point }}</span>
+        <template v-if="pointStatus && (alertShowState === 'showAll' || alertShowState === 'yellow')">
+          <router-link v-for="point in pointStatus" :key="point" to="/control" class="status-message_yellow h-9">
+            <div class="message-icon">
+              <img src="/img/icon/control-page-icons/PORT_LIST_ICON.png" alt="warn_storage" />
             </div>
-            <div class="val-message">
-              <span> > {{ $t("nodeAlert.stats") }}</span>
+            <div class="message-text_container">
+              <div class="main-message">
+                <span>{{ point }}</span>
+              </div>
+              <div class="val-message">
+                <span> > {{ $t("nodeAlert.stats") }}</span>
+              </div>
             </div>
-          </div>
-        </router-link>
-        <router-link v-if="cpuAlarm" to="/control" class="status-message_red h-9">
+          </router-link>
+        </template>
+        <router-link
+          v-if="cpuAlarm && (alertShowState === 'showAll' || alertShowState === 'red')"
+          to="/control"
+          class="status-message_red h-9"
+        >
           <div class="message-icon">
             <img src="/img/icon/node-alert-icons/alert-cpu-red.png" alt="warn_storage" />
           </div>
@@ -85,7 +120,7 @@
         </router-link>
 
         <div
-          v-if="connectionStatusIsPoor"
+          v-if="connectionStatusIsPoor && (alertShowState === 'showAll' || alertShowState === 'red')"
           class="w-full h-10 grid grid-cols-12 rounded-md bg-red-700 p-1 cursor-pointer hover:bg-red-500"
           @click="callReconnectModal"
         >
@@ -99,7 +134,11 @@
           </div>
         </div>
 
-        <router-link v-if="synchronizationErrorControl" to="/control" class="status-message_red h-9">
+        <router-link
+          v-if="synchronizationErrorControl && (alertShowState === 'showAll' || alertShowState === 'red')"
+          to="/control"
+          class="status-message_red h-9"
+        >
           <div class="message-icon">
             <img src="/img/icon/node-alert-icons/alert-sync-error.gif" alt="warn_storage" />
           </div>
@@ -112,7 +151,11 @@
             </div>
           </div>
         </router-link>
-        <div v-if="errorAlarm" class="status-message_red h-9" @click="isTaskModalActive = true">
+        <div
+          v-if="errorAlarm && (alertShowState === 'showAll' || alertShowState === 'red')"
+          class="status-message_red h-9"
+          @click="isTaskModalActive = true"
+        >
           <div class="message-icon">
             <img src="/img/icon/node-alert-icons/alert-task-error.png" alt="warn_storage" />
           </div>
@@ -123,29 +166,34 @@
           </div>
         </div>
 
-        <div
-          v-for="validator in notSetAddresses"
-          :key="validator"
-          class="status-message_red h-9 pointer"
-          @mouseenter="cursorLocation = `${clkFee}`"
-          @mouseleave="cursorLocation = ''"
-          @click="expertHandler(validator.serviceID)"
-        >
-          <div class="message-icon">
-            <img :src="validator.icon" />
-          </div>
-          <div class="message-text_container">
-            <div class="main-message">
-              <span>{{ $t("nodeAlert.noFee") }}</span>
+        <template v-if="notSetAddresses && (alertShowState === 'showAll' || alertShowState === 'red')">
+          <div
+            v-for="validator in notSetAddresses"
+            :key="validator"
+            class="status-message_red h-9 pointer"
+            @mouseenter="cursorLocation = `${clkFee}`"
+            @mouseleave="cursorLocation = ''"
+            @click="expertHandler(validator.serviceID)"
+          >
+            <div class="message-icon">
+              <img :src="validator.icon" />
             </div>
-            <div class="val-message">
-              <span> > {{ validator.name }} vc</span>
+            <div class="message-text_container">
+              <div class="main-message">
+                <span>{{ $t("nodeAlert.noFee") }}</span>
+              </div>
+              <div class="val-message">
+                <span> > {{ validator.name }} vc</span>
+              </div>
             </div>
           </div>
-        </div>
+        </template>
 
         <div
-          v-if="stereumUpdate.current !== stereumUpdate.version"
+          v-if="
+            stereumUpdate.current !== stereumUpdate.version &&
+            (alertShowState === 'showAll' || alertShowState === 'green')
+          "
           class="status-message_green h-9"
           @mouseenter="cursorLocation = `${clkUpdate}`"
           @mouseleave="cursorLocation = ''"
@@ -163,26 +211,28 @@
             </div>
           </div>
         </div>
-        <div
-          v-for="item in updatedNewUpdates"
-          :key="item"
-          class="status-message_green h-9"
-          @mouseenter="cursorLocation = `${clkUpdate}`"
-          @mouseleave="cursorLocation = ''"
-          @click="showUpdate"
-        >
-          <div class="message-icon">
-            <img :src="item.sIcon" alt="warn_storage" />
-          </div>
-          <div class="message-text_container update-items">
-            <div class="main-message">
-              <span class="overflow-hidden truncate text-md">{{ item.name }} UPDATE</span>
+        <template v-if="updatedNewUpdates && (alertShowState === 'showAll' || alertShowState === 'green')">
+          <div
+            v-for="item in updatedNewUpdates"
+            :key="item"
+            class="status-message_green h-9"
+            @mouseenter="cursorLocation = `${clkUpdate}`"
+            @mouseleave="cursorLocation = ''"
+            @click="showUpdate"
+          >
+            <div class="message-icon">
+              <img :src="item.sIcon" alt="warn_storage" />
             </div>
-            <div class="val-message">
-              <span>{{ item.version }}</span>
+            <div class="message-text_container update-items">
+              <div class="main-message">
+                <span class="overflow-hidden truncate text-md">{{ item.name }} UPDATE</span>
+              </div>
+              <div class="val-message">
+                <span>{{ item.version }}</span>
+              </div>
             </div>
           </div>
-        </div>
+        </template>
       </div>
     </div>
   </div>
@@ -219,6 +269,7 @@ export default {
       clkUpdate: this.$t("nodeAlert.clkUpdate"),
       loadingAlerts: false,
       skeletons: [1, 2, 3, 4, 5, 6, 7, 8],
+      alertShowState: "showAll",
     };
   },
   computed: {
@@ -337,6 +388,13 @@ export default {
     this.cpuMeth();
   },
   methods: {
+    alertPicker(color) {
+      if (this.alertShowState === color) {
+        this.alertShowState = "showAll";
+      } else {
+        this.alertShowState = color;
+      }
+    },
     async checkSettings() {
       try {
         const savedConfig = await ControlService.readConfig();
@@ -592,7 +650,7 @@ export default {
 
 .icon-line {
   display: flex;
-  justify-content: space-evenly;
+  justify-content: flex-start;
   padding-top: 4px;
   width: 100%;
   height: 30px;
@@ -606,9 +664,14 @@ export default {
   align-items: center;
   opacity: 25%;
   border-radius: 5px;
+  margin-right: 5px;
 }
 .active {
   opacity: 100%;
+  cursor: pointer;
+}
+.active:hover {
+  transform: scale(1.1);
 }
 
 .status-icon img {
diff --git a/launcher/src/components/UI/the-control/ControlAlert.vue b/launcher/src/components/UI/the-control/ControlAlert.vue
index c68e6f1a0..46955b0c2 100755
--- a/launcher/src/components/UI/the-control/ControlAlert.vue
+++ b/launcher/src/components/UI/the-control/ControlAlert.vue
@@ -3,15 +3,38 @@
     <div class="alert-box">
       <div class="alert-box_header h-8 w-full flex justify-center items-center">
         <div
-          class="alert-box_icons border border-gray-600 rounded-md bg-[#151618] w-3/4 h-full flex justify-start items-center"
+          class="alert-box_icons border border-gray-600 rounded-md bg-[#151618] w-3/4 h-full flex justify-start items-center pt-0.5"
         >
-          <div class="icon_alarm" :class="{ active: perfect }">
+          <div
+            v-if="alertShowState === 'showAll' || alertShowState === 'green'"
+            class="icon_alarm"
+            :class="{ active: perfect }"
+            @click="alertPicker(perfect ? 'green' : 'showAll')"
+          >
             <img src="/img/icon/node-alert-icons/NOTIFICATION-GRÜN.png" alt="green" />
           </div>
-          <div class="icon_alarm" :class="{ active: warning || pointStatus.length !== 0 }">
+          <div
+            v-if="alertShowState === 'showAll' || alertShowState === 'yellow'"
+            class="icon_alarm"
+            :class="{
+              active: warning || pointStatus.length !== 0,
+            }"
+            @click="alertPicker(warning || pointStatus.length !== 0 ? 'yellow' : 'showAll')"
+          >
             <img src="/img/icon/node-alert-icons/alert-general-yellow.png" alt="green" />
           </div>
-          <div class="icon_alarm" :class="{ active: alarm }">
+          <div
+            v-if="alertShowState === 'showAll' || alertShowState === 'red'"
+            class="icon_alarm"
+            :class="{
+              active: alarm || notSetAddresses.length !== 0 || synchronizationErrorControl || errorAlarm,
+            }"
+            @click="
+              alertPicker(
+                alarm || notSetAddresses.length !== 0 || synchronizationErrorControl || errorAlarm ? 'red' : 'showAll'
+              )
+            "
+          >
             <img src="/img/icon/node-alert-icons/alert-general-red.png" alt="green" />
           </div>
         </div>
@@ -30,7 +53,7 @@
       </div>
       <div class="alert-box_messages overflow-x-hidden overflow-y-auto">
         <div
-          v-if="storageWarning"
+          v-if="storageWarning && (alertShowState === 'showAll' || alertShowState === 'yellow')"
           class="alert-message_yellow"
           @mouseenter="cursorLocation = `${lowSpace}`"
           @mouseleave="cursorLocation = ''"
@@ -46,7 +69,7 @@
           </div>
         </div>
         <div
-          v-if="cpuWarning"
+          v-if="cpuWarning && (alertShowState === 'showAll' || alertShowState === 'yellow')"
           class="alert-message_yellow"
           @mouseenter="cursorLocation = `cpu ${use}`"
           @mouseleave="cursorLocation = ''"
@@ -63,21 +86,23 @@
             </div>
           </div>
         </div>
-        <div v-for="point in pointStatus" :key="point" class="alert-message_yellow">
-          <div class="icon-box">
-            <img src="/img/icon/control-page-icons/PORT_LIST_ICON.png" alt="warn_storage" />
-          </div>
-          <div class="message">
-            <div class="main-message">
-              <span>{{ point }}</span>
+        <template v-if="pointStatus && (alertShowState === 'showAll' || alertShowState === 'yellow')">
+          <div v-for="point in pointStatus" :key="point" class="alert-message_yellow">
+            <div class="icon-box">
+              <img src="/img/icon/control-page-icons/PORT_LIST_ICON.png" alt="warn_storage" />
             </div>
-            <div class="val-message">
-              <span> > STATUS: OPEN</span>
+            <div class="message">
+              <div class="main-message">
+                <span>{{ point }}</span>
+              </div>
+              <div class="val-message">
+                <span> > STATUS: OPEN</span>
+              </div>
             </div>
           </div>
-        </div>
+        </template>
         <div
-          v-if="cpuAlarm"
+          v-if="cpuAlarm && (alertShowState === 'showAll' || alertShowState === 'red')"
           class="alert-message_red"
           @mouseenter="cursorLocation = `cpu ${use}`"
           @mouseleave="cursorLocation = ''"
@@ -95,7 +120,7 @@
           </div>
         </div>
         <div
-          v-if="synchronizationErrorControl"
+          v-if="synchronizationErrorControl && (alertShowState === 'showAll' || alertShowState === 'red')"
           class="alert-message_red"
           @mouseenter="cursorLocation = ` ${sync}`"
           @mouseleave="cursorLocation = ''"
@@ -111,7 +136,7 @@
           </div>
         </div>
         <div
-          v-if="errorAlarm"
+          v-if="errorAlarm && (alertShowState === 'showAll' || alertShowState === 'red')"
           class="alert-message_red"
           @click="isTaskModalActive = true"
           @mouseenter="cursorLocation = ` ${taskFail}`"
@@ -127,27 +152,32 @@
             </div>
           </div>
         </div>
-        <div
-          v-for="validator in notSetAddresses"
-          :key="validator"
-          class="alert-message_red pointer"
-          @mouseenter="cursorLocation = `${clkFee}`"
-          @mouseleave="cursorLocation = ''"
-          @click="expertHandler(validator)"
-        >
-          <div class="icon-box">
-            <img :src="validator.icon" />
-          </div>
-          <div class="message">
-            <div class="main-message"><span>no fee recipient</span></div>
-            <div class="val-message">
-              <span> > {{ validator.name }} vc</span>
+        <template v-if="notSetAddresses && (alertShowState === 'showAll' || alertShowState === 'red')">
+          <div
+            v-for="validator in notSetAddresses"
+            :key="validator"
+            class="alert-message_red pointer"
+            @mouseenter="cursorLocation = `${clkFee}`"
+            @mouseleave="cursorLocation = ''"
+            @click="expertHandler(validator)"
+          >
+            <div class="icon-box">
+              <img :src="validator.icon" />
+            </div>
+            <div class="message">
+              <div class="main-message"><span>no fee recipient</span></div>
+              <div class="val-message">
+                <span> > {{ validator.name }} vc</span>
+              </div>
             </div>
           </div>
-        </div>
+        </template>
 
         <div
-          v-if="stereumUpdate.current !== stereumUpdate.version"
+          v-if="
+            stereumUpdate.current !== stereumUpdate.version &&
+            (alertShowState === 'showAll' || alertShowState === 'green')
+          "
           class="alert-message_green"
           @mouseenter="cursorLocation = `${clkUpdate}`"
           @mouseleave="cursorLocation = ''"
@@ -164,26 +194,28 @@
             </div>
           </div>
         </div>
-        <div
-          v-for="item in updatedNewUpdates"
-          :key="item"
-          class="alert-message_green"
-          @click="showUpdate"
-          @mouseenter="cursorLocation = `${clkUpdate}`"
-          @mouseleave="cursorLocation = ''"
-        >
-          <div class="icon-box">
-            <img :src="iconFilter(item)" alt="warn_storage" />
-          </div>
-          <div class="message">
-            <div class="main-message" @click="showUpdate">
-              <span>UPDATE available</span>
+        <template v-if="updatedNewUpdates && (alertShowState === 'showAll' || alertShowState === 'green')">
+          <div
+            v-for="item in updatedNewUpdates"
+            :key="item"
+            class="alert-message_green"
+            @click="showUpdate"
+            @mouseenter="cursorLocation = `${clkUpdate}`"
+            @mouseleave="cursorLocation = ''"
+          >
+            <div class="icon-box">
+              <img :src="iconFilter(item)" alt="warn_storage" />
             </div>
-            <div class="val-message">
-              <span>{{ item.version }}</span>
+            <div class="message">
+              <div class="main-message" @click="showUpdate">
+                <span>UPDATE available</span>
+              </div>
+              <div class="val-message">
+                <span>{{ item.version }}</span>
+              </div>
             </div>
           </div>
-        </div>
+        </template>
       </div>
     </div>
   </div>
@@ -208,7 +240,7 @@ export default {
       alarm: false,
       notification: false,
       newUpdate: false,
-
+      alertShowState: "showAll",
       notSetAddresses: [],
       clkFee: this.$t("nodeAlert.clkFee"),
       clkUpdate: this.$t("nodeAlert.clkUpdate"),
@@ -322,6 +354,13 @@ export default {
     this.cpuMeth();
   },
   methods: {
+    alertPicker(color) {
+      if (this.alertShowState === color) {
+        this.alertShowState = "showAll";
+      } else {
+        this.alertShowState = color;
+      }
+    },
     async checkSettings() {
       try {
         const savedConfig = await ControlService.readConfig();
@@ -523,6 +562,10 @@ export default {
 }
 .active {
   opacity: 100%;
+  cursor: pointer;
+}
+.active:hover {
+  transform: scale(1.1);
 }
 .icon_alarm img {
   height: 100%;