Merge pull request #2138 from tibssy/feat/smart-transparency

feat(widgets): implement smart transparency for auxiliary components

Widgets/NBox.qml

@@ -24,10 +24,7 @@ Item {
         return root.color;
       }
 
-      // Reuse panel opacity, but limit it to 0.4
-      let alpha = Math.max(Settings.data.ui.panelBackgroundOpacity, 0.4);
-      alpha = Math.max(0, root.color.a - (1.0 - alpha));
-      return Qt.alpha(root.color, alpha);
+      return Color.smartAlpha(root.color);
     }
   }
 }

Widgets/NIconButton.qml

@@ -17,7 +17,7 @@ Item {
   property bool handleWheel: false
   property bool hovering: false
 
-  property color colorBg: Color.mSurfaceVariant
+  property color colorBg: Color.smartAlpha(Color.mSurfaceVariant)
   property color colorFg: Color.mPrimary
   property color colorBgHover: Color.mHover
   property color colorFgHover: Color.mOnHover

Widgets/NIconButtonHot.qml

@@ -22,7 +22,7 @@ Rectangle {
   property bool pressed: false
 
   // Color properties
-  property color colorBg: Color.mSurfaceVariant
+  property color colorBg: Color.smartAlpha(Color.mSurfaceVariant)
   property color colorFg: Color.mPrimary
   property color colorBgHover: Color.mHover
   property color colorFgHover: Color.mOnHover

Widgets/NTabBar.qml

@@ -69,7 +69,7 @@ Rectangle {
   Layout.margins: Style.borderS
   implicitWidth: tabRow.implicitWidth + (margins * 2)
   implicitHeight: tabHeight + (margins * 2)
-  color: Color.mSurfaceVariant
+  color: Color.smartAlpha(Color.mSurfaceVariant)
   radius: Style.iRadiusM
 
   RowLayout {

Widgets/NTabButton.qml

@@ -33,8 +33,8 @@ Rectangle {
   topRightRadius: isLast ? Style.iRadiusM : Style.iRadiusXXXS
   bottomRightRadius: isLast ? Style.iRadiusM : Style.iRadiusXXXS
 
-  color: root.isHovered ? Color.mHover : (root.checked ? Color.mPrimary : Color.mSurface)
-  border.color: Color.mOutline
+  color: root.isHovered ? Color.mHover : (root.checked ? Color.mPrimary : "transparent")
+  border.color: root.checked ? Color.mPrimary : Color.mOutline
   border.width: Style.borderS
 
   Behavior on color {