Add animations everywhere

Modules/Settings/SettingsPanel.qml

@@ -10,6 +10,8 @@ import qs.Widgets
 NLoader {
   id: root
 
+  property int currentTabIndex: 0
+
   content: Component {
     NPanel {
       id: panel
@@ -52,7 +54,6 @@ NLoader {
 
       WlrLayershell.keyboardFocus: WlrKeyboardFocus.OnDemand
 
-      property int currentTabIndex: 0
       property var tabsModel: [{
           "label": "General",
           "icon": "tune",
@@ -89,11 +90,12 @@ NLoader {
           "label": "Wallpaper Selector",
           "icon": "wallpaper_slideshow",
           "source": "Tabs/WallpaperSelector.qml"
-        }, {
-          "label": "Misc",
-          "icon": "more_horiz",
-          "source": "Tabs/Misc.qml"
-        }, {
+        }, // {
+        //   "label": "Misc",
+        //   "icon": "more_horiz",
+        //   "source": "Tabs/Misc.qml"
+        // },
+        {
           "label": "About",
           "icon": "info",
           "source": "Tabs/About.qml"
@@ -186,7 +188,7 @@ NLoader {
 
                 delegate: Rectangle {
                   id: tabItem
-                  readonly property bool selected: index === panel.currentTabIndex
+
                   width: parent.width
                   height: 32 * scaling // Back to original height
                   radius: Style.radiusSmall * scaling
@@ -194,6 +196,8 @@ NLoader {
                   border.color: "transparent"
                   border.width: 0
 
+                  readonly property bool selected: index === currentTabIndex
+
                   // Subtle hover effect: only icon/text color tint on hover
                   property bool hovering: false
 
@@ -227,7 +231,7 @@ NLoader {
                     onEntered: tabItem.hovering = true
                     onExited: tabItem.hovering = false
                     onCanceled: tabItem.hovering = false
-                    onClicked: panel.currentTabIndex = index
+                    onClicked: currentTabIndex = index
                   }
                 }
               }
@@ -258,7 +262,7 @@ NLoader {
 
                 // Tab label on the main right
                 NText {
-                  text: panel.tabsModel[panel.currentTabIndex].label
+                  text: panel.tabsModel[currentTabIndex].label
                   font.pointSize: Style.fontSizeLarge * scaling
                   font.weight: Style.fontWeightBold
                   color: Colors.accentPrimary
@@ -282,7 +286,7 @@ NLoader {
                 id: stack
                 Layout.fillWidth: true
                 Layout.fillHeight: true
-                currentIndex: panel.currentTabIndex
+                currentIndex: currentTabIndex
 
                 Tabs.General {}
                 Tabs.Bar {}