diff --git a/quickshell/Common/SettingsData.qml b/quickshell/Common/SettingsData.qml index d54fc90f2..4f5fbf025 100644 --- a/quickshell/Common/SettingsData.qml +++ b/quickshell/Common/SettingsData.qml @@ -184,6 +184,8 @@ Singleton { property string hostSurfaceCustomColor: Spec.SPEC.hostSurfaceCustomColor.def property string cardSurfaceColor: Spec.SPEC.cardSurfaceColor.def property string cardSurfaceCustomColor: Spec.SPEC.cardSurfaceCustomColor.def + property string tooltipSurfaceColor: Spec.SPEC.tooltipSurfaceColor.def + property string tooltipSurfaceCustomColor: Spec.SPEC.tooltipSurfaceCustomColor.def property string chipSurfaceColor: Spec.SPEC.chipSurfaceColor.def property string chipSurfaceCustomColor: Spec.SPEC.chipSurfaceCustomColor.def property string chipSurfaceNestedColor: Spec.SPEC.chipSurfaceNestedColor.def @@ -340,10 +342,6 @@ Singleton { onBlurLayerOutlineOpacityChanged: saveSettings() property real sectionDividerOpacity: Spec.SPEC.sectionDividerOpacity.def onSectionDividerOpacityChanged: saveSettings() - property string tooltipSurfaceColor: Spec.SPEC.tooltipSurfaceColor.def - onTooltipSurfaceColorChanged: saveSettings() - property string tooltipSurfaceCustomColor: Spec.SPEC.tooltipSurfaceCustomColor.def - onTooltipSurfaceCustomColorChanged: saveSettings() property bool blurBorderEnabled: Spec.SPEC.blurBorderEnabled.def onBlurBorderEnabledChanged: saveSettings() property string blurBorderColor: Spec.SPEC.blurBorderColor.def diff --git a/quickshell/Common/Theme.qml b/quickshell/Common/Theme.qml index 14c1c4455..5c71c1712 100644 --- a/quickshell/Common/Theme.qml +++ b/quickshell/Common/Theme.qml @@ -222,6 +222,8 @@ Singleton { "surfaceContainer": getMatugenColorForMode(colorMode, "surface_container", "#1e2023"), "surfaceContainerHigh": getMatugenColorForMode(colorMode, "surface_container_high", "#292b2f"), "surfaceContainerHighest": getMatugenColorForMode(colorMode, "surface_container_highest", "#343740"), + "inverseSurface": getMatugenColorForMode(colorMode, "inverse_surface", getMatugenColorForMode(colorMode === "light" ? "dark" : "light", "surface", "#fdf7fe")), + "inverseOnSurface": getMatugenColorForMode(colorMode, "inverse_on_surface", getMatugenColorForMode(colorMode === "light" ? "dark" : "light", "on_surface", "#302e33")), "error": getMatugenColorForMode(colorMode, "error", "#F2B8B5"), "errorText": getMatugenColorForMode(colorMode, "on_error"), "errorContainer": getMatugenColorForMode(colorMode, "error_container"), @@ -368,6 +370,8 @@ Singleton { readonly property color cardSurface: typeof SettingsData === "undefined" ? surfaceContainer : surfaceRoleColor(SettingsData.cardSurfaceColor, SettingsData.cardSurfaceCustomColor, surfaceContainer) readonly property color chipSurface: typeof SettingsData === "undefined" ? surfaceContainerHigh : surfaceRoleColor(SettingsData.chipSurfaceColor, SettingsData.chipSurfaceCustomColor, surfaceContainerHigh) readonly property color chipSurfaceNested: typeof SettingsData === "undefined" ? surfaceContainerHighest : surfaceRoleColor(SettingsData.chipSurfaceNestedColor, SettingsData.chipSurfaceNestedCustomColor, surfaceContainerHighest) + readonly property color tooltipSurface: typeof SettingsData === "undefined" ? surfaceContainerHighest : surfaceRoleColor(SettingsData.tooltipSurfaceColor, SettingsData.tooltipSurfaceCustomColor, surfaceContainerHighest) + readonly property color tooltipText: Contrast.readableOn(tooltipSurface, [surfaceText, (isLightColor(tooltipSurface) ? contrastDark : contrastLight)]) readonly property real containerSaturation: typeof SettingsData === "undefined" ? 1 : SettingsData.containerSaturation / 100 readonly property real containerTint: (currentThemeData.containerTint ?? Tonal.defaultTint(surfaceContainer)) * containerSaturation property color primaryContainer: currentThemeData.softPrimaryContainer || Tonal.softContainer(primary, surfaceContainer, containerTint) @@ -631,6 +635,8 @@ Singleton { return surfaceContainerHigh; case "schh": return surfaceContainerHighest; + case "inverseSurface": + return inverseSurface; case "sth": return surfaceTextHover; case "error": diff --git a/quickshell/Modules/Settings/WallpaperColorsTab.qml b/quickshell/Modules/Settings/WallpaperColorsTab.qml index d477a86b7..c4c8166cf 100644 --- a/quickshell/Modules/Settings/WallpaperColorsTab.qml +++ b/quickshell/Modules/Settings/WallpaperColorsTab.qml @@ -846,6 +846,13 @@ Column { "fallback": "schh", "text": I18n.tr("Nested chip", "surface role"), "tags": ["nested", "chip", "control"] + }, + { + "key": "tooltipSurfaceColor", + "customKey": "tooltipSurfaceCustomColor", + "fallback": "schh", + "text": I18n.tr("Tooltip", "surface role"), + "tags": ["tooltip", "hint", "hover", "toast"] } ] diff --git a/quickshell/Modules/Settings/Widgets/SettingsSurfacePreview.qml b/quickshell/Modules/Settings/Widgets/SettingsSurfacePreview.qml index 33e0b6539..42ab0ee75 100644 --- a/quickshell/Modules/Settings/Widgets/SettingsSurfacePreview.qml +++ b/quickshell/Modules/Settings/Widgets/SettingsSurfacePreview.qml @@ -55,19 +55,40 @@ Item { color: Theme.chipSurface radius: Theme.cornerRadiusS - Rectangle { + Column { width: parent.width - height: nestedLabel.height + Theme.spacingM * 2 - color: Theme.chipSurfaceNested - radius: Theme.cornerRadiusXS + spacing: Theme.spacingS - StyledText { - id: nestedLabel - anchors.centerIn: parent - text: I18n.tr("Nested chip", "surface role") - font.pixelSize: Theme.fontSizeSmall - font.weight: Theme.fontWeightMedium - color: Theme.surfaceText + Rectangle { + width: parent.width + height: nestedLabel.height + Theme.spacingM * 2 + color: Theme.chipSurfaceNested + radius: Theme.cornerRadiusXS + + StyledText { + id: nestedLabel + anchors.centerIn: parent + text: I18n.tr("Nested chip", "surface role") + font.pixelSize: Theme.fontSizeSmall + font.weight: Theme.fontWeightMedium + color: Theme.surfaceText + } + } + + Rectangle { + anchors.horizontalCenter: parent.horizontalCenter + width: tooltipLabel.implicitWidth + Theme.spacingM * 2 + height: tooltipLabel.implicitHeight + Theme.spacingS * 2 + color: Theme.tooltipSurface + radius: Theme.cornerRadiusXS + + StyledText { + id: tooltipLabel + anchors.centerIn: parent + text: I18n.tr("Tooltip", "surface role") + font.pixelSize: Theme.fontSizeSmall + color: Theme.tooltipText + } } } } diff --git a/quickshell/Modules/Settings/Widgets/SurfaceColorRow.qml b/quickshell/Modules/Settings/Widgets/SurfaceColorRow.qml index 00206211e..77ad5936d 100644 --- a/quickshell/Modules/Settings/Widgets/SurfaceColorRow.qml +++ b/quickshell/Modules/Settings/Widgets/SurfaceColorRow.qml @@ -20,6 +20,9 @@ ColorDropdownRow { }), ({ "value": "schh", "label": I18n.tr("Surface Highest", "surface color option") + }), ({ + "value": "inverseSurface", + "label": I18n.tr("Inverse Surface", "surface color option") }), ({ "value": "primaryContainer", "label": I18n.tr("Primary Container", "surface color option") diff --git a/quickshell/Modules/Toast.qml b/quickshell/Modules/Toast.qml index c3d45ee1d..286da4092 100644 --- a/quickshell/Modules/Toast.qml +++ b/quickshell/Modules/Toast.qml @@ -339,7 +339,7 @@ PanelWindow { visible: copyDetailsButton.showTooltip width: detailsTooltipLabel.implicitWidth + Theme.spacingM * 2 height: detailsTooltipLabel.implicitHeight + Theme.spacingS * 2 - color: Theme.inverseSurface + color: Theme.tooltipSurface radius: Theme.cornerRadiusXS y: -height - Theme.spacingS x: -width / 2 + copyDetailsButton.width / 2 @@ -349,7 +349,7 @@ PanelWindow { anchors.centerIn: parent text: root.copiedText font.pixelSize: Theme.fontSizeSmall - color: Theme.inverseOnSurface + color: Theme.tooltipText } } } @@ -423,7 +423,7 @@ PanelWindow { visible: copyButton.showTooltip width: tooltipLabel.implicitWidth + Theme.spacingM * 2 height: tooltipLabel.implicitHeight + Theme.spacingS * 2 - color: Theme.inverseSurface + color: Theme.tooltipSurface radius: Theme.cornerRadiusXS y: -height - Theme.spacingS x: -width / 2 + copyButton.width / 2 @@ -433,7 +433,7 @@ PanelWindow { anchors.centerIn: parent text: root.copiedText font.pixelSize: Theme.fontSizeSmall - color: Theme.inverseOnSurface + color: Theme.tooltipText } } } diff --git a/quickshell/Widgets/DTooltip.qml b/quickshell/Widgets/DTooltip.qml index 2ad753983..06aca33e1 100644 --- a/quickshell/Widgets/DTooltip.qml +++ b/quickshell/Widgets/DTooltip.qml @@ -71,7 +71,7 @@ PanelWindow { Rectangle { anchors.fill: parent visible: root.shown - color: Theme.inverseSurface + color: Theme.tooltipSurface radius: Theme.cornerRadiusXS StyledText { @@ -80,7 +80,7 @@ PanelWindow { anchors.centerIn: parent text: root.text font.pixelSize: Theme.fontSizeSmall - color: Theme.inverseOnSurface + color: Theme.tooltipText wrapMode: Text.NoWrap maximumLineCount: 1 elide: Text.ElideRight