kenji/illogical-impulse
1
0
Fork 0
forked from Shinonome/dots-hyprland
Code Pull Requests Activity

waffles: adjust colors

Browse Source
This commit is contained in:
end-4
2025-12-23 10:31:05 +01:00
parent ec7d6fd66b
commit 76ca889eec
3 changed files with 42 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dots/.config/quickshell/ii/modules/waffle/looks/Looks.qml
+40 -33
View File
@@ -17,8 +17,9 @@ Singleton {
property string iconsPath: `${Directories.assetsPath}/icons/fluent` property string iconsPath: `${Directories.assetsPath}/icons/fluent`
property bool dark: Appearance.m3colors.darkmode property bool dark: Appearance.m3colors.darkmode
property real backgroundTransparency: 0.16 readonly property bool transparencyEnabled: Config.options.appearance.transparency.enable
property real panelBackgroundTransparency: 0.14 property real backgroundTransparency: transparencyEnabled ? 0.16 : 0
property real panelBackgroundTransparency: transparencyEnabled ? 0.14 : 0
property real panelLayerTransparency: root.dark ? 0.9 : 0.7 property real panelLayerTransparency: root.dark ? 0.9 : 0.7
property real contentTransparency: root.dark ? 0.87 : 0.5 property real contentTransparency: root.dark ? 0.87 : 0.5
function applyBackgroundTransparency(col) { function applyBackgroundTransparency(col) {
@@ -27,23 +28,22 @@ Singleton {
function applyContentTransparency(col) { function applyContentTransparency(col) {
return ColorUtils.applyAlpha(col, 1 - root.contentTransparency) return ColorUtils.applyAlpha(col, 1 - root.contentTransparency)
} }
lightColors: QtObject { // TODO: figure out transparency lightColors: QtObject {
id: lightColors id: lightColors
property color bgPanelFooter: "#EEEEEE"
property color bgPanelBody: "#F2F2F2" property color bgPanelBody: "#F2F2F2"
property color bgPanelSeparator: "#E0E0E0" property color bgPanelSeparator: "#E0E0E0"
property color bg0: "#EEEEEE" property color bg0: "#EEEEEE"
property color bg0Border: '#adadad' property color bg0Border: '#BEBEBE'
property color bg1: "#F7F7F7"
property color bg1Base: "#F7F7F7" property color bg1Base: "#F7F7F7"
property color bg1: "#F7F7F7"
property color bg1Hover: "#F7F7F7" property color bg1Hover: "#F7F7F7"
property color bg1Active: '#EFEFEF' property color bg1Active: '#EFEFEF'
property color bg1Border: '#d7d7d7' property color bg1Border: '#E9E9E9'
property color bg2: "#FBFBFB" property color bg2: "#FBFBFB"
property color bg2Base: "#FBFBFB" property color bg2Base: "#FBFBFB"
property color bg2Hover: '#ffffff' property color bg2Hover: '#ffffff'
property color bg2Active: '#eeeeee' property color bg2Active: '#eeeeee'
property color bg2Border: '#cdcdcd' property color bg2Border: '#E0E0E0'
property color subfg: "#5C5C5C" property color subfg: "#5C5C5C"
property color fg: "#000000" property color fg: "#000000"
property color fg1: "#626262" property color fg1: "#626262"
@@ -58,21 +58,20 @@ Singleton {
} }
darkColors: QtObject { darkColors: QtObject {
id: darkColors id: darkColors
property color bgPanelFooter: "#1C1C1C" property color bgPanelBody: '#242424'
property color bgPanelBody: '#616161'
property color bgPanelSeparator: "#191919" property color bgPanelSeparator: "#191919"
property color bg0: "#1C1C1C" property color bg0: "#1C1C1C"
property color bg0Border: "#404040" property color bg0Border: "#404040"
property color bg1Base: "#2C2C2C" property color bg1Base: '#2C2C2C'
property color bg1: '#9f9f9f' property color bg1: '#2C2C2C'
property color bg1Hover: "#b3b3b3" property color bg1Hover: "#292929"
property color bg1Active: '#727272' property color bg1Active: '#252525'
property color bg1Border: '#bebebe' property color bg1Border: '#bebebe'
property color bg2Base: "#313131" property color bg2Base: "#313131"
property color bg2: '#8a8a8a' property color bg2: '#313131'
property color bg2Hover: '#b1b1b1' property color bg2Hover: '#363636'
property color bg2Active: '#919191' property color bg2Active: '#2B2B2B'
property color bg2Border: '#bdbdbd' property color bg2Border: '#404040'
property color subfg: "#CED1D7" property color subfg: "#CED1D7"
property color fg: "#FFFFFF" property color fg: "#FFFFFF"
property color fg1: "#D1D1D1" property color fg1: "#D1D1D1"
@@ -87,38 +86,46 @@ Singleton {
} }
colors: QtObject { colors: QtObject {
id: colors id: colors
// Special
property color shadow: ColorUtils.transparentize('#161616', 0.62) property color shadow: ColorUtils.transparentize('#161616', 0.62)
property color ambientShadow: ColorUtils.transparentize("#000000", 0.75) property color ambientShadow: ColorUtils.transparentize("#000000", 0.75)
property color bgPanelFooterBase: ColorUtils.transparentize(root.dark ? root.darkColors.bgPanelFooter : root.lightColors.bgPanelFooter, root.panelBackgroundTransparency) property color bgPanelFooterBase: ColorUtils.transparentize(root.dark ? root.darkColors.bg0 : root.lightColors.bg0, root.panelBackgroundTransparency)
property color bgPanelFooter: ColorUtils.transparentize(root.dark ? root.darkColors.bgPanelFooter : root.lightColors.bgPanelFooter, root.panelLayerTransparency) property color bgPanelFooter: ColorUtils.transparentize(bgPanelFooterBase, root.panelLayerTransparency)
property color bgPanelBody: ColorUtils.transparentize(root.dark ? root.darkColors.bgPanelBody : root.lightColors.bgPanelBody, root.panelLayerTransparency) property color bgPanelBodyBase: root.dark ? root.darkColors.bgPanelBody : root.lightColors.bgPanelBody
property color bgPanelSeparator: ColorUtils.transparentize(root.dark ? root.darkColors.bgPanelSeparator : root.lightColors.bgPanelSeparator, root.backgroundTransparency) property color bgPanelBody: ColorUtils.solveOverlayColor(bgPanelFooterBase,bgPanelBodyBase, 1 - root.panelLayerTransparency)
property color bgPanelSeparator: ColorUtils.solveOverlayColor(bgPanelBodyBase, root.dark ? root.darkColors.bgPanelSeparator : root.lightColors.bgPanelSeparator, 1 - root.panelBackgroundTransparency)
// Layer 0
property color bg0Base: root.dark ? root.darkColors.bg0 : root.lightColors.bg0 property color bg0Base: root.dark ? root.darkColors.bg0 : root.lightColors.bg0
property color bg0: ColorUtils.transparentize(bg0Base, root.backgroundTransparency) property color bg0: ColorUtils.transparentize(bg0Base, root.backgroundTransparency)
property color bg0Border: ColorUtils.transparentize(root.dark ? root.darkColors.bg0Border : root.lightColors.bg0Border, root.backgroundTransparency) property color bg0Border: ColorUtils.transparentize(root.dark ? root.darkColors.bg0Border : root.lightColors.bg0Border, root.backgroundTransparency)
property color bg1Base: root.dark ? root.darkColors.bg1Base : root.lightColors.bg1Base // Layer 1
property color bg1: ColorUtils.transparentize(root.dark ? root.darkColors.bg1 : root.lightColors.bg1, root.contentTransparency) property color bg1Base: root.dark ? root.darkColors.bg1 : root.lightColors.bg1
property color bg1Hover: ColorUtils.transparentize(root.dark ? root.darkColors.bg1Hover : root.lightColors.bg1Hover, root.contentTransparency) property color bg1: ColorUtils.solveOverlayColor(bg0Base, bg1Base, 1 - root.contentTransparency)
property color bg1Active: ColorUtils.transparentize(root.dark ? root.darkColors.bg1Active : root.lightColors.bg1Active, root.contentTransparency) property color bg1Hover: ColorUtils.solveOverlayColor(bg0Base, root.dark ? root.darkColors.bg1Hover : root.lightColors.bg1Hover, 1 - root.contentTransparency)
property color bg1Border: ColorUtils.transparentize(root.dark ? root.darkColors.bg1Border : root.lightColors.bg1Border, root.contentTransparency) property color bg1Active: ColorUtils.solveOverlayColor(bg0Base, root.dark ? root.darkColors.bg1Active : root.lightColors.bg1Active, 1 - root.contentTransparency)
property color bg2Base: root.dark ? root.darkColors.bg2Base : root.lightColors.bg2Base property color bg1Border: ColorUtils.solveOverlayColor(bg0Base, root.dark ? root.darkColors.bg1Border : root.lightColors.bg1Border, 1 - root.contentTransparency)
property color bg2: ColorUtils.transparentize(root.dark ? root.darkColors.bg2 : root.lightColors.bg2, root.contentTransparency) // Layer 2
property color bg2Hover: ColorUtils.transparentize(root.dark ? root.darkColors.bg2Hover : root.lightColors.bg2Hover, root.contentTransparency) property color bg2Base: root.dark ? root.darkColors.bg2 : root.lightColors.bg2
property color bg2Active: ColorUtils.transparentize(root.dark ? root.darkColors.bg2Active : root.lightColors.bg2Active, root.contentTransparency) property color bg2: ColorUtils.solveOverlayColor(bgPanelBodyBase, bg2Base, 1 - root.contentTransparency)
property color bg2Border: ColorUtils.transparentize(root.dark ? root.darkColors.bg2Border : root.lightColors.bg2Border, root.contentTransparency) property color bg2Hover: ColorUtils.solveOverlayColor(bgPanelBodyBase, root.dark ? root.darkColors.bg2Hover : root.lightColors.bg2Hover, 1 - root.contentTransparency)
property color bg2Active: ColorUtils.solveOverlayColor(bgPanelBodyBase, root.dark ? root.darkColors.bg2Active : root.lightColors.bg2Active, 1 - root.contentTransparency)
property color bg2Border: ColorUtils.solveOverlayColor(bgPanelBodyBase, root.dark ? root.darkColors.bg2Border : root.lightColors.bg2Border, 1 - root.contentTransparency)
// Foreground / Text
property color subfg: root.dark ? root.darkColors.subfg : root.lightColors.subfg property color subfg: root.dark ? root.darkColors.subfg : root.lightColors.subfg
property color fg: root.dark ? root.darkColors.fg : root.lightColors.fg property color fg: root.dark ? root.darkColors.fg : root.lightColors.fg
property color fg1: root.dark ? root.darkColors.fg1 : root.lightColors.fg1 property color fg1: root.dark ? root.darkColors.fg1 : root.lightColors.fg1
property color inactiveIcon: root.dark ? root.darkColors.inactiveIcon : root.lightColors.inactiveIcon property color inactiveIcon: root.dark ? root.darkColors.inactiveIcon : root.lightColors.inactiveIcon
property color link: root.dark ? root.darkColors.link : root.lightColors.link
// Controls
property color controlBgInactive: root.dark ? root.darkColors.controlBgInactive : root.lightColors.controlBgInactive property color controlBgInactive: root.dark ? root.darkColors.controlBgInactive : root.lightColors.controlBgInactive
property color controlBg: root.dark ? root.darkColors.controlBg : root.lightColors.controlBg property color controlBg: root.dark ? root.darkColors.controlBg : root.lightColors.controlBg
property color controlBgHover: root.dark ? root.darkColors.controlBgHover : root.lightColors.controlBgHover property color controlBgHover: root.dark ? root.darkColors.controlBgHover : root.lightColors.controlBgHover
property color controlFg: root.dark ? root.darkColors.controlFg : root.lightColors.controlFg property color controlFg: root.dark ? root.darkColors.controlFg : root.lightColors.controlFg
property color inputBg: root.dark ? root.darkColors.inputBg : root.lightColors.inputBg property color inputBg: root.dark ? root.darkColors.inputBg : root.lightColors.inputBg
property color link: root.dark ? root.darkColors.link : root.lightColors.link
property color danger: "#C42B1C" property color danger: "#C42B1C"
property color dangerActive: "#B62D1F" property color dangerActive: "#B62D1F"
property color warning: "#FF9900" property color warning: "#FF9900"
// Accent
property color accent: Appearance.colors.colPrimary property color accent: Appearance.colors.colPrimary
property color accentHover: Appearance.colors.colPrimaryHover property color accentHover: Appearance.colors.colPrimaryHover
property color accentActive: Appearance.colors.colPrimaryActive property color accentActive: Appearance.colors.colPrimaryActive
dots/.config/quickshell/ii/modules/waffle/notificationCenter/NotificationPaneContent.qml
+1 -1
View File
@@ -7,7 +7,7 @@ import qs.modules.common.widgets
import qs.modules.common.functions import qs.modules.common.functions
import qs.modules.waffle.looks import qs.modules.waffle.looks
BodyRectangle { FooterRectangle {
id: root id: root
anchors.fill: parent anchors.fill: parent
implicitHeight: 230 implicitHeight: 230
dots/.config/quickshell/ii/modules/waffle/notificationCenter/WSingleNotification.qml
+1 -1
View File
@@ -65,7 +65,7 @@ MouseArea {
implicitHeight: notificationContent.implicitHeight + padding * 2 implicitHeight: notificationContent.implicitHeight + padding * 2
implicitWidth: notificationContent.implicitWidth + padding * 2 implicitWidth: notificationContent.implicitWidth + padding * 2
border.width: 1 border.width: 1
border.color: ColorUtils.applyAlpha(Looks.colors.ambientShadow, 0.1) border.color: root.isPopup ? Looks.colors.bg2Border : Looks.colors.bgPanelSeparator
Behavior on x { Behavior on x {
animation: Looks.transition.enter.createObject(this) animation: Looks.transition.enter.createObject(this)