Salastil/DankMaterialShell
1
0
Fork 0
mirror of https://github.com/AvengeMedia/DankMaterialShell.git synced 2026-10-17 00:34:01 -04:00
Code Packages Releases Activity

theme: unify every selected list fill on selectedContainer

Browse Source
This commit is contained in:
bbedward
2026-09-28 16:05:12 -04:00
parent ffe2da7e99
commit f9de6b86ea
31 changed files with 102 additions and 110 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dank-qml-common
+1 -1
Submodule dank-qml-common updated: ed962e6c03...3ceee0174f
flake.lock
Generated
+3 -3
View File
@@ -3,11 +3,11 @@
"dank-qml-common": {
"flake": false,
"locked": {
"lastModified": 1790620949,
"narHash": "sha256-GtqOop7cBhuRo8K8iUbIwrAGGwh/gDv2czNkBv/sTBo=",
"lastModified": 1790625801,
"narHash": "sha256-0Kp9h1acdzOHcSixIXV5TCOfDsWzrOnfW9JX6/RaeuA=",
"owner": "AvengeMedia",
"repo": "dank-qml-common",
"rev": "ed962e6c03f38cd1bc24d617d1ed551989a9eb70",
"rev": "3ceee0174f558a0908eea83910f07af24dc8dc73",
"type": "github"
},
"original": {
quickshell/Common/Theme.qml
+7 -5
View File
@@ -244,7 +244,7 @@ Singleton {
"primaryContainer": getMatugenColorForMode(colorMode, "primary_container", "#1976d2"),
"onPrimaryContainer": getMatugenColorForMode(colorMode, "on_primary_container"),
"secondary": getMatugenColorForMode(colorMode, "secondary", "#8ab4f8"),
"secondaryContainer": getMatugenColorForMode(colorMode, "secondary_container", getMatugenColorForMode(colorMode, "surface_container_high", "#292b2f")),
"secondaryContainer": getMatugenColorForMode(colorMode, "secondary_container"),
"onSecondaryContainer": getMatugenColorForMode(colorMode, "on_secondary_container"),
"tertiary": getMatugenColorForMode(colorMode, "tertiary", "#efb8c8"),
"tertiaryContainer": getMatugenColorForMode(colorMode, "tertiary_container", getMatugenColorForMode(colorMode, "surface_container_high", "#292b2f")),
@@ -411,9 +411,11 @@ Singleton {
property color primaryContainer: currentThemeData.primaryContainer || blend(surfaceContainerHigh, primary, 0.45)
property color secondaryContainer: currentThemeData.secondaryContainer || blend(surfaceContainerHigh, secondary, 0.35)
property color tertiaryContainer: currentThemeData.tertiaryContainer || blend(surfaceContainerHigh, tertiary, 0.35)
readonly property bool tonalPrimaryContainer: Contrast.isTonal(primaryContainer, surfaceText)
readonly property color selectedContainer: tonalPrimaryContainer ? primaryContainer : Contrast.tintedContainer(surfaceContainerHigh, primary, surfaceText)
readonly property color accentOnPrimaryContainer: Contrast.ratio(primary, primaryContainer) >= 3 ? primary : onPrimaryContainer
readonly property real selectedContainerTint: currentThemeData.selectedContainerTint ?? 0.2
readonly property bool themedSelectedContainer: !!currentThemeData.secondaryContainer && Contrast.isTonal(secondaryContainer, onSecondaryContainer) && Contrast.isTonal(secondaryContainer, surfaceText)
readonly property color selectedContainer: currentThemeData.selectedContainer || (themedSelectedContainer ? secondaryContainer : Contrast.subtleTint(surfaceContainerHigh, primary, surfaceText, selectedContainerTint))
readonly property color accentOnSelectedContainer: currentThemeData.accentOnSelectedContainer || (Contrast.ratio(primary, selectedContainer) >= 3 ? primary : onSelectedContainer)
readonly property color accentOnPrimaryContainer: currentThemeData.accentOnPrimaryContainer || (Contrast.ratio(primary, primaryContainer) >= 3 ? primary : onPrimaryContainer)
readonly property var accents: Accents.derive(primary, isLightMode, currentThemeData.accents ?? null)
property color inverseSurface: currentThemeData.inverseSurface || surfaceText
property color inverseOnSurface: currentThemeData.inverseOnSurface || surface
@@ -481,7 +483,7 @@ Singleton {
Binding {
target: root
property: "onSelectedContainer"
value: root.tonalPrimaryContainer ? root.onPrimaryContainer : root.surfaceText
value: root.currentThemeData.onSelectedContainer || (root.currentThemeData.selectedContainer ? Contrast.readableOn(root.selectedContainer, root.onContainerCandidates) : root.themedSelectedContainer ? root.onSecondaryContainer : root.surfaceText)
}
]
readonly property var onContainerCandidates: [surfaceText, surface, contrastLight, contrastDark]
quickshell/Modals/PowerProfileModal.qml
+7 -9
View File
@@ -188,7 +188,7 @@ DankModal {
color: {
if (isActive)
return Theme.primaryPressed;
return Theme.selectedContainer;
if (isSelected)
return Theme.primaryHoverLight;
if (mouseArea.containsMouse)
@@ -196,8 +196,8 @@ DankModal {
return Theme.floatingWindowNestedSurface;
}
border.color: isActive ? Theme.primary : (isSelected ? Theme.withAlpha(Theme.primary, 0.5) : Theme.outlineMedium)
border.width: (isActive || isSelected) ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
border.color: isSelected ? Theme.focusRingColor : Theme.outlineMedium
border.width: isSelected ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
// Shortcut Key Badge on Top-Right Corner
Rectangle {
@@ -207,15 +207,13 @@ DankModal {
width: 20
height: 20
radius: Theme.cornerRadiusXS
color: isActive ? Theme.primaryPressed : Theme.chipSurface
border.color: isActive ? Theme.primary : Theme.withAlpha(Theme.primary, 0)
border.width: isActive ? 1 : 0
color: Theme.chipSurface
StyledText {
text: (index + 1).toString()
font.pixelSize: Theme.fontSizeSmall
font.weight: Theme.fontWeightMedium
color: isActive ? Theme.primary : Theme.surfaceTextMedium
color: isActive ? Theme.accentOnSelectedContainer : Theme.surfaceTextMedium
anchors.centerIn: parent
}
}
@@ -227,7 +225,7 @@ DankModal {
DankIcon {
name: Theme.getPowerProfileIcon(modelData)
size: Theme.iconSize + 16
color: isActive ? Theme.primary : Theme.surfaceText
color: isActive ? Theme.accentOnSelectedContainer : Theme.surfaceText
filled: isActive
anchors.horizontalCenter: parent.horizontalCenter
}
@@ -235,7 +233,7 @@ DankModal {
StyledText {
text: Theme.getPowerProfileLabel(modelData)
font.pixelSize: Theme.fontSizeMedium
color: isActive ? Theme.primary : Theme.surfaceText
color: isActive ? Theme.onSelectedContainer : Theme.surfaceText
font.weight: Theme.fontWeightMedium
anchors.horizontalCenter: parent.horizontalCenter
}
quickshell/Modules/ControlCenter/BuiltinPlugins/DisplayProfilesWidget.qml
-1
View File
@@ -106,7 +106,6 @@ PluginComponent {
iconName: "monitor"
title: modelData.name
active: modelData.id === root.activeProfileId && !root.autoMode
showActiveCheck: true
enabled: !root.autoMode
clickable: true
onClicked: DisplayConfigState.activateProfile(modelData.id)
quickshell/Modules/ControlCenter/Details/AudioInputDetail.qml
-1
View File
@@ -88,7 +88,6 @@ Item {
title: AudioService.displayName(modelData)
subtitle: active ? I18n.tr("Active") : I18n.tr("Available")
active: modelData === AudioService.source
showActiveCheck: true
clickable: true
onClicked: {
if (modelData?.name)
quickshell/Modules/ControlCenter/Details/AudioOutputDetail.qml
-1
View File
@@ -91,7 +91,6 @@ Item {
title: AudioService.displayName(modelData)
subtitle: active ? I18n.tr("Active") : I18n.tr("Available")
active: modelData === AudioService.sink
showActiveCheck: true
clickable: true
onClicked: {
if (modelData?.name)
quickshell/Modules/ControlCenter/Details/AudioPortSelector.qml
-1
View File
@@ -118,7 +118,6 @@ CcSheetDialog {
return "";
}
active: modelData.name === root.currentPort
showActiveCheck: true
enabled: !unavailable && !root.isLoading
clickable: !active
onClicked: root.selectPort(modelData.name)
quickshell/Modules/ControlCenter/Details/BluetoothCodecSelector.qml
-1
View File
@@ -109,7 +109,6 @@ CcSheetDialog {
title: modelData.name
subtitle: modelData.description
active: modelData.name === root.currentCodec
showActiveCheck: true
enabled: !root.isLoading
clickable: !active
onClicked: root.selectCodec(modelData.profile)
quickshell/Modules/ControlCenter/Details/BluetoothDetail.qml
+1 -1
View File
@@ -257,7 +257,7 @@ Item {
iconColor: {
if (isConnecting)
return Theme.warning;
return isConnected ? Theme.primary : Theme.surfaceText;
return contentColor;
}
active: isConnected
title: deviceName
quickshell/Modules/ControlCenter/Details/BrightnessDetail.qml
-1
View File
@@ -183,7 +183,6 @@ Item {
iconName: root.deviceIcon(modelData, deviceBrightness)
active: deviceName === root.currentDeviceName
showActiveCheck: true
title: BrightnessService.deviceTitle(modelData)
subtitle: deviceName + " • " + root.deviceClassLabel(modelData)
trailingBadge: Math.round(deviceBrightness) + "%"
quickshell/Modules/ControlCenter/Details/DiskUsageDetail.qml
+1 -2
View File
@@ -64,10 +64,9 @@ Item {
return Theme.error;
if (usage > CcMetrics.diskWarnPercent)
return Theme.warning;
return active ? Theme.primary : Theme.surfaceText;
return contentColor;
}
active: modelData.mount === root.currentMountPath
showActiveCheck: true
title: modelData.mount === "/" ? I18n.tr("Root Filesystem") : modelData.mount
subtitle: `${modelData.used || "?"} / ${modelData.size || "?"}` + (modelData.mount === "/" ? "" : " • " + modelData.mount)
trailingBadge: usage.toFixed(0) + "%"
quickshell/Modules/ControlCenter/Details/NetworkDetail.qml
-1
View File
@@ -446,7 +446,6 @@ Item {
iconName: "lan"
active: modelData.isActive
showActiveCheck: true
title: modelData.id || I18n.tr("Unknown Config")
subtitle: active ? I18n.tr("Connected") : I18n.tr("Available")
clickable: true
quickshell/Modules/ControlCenter/Details/VpnProfileDelegate.qml
+1 -1
View File
@@ -67,7 +67,7 @@ CcListRow {
}
iconName: isConnecting ? "" : (isActive ? "vpn_lock" : (hasError ? "error" : "vpn_key_off"))
iconColor: hasError ? Theme.error : (isActive ? Theme.primary : Theme.surfaceText)
iconColor: hasError ? Theme.error : contentColor
active: isActive
title: profile?.name ?? ""
subtitle: isConnecting ? I18n.tr("Connecting...") : (hasError ? DMSNetworkService.vpnError : VPNService.getVpnTypeFromProfile(profile))
quickshell/Modules/ControlCenter/Widgets/CcListRow.qml
+1 -17
View File
@@ -2,26 +2,10 @@ import QtQuick
import qs.Common
import qs.Modules.ControlCenter
import qs.Modules.Settings.Widgets
import qs.Widgets
SettingsRow {
id: root
property bool active: false
property bool showActiveCheck: false
paddingH: CcMetrics.rowPaddingH
paddingV: CcMetrics.rowPaddingV
rowColor: CcMetrics.rowColor
iconColor: active ? Theme.primary : Theme.surfaceText
Loader {
anchors.verticalCenter: parent.verticalCenter
active: root.active && root.showActiveCheck
sourceComponent: DankIcon {
name: "check"
size: Theme.iconSize
color: Theme.primary
}
}
iconColor: active ? Theme.accentOnSelectedContainer : Theme.surfaceText
}
quickshell/Modules/ControlCenter/Widgets/CcTileActions.qml
-1
View File
@@ -31,7 +31,6 @@ CcTileContent {
iconName: modelData.icon || ""
active: modelData.active ?? false
enabled: modelData.enabled !== false
showActiveCheck: true
clickable: true
paddingH: Theme.spacingM
onClicked: modelData.trigger()
quickshell/Modules/DankBar/Popouts/DWLLayoutPopout.qml
+2 -2
View File
@@ -193,7 +193,7 @@ DankPopout {
DankIcon {
name: root.getLayoutIcon(layoutRow.modelData)
size: Theme.iconSizeMedium
color: layoutRow.isActive ? Theme.primary : layoutRow.contentColor
color: layoutRow.contentColor
anchors.verticalCenter: parent.verticalCenter
}
@@ -204,7 +204,7 @@ DankPopout {
StyledText {
text: root.getLayoutName(layoutRow.modelData)
font.pixelSize: Theme.fontSizeMedium
color: layoutRow.isActive ? Theme.primary : layoutRow.contentColor
color: layoutRow.contentColor
font.weight: layoutRow.isActive ? Theme.fontWeightMedium : Theme.fontWeight
}
quickshell/Modules/DankDash/Media/MediaDeviceRow.qml
+3 -3
View File
@@ -27,8 +27,8 @@ SettingsRow {
clickable: true
paddingH: Theme.spacingL
paddingV: Theme.spacingL
rowColor: selected ? Theme.selectedContainer : Theme.secondaryContainer
titleColor: selected ? Theme.onSelectedContainer : Theme.onSecondaryContainer
rowColor: selected ? Theme.selectedContainer : Theme.chipSurface
titleColor: selected ? Theme.onSelectedContainer : Theme.surfaceText
subtitleColor: titleColor
topRadius: Theme.cornerRadiusLIncreased
bottomRadius: Theme.cornerRadiusLIncreased
@@ -39,7 +39,7 @@ SettingsRow {
width: Theme.iconButtonSize
height: width
radius: Theme.fullRadius(width, height)
color: root.selected ? Theme.onPrimary : Theme.chipSurface
color: root.selected ? Theme.onPrimary : Theme.chipSurfaceNested
DankIcon {
anchors.centerIn: parent
quickshell/Modules/Notepad/NotepadTabs.qml
+3 -3
View File
@@ -140,7 +140,7 @@ Column {
id: tabRect
anchors.fill: parent
radius: Theme.cornerRadius
color: isActive ? Theme.primaryPressed : isHovered ? Theme.primaryHoverLight : Theme.withAlpha(Theme.primaryPressed, 0)
color: isActive ? Theme.selectedContainer : isHovered ? Theme.primaryHoverLight : Theme.withAlpha(Theme.primaryPressed, 0)
border.width: isActive || dragging ? 0 : 1
border.color: dragging ? Theme.primary : Theme.outlineMedium
clip: true
@@ -164,7 +164,7 @@ Column {
return prefix + (modelData.title || "Untitled");
}
font.pixelSize: Theme.fontSizeSmall
color: isActive ? Theme.primary : Theme.surfaceText
color: isActive ? Theme.onSelectedContainer : Theme.surfaceText
font.weight: Theme.fontWeightMedium
elide: Text.ElideMiddle
maximumLineCount: 1
@@ -221,9 +221,9 @@ Column {
}
Rectangle {
id: tabCloseButton
Accessible.role: Accessible.Button
Accessible.name: I18n.tr("Close")
id: tabCloseButton
width: 20
height: 20
radius: Theme.cornerRadius
quickshell/Modules/Notifications/NotificationCard.qml
+1 -1
View File
@@ -73,7 +73,7 @@ Rectangle {
topRightRadius: topLeftRadius
bottomLeftRadius: lastInGroup ? outerRadius : radius
bottomRightRadius: bottomLeftRadius
color: surfaceColor
color: keyboardSelected ? Theme.selectedContainer : surfaceColor
border.width: Theme.layerOutlineWidth
border.color: Theme.outlineMedium
clip: true
quickshell/Modules/Settings/DesktopWidgetBrowser.qml
+3 -3
View File
@@ -41,9 +41,9 @@ WidgetPickerWindow {
height: 72
radius: Theme.cornerRadius
property bool isSelected: root.keyboardNavigationActive && index === root.selectedIndex
color: isSelected ? Theme.primarySelected : widgetArea.containsMouse ? Theme.primaryHover : Theme.floatingWindowNestedSurface
border.color: isSelected ? Theme.primary : Theme.outlineMedium
border.width: isSelected ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
color: isSelected ? Theme.selectedContainer : widgetArea.containsMouse ? Theme.primaryHover : Theme.floatingWindowNestedSurface
border.color: Theme.outlineMedium
border.width: Theme.layerOutlineWidth
Row {
anchors.fill: parent
quickshell/Modules/Settings/NetworkCellularTab.qml
+10 -10
View File
@@ -96,9 +96,9 @@ Item {
width: parent.width
height: 56
radius: Theme.cornerRadius
color: modemMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.width: isConnected ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
border.color: isConnected ? Theme.primary : Theme.outlineMedium
color: isConnected ? Theme.selectedContainer : modemMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.width: Theme.layerOutlineWidth
border.color: Theme.outlineMedium
Row {
anchors.left: parent.left
@@ -111,7 +111,7 @@ Item {
DankIcon {
name: "network_cell"
size: 20
color: modemDelegate.isConnected ? Theme.primary : Theme.surfaceText
color: modemDelegate.isConnected ? Theme.accentOnSelectedContainer : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
@@ -123,7 +123,7 @@ Item {
StyledText {
text: modelData.name || I18n.tr("Unknown")
font.pixelSize: Theme.fontSizeMedium
color: modemDelegate.isConnected ? Theme.primary : Theme.surfaceText
color: modemDelegate.isConnected ? Theme.onSelectedContainer : Theme.surfaceText
font.weight: Theme.fontWeightMedium
elide: Text.ElideRight
width: parent.width
@@ -231,9 +231,9 @@ Item {
width: parent.width
height: 56
radius: Theme.cornerRadius
color: profileMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.color: isActive ? Theme.primary : Theme.outlineMedium
border.width: isActive ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
color: isActive ? Theme.selectedContainer : profileMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.color: Theme.outlineMedium
border.width: Theme.layerOutlineWidth
Row {
anchors.left: parent.left
@@ -246,7 +246,7 @@ Item {
DankIcon {
name: "sim_card"
size: 20
color: profileDelegate.isActive ? Theme.primary : Theme.surfaceText
color: profileDelegate.isActive ? Theme.accentOnSelectedContainer : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
@@ -258,7 +258,7 @@ Item {
StyledText {
text: modelData.id || I18n.tr("Unknown")
font.pixelSize: Theme.fontSizeMedium
color: profileDelegate.isActive ? Theme.primary : Theme.surfaceText
color: profileDelegate.isActive ? Theme.onSelectedContainer : Theme.surfaceText
font.weight: Theme.fontWeightMedium
elide: Text.ElideRight
width: parent.width
quickshell/Modules/Settings/NetworkEthernetTab.qml
+12 -12
View File
@@ -84,9 +84,9 @@ Item {
width: parent.width
height: isExpanded ? 56 + ethExpandedContent.height : 56
radius: Theme.cornerRadius
color: ethDeviceMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.width: isConnected ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
border.color: isConnected ? Theme.primary : Theme.outlineMedium
color: isConnected ? Theme.selectedContainer : ethDeviceMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.width: Theme.layerOutlineWidth
border.color: Theme.outlineMedium
clip: true
Behavior on height {
@@ -115,7 +115,7 @@ Item {
DankIcon {
name: "lan"
size: 20
color: isConnected ? Theme.primary : Theme.surfaceText
color: isConnected ? Theme.accentOnSelectedContainer : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
@@ -127,7 +127,7 @@ Item {
StyledText {
text: modelData.name || I18n.tr("Unknown")
font.pixelSize: Theme.fontSizeMedium
color: isConnected ? Theme.primary : Theme.surfaceText
color: isConnected ? Theme.onSelectedContainer : Theme.surfaceText
font.weight: Theme.fontWeightMedium
elide: Text.ElideRight
width: parent.width
@@ -152,7 +152,7 @@ Item {
}
}
font.pixelSize: Theme.fontSizeSmall
color: isConnected ? Theme.primary : Theme.surfaceVariantText
color: isConnected ? Theme.onSelectedContainer : Theme.surfaceVariantText
}
StyledText {
@@ -380,9 +380,9 @@ Item {
width: parent.width
height: 48
radius: Theme.cornerRadius
color: wiredMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.width: modelData.isActive ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
border.color: modelData.isActive ? Theme.primary : Theme.outlineMedium
color: modelData.isActive ? Theme.selectedContainer : wiredMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.width: Theme.layerOutlineWidth
border.color: Theme.outlineMedium
Row {
anchors.left: parent.left
@@ -393,7 +393,7 @@ Item {
DankIcon {
name: "lan"
size: 20
color: modelData.isActive ? Theme.primary : Theme.surfaceText
color: modelData.isActive ? Theme.accentOnSelectedContainer : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
@@ -404,14 +404,14 @@ Item {
StyledText {
text: modelData.id || I18n.tr("Unknown")
font.pixelSize: Theme.fontSizeMedium
color: modelData.isActive ? Theme.primary : Theme.surfaceText
color: modelData.isActive ? Theme.onSelectedContainer : Theme.surfaceText
font.weight: Theme.fontWeightMedium
}
StyledText {
text: modelData.isActive ? I18n.tr("Active") : ""
font.pixelSize: Theme.fontSizeSmall
color: Theme.primary
color: Theme.onSelectedContainer
visible: modelData.isActive
}
}
quickshell/Modules/Settings/NetworkVpnTab.qml
+6 -6
View File
@@ -191,9 +191,9 @@ Item {
width: parent.width
height: isExpanded ? 56 + vpnExpandedContent.height : 56
radius: Theme.cornerRadius
color: vpnRowArea.containsMouse ? Theme.primaryHoverLight : (isActive ? Theme.primaryPressed : Theme.floatingWindowNestedSurface)
border.width: isActive ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
border.color: isActive ? Theme.primary : Theme.outlineMedium
color: isActive ? Theme.selectedContainer : vpnRowArea.containsMouse ? Theme.primaryHoverLight : Theme.floatingWindowNestedSurface
border.width: Theme.layerOutlineWidth
border.color: Theme.outlineMedium
opacity: DMSNetworkService.isBusy ? 0.6 : 1.0
clip: true
@@ -226,7 +226,7 @@ Item {
DankIcon {
name: isActive ? "vpn_lock" : "vpn_key_off"
size: 20
color: isActive ? Theme.primary : Theme.surfaceText
color: isActive ? Theme.accentOnSelectedContainer : Theme.surfaceText
anchors.verticalCenter: parent.verticalCenter
}
@@ -239,7 +239,7 @@ Item {
text: modelData.name
font.pixelSize: Theme.fontSizeMedium
font.weight: Theme.fontWeightMedium
color: isActive ? Theme.primary : Theme.surfaceText
color: isActive ? Theme.onSelectedContainer : Theme.surfaceText
elide: Text.ElideRight
width: parent.width
horizontalAlignment: Text.AlignLeft
@@ -248,7 +248,7 @@ Item {
StyledText {
text: VPNService.getVpnTypeFromProfile(modelData)
font.pixelSize: Theme.fontSizeSmall
color: Theme.surfaceVariantText
color: isActive ? Theme.onSelectedContainer : Theme.surfaceVariantText
anchors.left: parent.left
}
}
quickshell/Modules/Settings/NetworkWifiTab.qml
+8 -6
View File
@@ -317,8 +317,9 @@ Item {
visible: NetworkService.wifiEnabled && !NetworkService.wifiToggling
SettingsRow {
id: wifiNetworkRow
title: wifiNetworkDelegate.modelData.ssid || I18n.tr("Unknown")
titleColor: wifiNetworkDelegate.isConnected ? Theme.primary : Theme.surfaceText
active: wifiNetworkDelegate.isConnected
subtitle: {
const parts = [wifiNetworkDelegate.isConnecting ? I18n.tr("Connecting...") : (wifiNetworkDelegate.isConnected ? I18n.tr("Connected") : (wifiNetworkDelegate.modelData.secured ? I18n.tr("Secured", "adjective, wifi network requires a password, opposite of open") : I18n.tr("Open", "network security type", true)))];
if (wifiNetworkDelegate.modelData.saved)
@@ -328,7 +329,7 @@ Item {
parts.push(wifiNetworkDelegate.modelData.signal + "%");
return parts.join(" • ");
}
subtitleColor: wifiNetworkDelegate.isConnecting ? Theme.warning : (wifiNetworkDelegate.isConnected ? Theme.primary : Theme.surfaceVariantText)
subtitleColor: wifiNetworkDelegate.isConnecting ? Theme.warning : supportingContentColor
clickable: !NetworkService.isWifiConnecting || wifiNetworkDelegate.isConnected
onClicked: {
WifiConnectionActions.connectToNetwork(wifiNetworkDelegate.modelData, {
@@ -357,7 +358,7 @@ Item {
return "wifi_1_bar";
}
size: Theme.iconSizeMedium
color: wifiNetworkDelegate.isConnected ? Theme.primary : Theme.surfaceText
color: wifiNetworkRow.contentColor
anchors.verticalCenter: parent.verticalCenter
}
]
@@ -566,8 +567,9 @@ Item {
spacing: Theme.groupedListGap
SettingsRow {
id: savedWifiRow
title: savedWifiDelegate.modelData.ssid || I18n.tr("Unknown")
titleColor: savedWifiDelegate.isConnected ? Theme.primary : Theme.surfaceText
active: savedWifiDelegate.isConnected
subtitle: {
if (savedWifiDelegate.isConnecting)
return I18n.tr("Connecting...");
@@ -577,7 +579,7 @@ Item {
parts.push(I18n.tr("Hidden"));
return parts.join(" • ");
}
subtitleColor: savedWifiDelegate.isConnecting ? Theme.warning : (savedWifiDelegate.isConnected ? Theme.primary : Theme.surfaceVariantText)
subtitleColor: savedWifiDelegate.isConnecting ? Theme.warning : supportingContentColor
clickable: !savedWifiDelegate.isOutOfRange && (!NetworkService.isWifiConnecting || savedWifiDelegate.isConnected)
onClicked: {
if (savedWifiDelegate.isOutOfRange)
@@ -611,7 +613,7 @@ Item {
return "wifi_1_bar";
}
size: Theme.iconSizeMedium
color: savedWifiDelegate.isConnected ? Theme.primary : Theme.surfaceText
color: savedWifiRow.contentColor
anchors.verticalCenter: parent.verticalCenter
}
]
quickshell/Modules/Settings/WidgetSelectionPopup.qml
+3 -3
View File
@@ -54,9 +54,9 @@ WidgetPickerWindow {
height: Math.max(60, textColumn.implicitHeight + 24)
radius: Theme.cornerRadius
property bool isSelected: root.keyboardNavigationActive && index === root.selectedIndex && !modelData.disabled
color: isSelected ? Theme.withAlpha(Theme.primary, root.blurActive ? 0.22 : 0.16) : widgetArea.containsMouse ? Theme.withAlpha(Theme.primary, root.blurActive ? 0.14 : 0.08) : Theme.floatingWindowNestedSurface
border.color: isSelected ? Theme.primary : Theme.outlineMedium
border.width: isSelected ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
color: isSelected ? Theme.selectedContainer : widgetArea.containsMouse ? Theme.withAlpha(Theme.primary, root.blurActive ? 0.14 : 0.08) : Theme.floatingWindowNestedSurface
border.color: Theme.outlineMedium
border.width: Theme.layerOutlineWidth
antialiasing: true
Row {
quickshell/Modules/Settings/Widgets/AppBrowserPopup.qml
+1 -1
View File
@@ -112,7 +112,7 @@ DankFloatingWindow {
readonly property bool isSelected: root.keyboardNavigationActive && index === root.selectedIndex
color: isSelected ? Theme.withAlpha(Theme.primary, 0.16) : appArea.containsMouse ? Theme.withAlpha(Theme.primary, 0.08) : Theme.floatingWindowNestedSurface
color: isSelected ? Theme.selectedContainer : appArea.containsMouse ? Theme.withAlpha(Theme.primary, 0.08) : Theme.floatingWindowNestedSurface
border.color: isSelected ? Theme.primary : Theme.outlineMedium
border.width: isSelected ? Theme.outlineWidthFocused : Theme.layerOutlineWidth
quickshell/Modules/Settings/Widgets/SettingsMetrics.qml
+1 -1
View File
@@ -42,7 +42,7 @@ Singleton {
readonly property real swatchTileMinWidth: 96
readonly property color rowColor: Theme.foregroundColor(Theme.cardSurface, true)
readonly property color rowHighlightColor: Theme.withAlpha(Theme.primary, highlightBlend)
readonly property color selectedRowColor: Theme.blend(rowColor, Theme.onSurface, Theme.stateLayerDrag)
readonly property color selectedRowColor: Theme.selectedContainer
readonly property int transitionDuration: Theme.expressiveDurations.expressiveFastSpatial
readonly property int fadeDuration: Theme.expressiveDurations.expressiveEffects
readonly property int pageSettleFrames: 2
quickshell/Modules/Settings/Widgets/SettingsRow.qml
+13 -10
View File
@@ -22,19 +22,22 @@ T.Control {
property string title: ""
property bool singleLineTitle: false
property string subtitle: ""
property color subtitleColor: Theme.surfaceVariantText
property color subtitleColor: supportingContentColor
property string iconName: ""
property bool iconBox: false
property bool clickable: false
property bool showChevron: false
property string trailingBadge: ""
property color trailingBadgeColor: Theme.surfaceVariantText
property color trailingBadgeColor: supportingContentColor
property bool paintBackground: !(parent?.isSettingsGroupHost ?? false)
property real paddingH: SettingsMetrics.rowPaddingH
property real paddingV: SettingsMetrics.rowPaddingV
property color rowColor: SettingsMetrics.rowColor
property color iconColor: Theme.primary
property color titleColor: Theme.surfaceText
property bool active: false
readonly property color contentColor: active ? Theme.onSelectedContainer : Theme.surfaceText
readonly property color supportingContentColor: active ? Theme.onSelectedContainer : Theme.surfaceVariantText
property color iconColor: active ? Theme.accentOnSelectedContainer : Theme.primary
property color titleColor: contentColor
property var resetStore: SettingsData
property var resetKeys: settingKey !== "" && resetStore === SettingsData && SettingsData.hasSetting(settingKey) ? [settingKey] : []
@@ -123,7 +126,7 @@ T.Control {
Rectangle {
anchors.fill: parent
visible: root.paintBackground
color: root.isHighlighted ? Theme.blend(root.rowColor, Theme.primary, SettingsMetrics.highlightBlend) : root.rowColor
color: root.active ? Theme.selectedContainer : root.isHighlighted ? Theme.blend(root.rowColor, Theme.primary, SettingsMetrics.highlightBlend) : root.rowColor
border.width: Theme.layerOutlineWidth
border.color: Theme.outlineMedium
topLeftRadius: root.topRadius
@@ -134,8 +137,8 @@ T.Control {
Rectangle {
anchors.fill: parent
visible: !root.paintBackground && root.isHighlighted
color: SettingsMetrics.rowHighlightColor
visible: !root.paintBackground && (root.active || root.isHighlighted)
color: root.active ? Theme.selectedContainer : SettingsMetrics.rowHighlightColor
topLeftRadius: root.topRadius
topRightRadius: root.topRadius
bottomLeftRadius: root.bottomRadius
@@ -146,7 +149,7 @@ T.Control {
id: stateLayer
anchors.fill: parent
visible: root.clickable
color: Theme.surfaceText
color: root.contentColor
opacity: !root.enabled ? 0 : (clickControl.down ? Theme.stateLayerPressed : (clickControl.hovered ? Theme.stateLayerHover : 0))
topLeftRadius: root.topRadius
topRightRadius: root.topRadius
@@ -166,7 +169,7 @@ T.Control {
DankRipple {
id: ripple
visible: root.clickable
rippleColor: Theme.surfaceText
rippleColor: root.contentColor
topLeftRadius: root.topRadius
topRightRadius: root.topRadius
bottomLeftRadius: root.bottomRadius
@@ -332,7 +335,7 @@ T.Control {
DankIcon {
name: "chevron_right"
size: Theme.iconSize
color: Theme.surfaceVariantText
color: root.supportingContentColor
rotation: I18n.isRtl ? 180 : 0
visible: root.showChevron
anchors.verticalCenter: parent.verticalCenter
quickshell/Modules/Settings/Widgets/SettingsSidebarItem.qml
+2 -2
View File
@@ -128,7 +128,7 @@ Rectangle {
text: root.title
font.pixelSize: Theme.fontSizeMedium
font.weight: Theme.fontWeightMedium
color: Theme.surfaceText
color: root.active ? Theme.onSelectedContainer : Theme.surfaceText
wrapMode: Text.WordWrap
horizontalAlignment: Text.AlignLeft
}
@@ -137,7 +137,7 @@ Rectangle {
width: parent.width
text: root.hint
font.pixelSize: Theme.fontSizeSmall
color: Theme.surfaceVariantText
color: root.active ? Theme.onSelectedContainer : Theme.surfaceVariantText
wrapMode: Text.WordWrap
maximumLineCount: 2
elide: Text.ElideRight
quickshell/tests/qml/theme-selected-container.qml
+12
View File
@@ -46,9 +46,21 @@ ShellRoot {
Theme.customThemeData = nord;
Theme.currentTheme = "custom";
check(readable(Theme.onSelectedContainer, Theme.selectedContainer, 4.5), "selection text readable on tinted fill");
check(readable(Theme.surfaceText, Theme.selectedContainer, 4.5), "surface text readable on the selected fill");
check(readable(Theme.accentOnSelectedContainer, Theme.selectedContainer, 3), "selected icon readable");
check(Contrast.ratio(Theme.selectedContainer, Theme.surfaceContainerHigh) > 1.05, "selected fill differs from the row surface");
check(readable(Theme.onPrimaryContainer, Theme.primaryContainer, 4.5), "derived onPrimaryContainer readable");
check(readable(Theme.accentOnPrimaryContainer, Theme.primaryContainer, 3), "icon box glyph readable");
check(readable(Theme.onSecondaryContainer, Theme.secondaryContainer, 4.5), "derived onSecondaryContainer readable");
Theme.customThemeData = Object.assign({}, nord, {
"selectedContainer": "#5e81ac",
"onSelectedContainer": "#eceff4",
"accentOnSelectedContainer": "#a3be8c",
"accentOnPrimaryContainer": "#bf616a"
});
check(Theme.selectedContainer.toString() === "#5e81ac" && Theme.onSelectedContainer.toString() === "#eceff4", "explicit selection colors are not derived over");
check(Theme.accentOnSelectedContainer.toString() === "#a3be8c" && Theme.accentOnPrimaryContainer.toString() === "#bf616a", "explicit accent colors are not derived over");
console.log(root.failed ? "FIXTURE_FAIL see above" : "FIXTURE_PASS");
Qt.quit();
}