💄 Improve visual effect behaviors when inactive

Loop/Extensions/NSColor+Extensions.swift

@@ -10,18 +10,6 @@ import AppKit
 // MARK: - Extension for wallpaper coloring
 
 extension NSColor {
-    /// Converts NSColor to a hexadecimal string representation.
-    /// If the color is not in the device RGB color space, it defaults to black.
-    var toHexString: String {
-        // Attempt to convert the color to the RGB color space.
-        guard let rgbColor = usingColorSpace(.deviceRGB) else { return "#000000" }
-        // Format the RGB components into a hexadecimal string.
-        return String(format: "#%02X%02X%02X",
-                      Int(rgbColor.redComponent * 0xFF),
-                      Int(rgbColor.greenComponent * 0xFF),
-                      Int(rgbColor.blueComponent * 0xFF))
-    }
-
     /// Calculates the brightness of the color based on luminance.
     /// Brightness is calculated using the luminance formula, which considers the different contributions
     /// of the red, green, and blue components of the color. This property can be used to determine

Loop/Settings Window/SettingsContentView.swift

@@ -22,7 +22,7 @@ struct SettingsContentView: View {
                 LuminareSidebarSection("Settings", selection: $model.currentTab, items: SettingsTab.settingsTabs)
                 LuminareSidebarSection("\(Bundle.main.appName)", selection: $model.currentTab, items: SettingsTab.loopTabs)
             }
-            .frame(width: 260)
+            .frame(width: 240)
             .padding(.top, titleBarHeight)
             .luminareBackground()
 

Loop/Settings Window/SettingsTab.swift

@@ -25,16 +25,7 @@ enum SettingsTab: LuminareTabItem, CaseIterable {
     case about
 
     var icon: some View {
-        RoundedRectangle(cornerRadius: 6)
-            .frame(width: 22, height: 22)
-            .foregroundStyle(color.gradient)
-            .overlay {
-                image
-                    .font(.system(size: 12, weight: .medium))
-                    .foregroundStyle(.white)
-                    .shadow(color: .black.opacity(0.4), radius: 1)
-            }
-            .drawingGroup()
+        SettingsTabIconView(tab: self)
     }
 
     var color: Color {
@@ -113,3 +104,42 @@ enum SettingsTab: LuminareTabItem, CaseIterable {
     static let settingsTabs: [Self] = [.behavior, .keybinds]
     static let loopTabs: [Self] = [.advanced, .excludedApps, .about]
 }
+
+struct SettingsTabIconView: View {
+    let tab: SettingsTab
+
+    var body: some View {
+        RoundedRectangle(cornerRadius: 6)
+            .foregroundStyle(tab.color.gradient)
+            .opacity(0.8)
+            .overlay {
+                if #available(macOS 26.0, *) {
+                    borderShine(in: .rect(cornerRadius: 6))
+                }
+
+                tab.image
+                    .font(.system(size: 12, weight: .medium))
+                    .foregroundStyle(.white)
+                    .shadow(color: .black.opacity(0.4), radius: 1)
+            }
+            .frame(width: 22, height: 22)
+    }
+
+    // Mimics macOS Tahoe's icon shine
+    private func borderShine(in shape: some InsettableShape) -> some View {
+        shape
+            .strokeBorder(.white, lineWidth: 1)
+            .mask {
+                LinearGradient(
+                    colors: [
+                        .white,
+                        .clear,
+                        .white.opacity(0.5)
+                    ],
+                    startPoint: .topLeading,
+                    endPoint: .bottomTrailing
+                )
+            }
+            .opacity(0.4)
+    }
+}

Loop/Settings Window/SettingsWindowManager.swift

@@ -114,7 +114,7 @@ final class SettingsWindowManager: ObservableObject {
             while true {
                 try await Task.sleep(for: .seconds(1))
 
-                if await controller?.window?.isKeyWindow == true, !Task.isCancelled {
+                if controller?.window?.isKeyWindow == true, !Task.isCancelled {
                     await MainActor.run {
                         previewedAction.direction = previewedAction.direction.nextPreviewDirection
                         radialMenuViewModel.setAction(to: previewedAction)

Loop/Utilities/VisualEffectView.swift

@@ -11,13 +11,27 @@ import SwiftUI
 struct VisualEffectView: NSViewRepresentable {
     let material: NSVisualEffectView.Material
     let blendingMode: NSVisualEffectView.BlendingMode
+    let state: NSVisualEffectView.State?
+
+    init(
+        material: NSVisualEffectView.Material,
+        blendingMode: NSVisualEffectView.BlendingMode,
+        state: NSVisualEffectView.State? = nil
+    ) {
+        self.material = material
+        self.blendingMode = blendingMode
+        self.state = state
+    }
 
     func makeNSView(context _: Context) -> NSVisualEffectView {
         let visualEffectView = NSVisualEffectView()
         visualEffectView.material = material
         visualEffectView.blendingMode = blendingMode
-        visualEffectView.state = .active
-        visualEffectView.isEmphasized = true
+
+        if let state {
+            visualEffectView.state = state
+        }
+
         return visualEffectView
     }
 

Loop/Window Action Indicators/Preview Window/PreviewView.swift

@@ -35,7 +35,7 @@ struct PreviewView: View {
     var body: some View {
         GeometryReader { _ in
             ZStack {
-                VisualEffectView(material: .hudWindow, blendingMode: .behindWindow)
+                VisualEffectView(material: .hudWindow, blendingMode: .behindWindow, state: .active)
                     .clipShape(.rect(cornerRadii: cornerRadii))
 
                 UnevenRoundedRectangle(cornerRadii: cornerRadii)

Loop/Window Action Indicators/Radial Menu/RadialMenuView.swift

@@ -41,7 +41,7 @@ struct RadialMenuView: View {
                             in: .rect(cornerRadius: radialMenuCornerRadius)
                         )
                 } else {
-                    VisualEffectView(material: .hudWindow, blendingMode: .behindWindow)
+                    VisualEffectView(material: .hudWindow, blendingMode: .behindWindow, state: .active)
                 }
 
                 // This rectangle with a gradient is masked with the current direction radial menu view