diff --git a/crates/qbz-qt/qml/controls/IconTextButton.qml b/crates/qbz-qt/qml/controls/IconTextButton.qml index ae4e4bc42..738ff7763 100644 --- a/crates/qbz-qt/qml/controls/IconTextButton.qml +++ b/crates/qbz-qt/qml/controls/IconTextButton.qml @@ -36,7 +36,7 @@ Rectangle { radius: theme.radiusSm border.width: 1 border.color: theme.borderSubtle - color: hoverArea.containsMouse && root.btnEnabled ? theme.surfaceHover : theme.surfaceElevated + color: hoverArea.containsMouse && root.btnEnabled ? theme.surfaceHover : (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) opacity: root.btnEnabled ? 1.0 : 0.4 Row { diff --git a/crates/qbz-qt/qml/controls/QbzLoadMore.qml b/crates/qbz-qt/qml/controls/QbzLoadMore.qml index 8a4329d75..733c1b2e8 100644 --- a/crates/qbz-qt/qml/controls/QbzLoadMore.qml +++ b/crates/qbz-qt/qml/controls/QbzLoadMore.qml @@ -181,7 +181,7 @@ Column { width: pillText.implicitWidth + 36 height: 32 radius: theme.radiusSm - color: pillArea.containsMouse ? theme.surfaceElevated : theme.surfaceCard + color: pillArea.containsMouse ? theme.surfaceElevated : (theme.ambientOn ? theme.surfaceCardA50 : theme.surfaceCard) border.width: 1 border.color: theme.borderSubtle Text { diff --git a/crates/qbz-qt/qml/controls/QbzMultiSelectBar.qml b/crates/qbz-qt/qml/controls/QbzMultiSelectBar.qml index 4af9028ad..506f52168 100644 --- a/crates/qbz-qt/qml/controls/QbzMultiSelectBar.qml +++ b/crates/qbz-qt/qml/controls/QbzMultiSelectBar.qml @@ -47,7 +47,7 @@ Rectangle { height: 44 radius: 8 - color: theme.surfaceElevated + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) Row { anchors.fill: parent diff --git a/crates/qbz-qt/qml/controls/QbzSearchField.qml b/crates/qbz-qt/qml/controls/QbzSearchField.qml index 263474576..fc01332bf 100644 --- a/crates/qbz-qt/qml/controls/QbzSearchField.qml +++ b/crates/qbz-qt/qml/controls/QbzSearchField.qml @@ -32,7 +32,8 @@ Rectangle { implicitWidth: 168 implicitHeight: 34 radius: 6 - color: theme.surfaceElevated + // The header search's ambient-aware fill, so every search box reads alike. + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) border.width: 1 border.color: input.activeFocus ? theme.accent : theme.borderSubtle diff --git a/crates/qbz-qt/qml/controls/QbzTextArea.qml b/crates/qbz-qt/qml/controls/QbzTextArea.qml index 03ce073ee..67bbe2c57 100644 --- a/crates/qbz-qt/qml/controls/QbzTextArea.qml +++ b/crates/qbz-qt/qml/controls/QbzTextArea.qml @@ -33,7 +33,7 @@ Rectangle { width: 240 height: 96 radius: theme.radiusSm - color: theme.surfaceElevated + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) border.width: 1 border.color: input.activeFocus ? theme.accent : theme.borderSubtle diff --git a/crates/qbz-qt/qml/controls/SettingsButton.qml b/crates/qbz-qt/qml/controls/SettingsButton.qml index 6aba6e94a..6821ebaf7 100644 --- a/crates/qbz-qt/qml/controls/SettingsButton.qml +++ b/crates/qbz-qt/qml/controls/SettingsButton.qml @@ -36,7 +36,7 @@ Rectangle { border.width: root.activeFocus ? 2 : 1 border.color: root.activeFocus ? theme.accent : (danger ? theme.danger : theme.borderSubtle) - color: enabled && btnArea.containsMouse ? theme.surfaceHover : theme.surfaceElevated + color: enabled && btnArea.containsMouse ? theme.surfaceHover : (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) opacity: enabled ? 1.0 : 0.4 activeFocusOnTab: enabled Accessible.role: Accessible.Button diff --git a/crates/qbz-qt/qml/shell/HeaderBar.qml b/crates/qbz-qt/qml/shell/HeaderBar.qml index c5a994f5b..f02362947 100644 --- a/crates/qbz-qt/qml/shell/HeaderBar.qml +++ b/crates/qbz-qt/qml/shell/HeaderBar.qml @@ -63,6 +63,9 @@ Rectangle { // HeaderBar.slint's with-alpha(app-background-surface-alpha)). color: ambientOn ? theme.surfaceCardA50 : theme.surfaceCard readonly property bool ambientOn: theme.ambientOn + /// The fill of an ACTIVE nav item / open button: elevated, at half alpha + /// under the ambient field like every other chrome control. + readonly property color activeFill: root.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated /// Raised by the app menu's "Report an issue" row; AppShell owns the modal. @@ -312,7 +315,7 @@ Rectangle { height: 30 width: purchaseRow.implicitWidth radius: theme.radiusSm - color: purchaseTab.isActive ? theme.surfaceElevated + color: purchaseTab.isActive ? root.activeFill : purchaseArea.containsMouse ? theme.surfaceHover : "transparent" Row { @@ -363,7 +366,7 @@ Rectangle { width: tabRow.implicitWidth radius: theme.radiusSm opacity: isEnabled ? 1.0 : 0.5 - color: isActive ? theme.surfaceElevated + color: isActive ? root.activeFill : (tabArea.containsMouse && isEnabled) ? theme.surfaceHover : "transparent" Row { @@ -439,7 +442,7 @@ Rectangle { height: 30 radius: theme.radiusSm opacity: isEnabled ? 1.0 : 0.5 - color: isActive ? theme.surfaceElevated + color: isActive ? root.activeFill : (cnbArea.containsMouse && isEnabled) ? theme.surfaceHover : "transparent" // Baked glyph, or the section's own raw image when it carries one // (My QBZ branding) — see shell/NavSectionGlyph.qml. @@ -640,7 +643,7 @@ Rectangle { height: 30 radius: theme.radiusSm anchors.verticalCenter: parent.verticalCenter - color: plPopup.opened ? theme.surfaceElevated + color: plPopup.opened ? root.activeFill : plBtnArea.containsMouse ? theme.surfaceHover : "transparent" QbzIcon { name: "list-music" diff --git a/crates/qbz-qt/qml/shell/OrbitBanner.qml b/crates/qbz-qt/qml/shell/OrbitBanner.qml index 7325e1aef..a1ed412dc 100644 --- a/crates/qbz-qt/qml/shell/OrbitBanner.qml +++ b/crates/qbz-qt/qml/shell/OrbitBanner.qml @@ -12,7 +12,7 @@ Rectangle { property string hostName: "" visible: remoteActive height: remoteActive ? Math.max(38, label.implicitHeight + 16) : 0 - color: theme.surfaceElevated + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) border.width: 1 border.color: theme.accent Accessible.role: Accessible.StaticText diff --git a/crates/qbz-qt/qml/shell/QueuePanel.qml b/crates/qbz-qt/qml/shell/QueuePanel.qml index eb9dd76b6..f9bd286c9 100644 --- a/crates/qbz-qt/qml/shell/QueuePanel.qml +++ b/crates/qbz-qt/qml/shell/QueuePanel.qml @@ -429,7 +429,7 @@ Rectangle { height: 34 radius: 4 anchors.verticalCenter: parent.verticalCenter - color: theme.surfaceElevated + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) // No clip: RoundedImage self-confines. One batch root per // visible queue row. RoundedImage { @@ -893,7 +893,8 @@ Rectangle { width: parent.width height: 44 radius: theme.radiusSm - color: theme.surfaceElevated + // Ambient-aware: the one opaque card left in a translucent sidebar. + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) Row { anchors.fill: parent anchors.leftMargin: 6 @@ -906,7 +907,7 @@ Rectangle { height: 34 radius: 4 anchors.verticalCenter: parent.verticalCenter - color: theme.surfaceCard + color: (theme.ambientOn ? theme.surfaceCardA50 : theme.surfaceCard) // No clip: RoundedImage self-confines. RoundedImage { anchors.fill: parent diff --git a/crates/qbz-qt/qml/shell/Sidebar.qml b/crates/qbz-qt/qml/shell/Sidebar.qml index 364dc467e..3529ea280 100644 --- a/crates/qbz-qt/qml/shell/Sidebar.qml +++ b/crates/qbz-qt/qml/shell/Sidebar.qml @@ -1009,7 +1009,7 @@ Rectangle { anchors.verticalCenter: parent.verticalCenter height: 22 radius: 4 - color: theme.surfaceElevated + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) border.width: 1 border.color: theme.borderSubtle TextInput { @@ -1286,7 +1286,7 @@ Rectangle { width: parent.width - 4 * 26 height: 22 radius: 4 - color: theme.surfaceElevated + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) border.width: 1 border.color: theme.borderSubtle TextInput { diff --git a/crates/qbz-qt/qml/views/AlbumView.qml b/crates/qbz-qt/qml/views/AlbumView.qml index 5b50fcc2f..feb59b0ed 100644 --- a/crates/qbz-qt/qml/views/AlbumView.qml +++ b/crates/qbz-qt/qml/views/AlbumView.qml @@ -1591,7 +1591,8 @@ Rectangle { height: 30 radius: 6 anchors.verticalCenter: parent.verticalCenter - color: selectToggleArea.containsMouse ? theme.surfaceHover : theme.surfaceElevated + color: selectToggleArea.containsMouse ? theme.surfaceHover + : (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) border.width: 1 border.color: root.multiSelect ? theme.accent : theme.borderSubtle QbzIcon { diff --git a/crates/qbz-qt/qml/views/PlayHistoryView.qml b/crates/qbz-qt/qml/views/PlayHistoryView.qml index 4a52bbff8..0e6ffdaf2 100644 --- a/crates/qbz-qt/qml/views/PlayHistoryView.qml +++ b/crates/qbz-qt/qml/views/PlayHistoryView.qml @@ -103,7 +103,7 @@ Rectangle { radius: 6 border.width: 1 border.color: theme.borderSubtle - color: theme.surfaceElevated + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) Row { anchors.fill: parent diff --git a/crates/qbz-qt/qml/views/PurchasesView.qml b/crates/qbz-qt/qml/views/PurchasesView.qml index c6d71c45b..08d71aaed 100644 --- a/crates/qbz-qt/qml/views/PurchasesView.qml +++ b/crates/qbz-qt/qml/views/PurchasesView.qml @@ -355,7 +355,7 @@ Rectangle { required property var modelData width: Math.max(96, kioskTabLabel.implicitWidth + 24) height: 64 - color: root.tab === modelData.id ? theme.surfaceElevated : "transparent" + color: root.tab === modelData.id ? (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) : "transparent" Text { id: kioskTabLabel; anchors.centerIn: parent; text: parent.modelData.label; color: theme.textPrimary; font.pixelSize: 18 } MouseArea { anchors.fill: parent; onClicked: QbzPurchases.setTab(parent.modelData.id) } } diff --git a/crates/qbz-qt/qml/views/QueueView.qml b/crates/qbz-qt/qml/views/QueueView.qml index b7c8d2f71..e6c71d03b 100644 --- a/crates/qbz-qt/qml/views/QueueView.qml +++ b/crates/qbz-qt/qml/views/QueueView.qml @@ -885,7 +885,7 @@ Rectangle { width: root.kioskHost ? 64 : 36 height: root.kioskHost ? 64 : 36 radius: theme.radiusSm - color: theme.surfaceCard + color: (theme.ambientOn ? theme.surfaceCardA50 : theme.surfaceCard) border.width: 1 border.color: root.followPlaying ? theme.accent : theme.borderSubtle @@ -908,7 +908,7 @@ Rectangle { width: root.kioskHost ? 64 : 36 height: root.kioskHost ? 64 : 36 radius: theme.radiusSm - color: theme.surfaceCard + color: (theme.ambientOn ? theme.surfaceCardA50 : theme.surfaceCard) border.width: 1 border.color: theme.borderSubtle QbzIconButton { diff --git a/crates/qbz-qt/qml/views/library/LibraryToolbar.qml b/crates/qbz-qt/qml/views/library/LibraryToolbar.qml index 619ef3d43..37e49ecde 100644 --- a/crates/qbz-qt/qml/views/library/LibraryToolbar.qml +++ b/crates/qbz-qt/qml/views/library/LibraryToolbar.qml @@ -82,7 +82,7 @@ Item { width: 30 height: 30 radius: 6 - color: active ? theme.surfaceElevated + color: active ? (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) : ttArea.containsMouse ? theme.surfaceHover : "transparent" QbzIcon { name: parent.name @@ -234,7 +234,9 @@ Item { y: 25 - height / 2 width: tabRow.width height: tabRow.height - color: theme.surfaceElevated + // Ambient-aware like the tab bar it hosts (the strip read opaque + // under the ambient field while Discover's and Local's had alpha). + color: (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) radius: 6 Row { id: tabRow diff --git a/crates/qbz-qt/qml/views/local/LocalIconSelect.qml b/crates/qbz-qt/qml/views/local/LocalIconSelect.qml index 1042b0e16..2b85c1310 100644 --- a/crates/qbz-qt/qml/views/local/LocalIconSelect.qml +++ b/crates/qbz-qt/qml/views/local/LocalIconSelect.qml @@ -40,7 +40,7 @@ Item { radius: 6 border.width: 1 border.color: root.marked ? theme.accent : theme.borderSubtle - color: btnArea.containsMouse ? theme.surfaceHover : theme.surfaceElevated + color: btnArea.containsMouse ? theme.surfaceHover : (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) QbzIcon { name: root.iconName width: 15 diff --git a/crates/qbz-qt/qml/views/local/TreeRow.qml b/crates/qbz-qt/qml/views/local/TreeRow.qml index 6fff7fa07..18e94645d 100644 --- a/crates/qbz-qt/qml/views/local/TreeRow.qml +++ b/crates/qbz-qt/qml/views/local/TreeRow.qml @@ -35,7 +35,7 @@ Rectangle { height: 26 radius: 6 - color: selected ? theme.surfaceElevated + color: selected ? (theme.ambientOn ? theme.surfaceElevatedA50 : theme.surfaceElevated) : rowArea.containsMouse ? theme.surfaceHover : "transparent" // Row body — declared FIRST so the chevron / checkbox win their clicks.