quickshell: apex-neon v2 colour discipline pass

Kill pure-black crust (->Void #070709) and add the figure/ground tokens
focusActive/focusField/emberField. Move active/selection states to violet
(calendar Today, keybinds active tab, battery + power profiles); stop spending
danger-red on non-danger states (mic + audio-default -> cyan); make the notif
bell state-driven (neutral/focus/danger); give critical notifications an ember
ground; bluetooth scanning -> cyan; k8s MEM -> blue (free the special violet).
This commit is contained in:
2026-06-04 04:31:03 +02:00
parent d0d130bcd4
commit 873801262e
10 changed files with 41 additions and 30 deletions
+2 -2
View File
@@ -110,7 +110,7 @@ Scope {
BarComponents.BarPill {
id: notifBtn
groupName: "notifications"
accentColor: Shared.Theme.mauve
accentColor: notifBtn.count > 0 ? Shared.Theme.focus : Shared.Theme.overlay0
property int count: notifModel ? notifModel.values.length : 0
@@ -118,7 +118,7 @@ Scope {
Text {
Layout.alignment: Qt.AlignHCenter
text: notifDaemon?.dnd ? "\u{f009b}" : "\u{f0f3}"
color: notifDaemon?.dnd ? Shared.Theme.danger : Shared.Theme.mauve
color: notifDaemon?.dnd ? Shared.Theme.danger : (notifBtn.count > 0 ? Shared.Theme.focus : Shared.Theme.text)
font.pixelSize: Shared.Theme.fontLarge
font.family: Shared.Theme.iconFont
},
@@ -145,16 +145,16 @@ Item {
Layout.fillWidth: true
implicitHeight: 28
radius: Shared.Theme.radiusSmall
color: active ? Qt.alpha(Shared.Theme.accent, Shared.Theme.opacityLight) : Shared.Theme.surface0
color: active ? Qt.alpha(Shared.Theme.focus, Shared.Theme.opacityLight) : Shared.Theme.surface0
border.width: active ? 1 : 0
border.color: Qt.alpha(Shared.Theme.accent, Shared.Theme.opacityMedium)
border.color: Qt.alpha(Shared.Theme.focus, Shared.Theme.opacityMedium)
Behavior on color { ColorAnimation { duration: Shared.Theme.animFast } }
Text {
anchors.centerIn: parent
text: parent.label
color: parent.active ? Shared.Theme.accent : Shared.Theme.subtext0
color: parent.active ? Shared.Theme.focusActive : Shared.Theme.subtext0
font.pixelSize: Shared.Theme.fontSmall
font.family: Shared.Theme.fontFamily
font.bold: parent.active
@@ -217,7 +217,7 @@ Item {
anchors.rightMargin: 10
Text {
text: root.scanning ? "Scanning…" : "Scan for devices"
color: root.scanning ? Shared.Theme.blue : Shared.Theme.text
color: root.scanning ? Shared.Theme.sky : Shared.Theme.text
font.pixelSize: 11
font.family: Shared.Theme.fontFamily
Layout.fillWidth: true
@@ -225,7 +225,7 @@ Item {
Rectangle {
visible: root.scanning
width: 8; height: 8; radius: 4
color: Shared.Theme.blue
color: Shared.Theme.sky
SequentialAnimation on opacity {
running: root.scanning; loops: Animation.Infinite
NumberAnimation { from: 1.0; to: 0.2; duration: 600 }
@@ -106,7 +106,7 @@ Item {
id: todayLabel
anchors.centerIn: parent
text: "Today"
color: Shared.Theme.blue
color: Shared.Theme.focus
font.pixelSize: Shared.Theme.fontSmall
font.family: Shared.Theme.fontFamily
}
@@ -168,7 +168,7 @@ Item {
Rectangle {
anchors.centerIn: parent
width: 24; height: 24; radius: 12
color: parent.isToday ? Shared.Theme.blue : "transparent"
color: parent.isToday ? Shared.Theme.focus : "transparent"
}
Text {
@@ -145,7 +145,7 @@ Item {
}
Text {
text: modelData.memMi === -1 ? "—" : modelData.memMi + "Mi"
color: Shared.Theme.mauve
color: Shared.Theme.blue
font.pixelSize: 11
font.family: Shared.Theme.fontFamily
Layout.preferredWidth: 52
@@ -238,7 +238,7 @@ Item {
RowLayout {
width: parent.width
Text { text: "MEM"; color: Shared.Theme.mauve; font.pixelSize: 10; font.family: Shared.Theme.fontFamily; font.bold: true }
Text { text: "MEM"; color: Shared.Theme.blue; font.pixelSize: 10; font.family: Shared.Theme.fontFamily; font.bold: true }
Item { Layout.fillWidth: true }
Text {
text: Shared.Kubernetes.quota ? Shared.Kubernetes.quota.memActualMi + "Mi actual" : "—"
@@ -251,13 +251,13 @@ Item {
rowLabel: "%REQ"
valueLabel: Shared.Kubernetes.quota?.memReqLabel ?? ""
fill: Shared.Kubernetes.quota?.memReqPct ?? 0
barColor: Shared.Theme.mauve
barColor: Shared.Theme.blue
}
QuotaBar {
rowLabel: "%LIM"
valueLabel: Shared.Kubernetes.quota?.memLimLabel ?? ""
fill: Shared.Kubernetes.quota?.memLimPct ?? 0
barColor: Shared.Theme.mauve
barColor: Shared.Theme.blue
barOpacity: 0.6
}
}
@@ -148,13 +148,13 @@ Item {
Layout.fillWidth: true
implicitHeight: 22
radius: 11
color: isActive ? Qt.alpha(Shared.Theme.danger, Shared.Theme.opacityLight) : (schedMouse.containsMouse ? Shared.Theme.surface1 : Shared.Theme.surface0)
color: isActive ? Shared.Theme.focusField : (schedMouse.containsMouse ? Shared.Theme.surface1 : Shared.Theme.surface0)
Behavior on color { ColorAnimation { duration: 100 } }
Text {
anchors.centerIn: parent
text: parent.modelData.label
color: parent.isActive ? Shared.Theme.danger : Shared.Theme.overlay0
color: parent.isActive ? Shared.Theme.focusActive : Shared.Theme.overlay0
font.pixelSize: Shared.Theme.fontSmall
font.family: Shared.Theme.fontFamily
}
@@ -214,7 +214,9 @@ Item {
Layout.fillWidth: true
implicitHeight: notifContent.implicitHeight + 16
radius: Shared.Theme.radiusSmall
color: notifMouse.containsMouse ? Shared.Theme.surface1 : Shared.Theme.surface0
color: modelData.urgency === NotificationUrgency.Critical
? Shared.Theme.emberField
: (notifMouse.containsMouse ? Shared.Theme.surface1 : Shared.Theme.surface0)
border.width: modelData.urgency === NotificationUrgency.Critical ? 1 : 0
border.color: Shared.Theme.danger
@@ -347,7 +347,7 @@ Item {
audio: Pipewire.defaultAudioSource?.audio ?? null
icon: (!audio || audio.muted) ? "\u{f036d}" : "\u{f036c}"
label: "Mic"
accentColor: Shared.Theme.pink
accentColor: Shared.Theme.sky
drawerActive: root.audioDrawer === "source"
onDrawerToggled: root.audioDrawer = root.audioDrawer === "source" ? "" : "source"
}
@@ -391,7 +391,7 @@ Item {
Text {
text: devItem.isDefault ? "\u{f012c}" : "\u{f0765}"
color: devItem.isDefault ? (devItem.isSinkDrawer ? Shared.Theme.sky : Shared.Theme.pink) : Shared.Theme.overlay0
color: devItem.isDefault ? Shared.Theme.sky : Shared.Theme.overlay0
font.pixelSize: 12
font.family: Shared.Theme.iconFont
}
@@ -540,9 +540,9 @@ Item {
Repeater {
model: [
{ name: "power-saver", icon: "\u{f19be}", color: Shared.Theme.green },
{ name: "balanced", icon: "\u{f0a01}", color: Shared.Theme.blue },
{ name: "performance", icon: "\u{f1b4b}", color: Shared.Theme.yellow }
{ name: "power-saver", icon: "\u{f19be}" },
{ name: "balanced", icon: "\u{f0a01}" },
{ name: "performance", icon: "\u{f1b4b}" }
]
Rectangle {
@@ -555,7 +555,7 @@ Item {
Text {
anchors.centerIn: parent
text: modelData.icon
color: root.powerProfile === modelData.name ? modelData.color : Shared.Theme.overlay0
color: root.powerProfile === modelData.name ? Shared.Theme.focus : Shared.Theme.overlay0
font.pixelSize: 14
font.family: Shared.Theme.iconFont
}
@@ -128,7 +128,7 @@ Scope {
// Dim backdrop
Rectangle {
anchors.fill: parent
color: Qt.rgba(0, 0, 0, 0.45)
color: Qt.alpha(Shared.Theme.base, 0.45)
opacity: root.keybindsVisible ? 1.0 : 0.0
Behavior on opacity { NumberAnimation { duration: 180; easing.type: Easing.OutCubic } }
}
@@ -233,11 +233,11 @@ Scope {
implicitWidth: tabText.implicitWidth + 20
radius: Shared.Theme.radiusSmall
color: current
? Qt.alpha(Shared.Theme.accent, Shared.Theme.opacityLight)
? Qt.alpha(Shared.Theme.focus, Shared.Theme.opacityLight)
: Qt.alpha(Shared.Theme.surface0, 0.5)
border.width: 1
border.color: current
? Qt.alpha(Shared.Theme.accent, Shared.Theme.opacityMedium)
? Qt.alpha(Shared.Theme.focus, Shared.Theme.opacityMedium)
: Shared.Theme.borderSubtle
Behavior on color { ColorAnimation { duration: 120 } }
@@ -247,7 +247,7 @@ Scope {
id: tabText
anchors.centerIn: parent
text: modelData
color: parent.current ? Shared.Theme.accent : Shared.Theme.subtext0
color: parent.current ? Shared.Theme.focusActive : Shared.Theme.subtext0
font.pixelSize: Shared.Theme.fontSmall
font.family: Shared.Theme.fontFamily
font.bold: parent.current
@@ -14,7 +14,7 @@ Rectangle {
implicitWidth: 360
implicitHeight: content.implicitHeight + 20
radius: Shared.Theme.radiusNormal
color: Shared.Theme.popoutBackground
color: notification.urgency === NotificationUrgency.Critical ? Shared.Theme.emberField : Shared.Theme.popoutBackground
border.width: 1
border.color: notification.urgency === NotificationUrgency.Critical ? Qt.alpha(Shared.Theme.danger, Shared.Theme.opacityMedium) : Shared.Theme.borderSubtle
+12 -3
View File
@@ -8,7 +8,7 @@ Singleton {
readonly property var palettes: ({
neon: {
// Backgrounds — v2 cool-tinted ground (Void→Stealth)
base: "#070709", mantle: "#101218", crust: "#000000",
base: "#070709", mantle: "#101218", crust: "#070709",
surface0: "#181b22", surface1: "#262a34", surface2: "#383d49",
overlay0: "#8b909c", overlay1: "#5a606c",
// Text — Stark, not pure white
@@ -16,7 +16,10 @@ Singleton {
// Accent colors — apex-neon v2 spine
lavender: "#9d00ff", // special / root violet
mauve: "#9d00ff", // special / root violet
focus: "#d68fff", // attention — selection / "you are here" crosshair
focus: "#d68fff", // attention — "you are here" crosshair (Focus Max)
focusActive: "#b14dff", // attention — current selection / matched pair
focusField: "#3a1a4d", // attention — selection / region background
emberField: "#1f0a12", // danger — critical-severity ground (red figure on this)
pink: "#ff0044", // danger red
red: "#ff0044", // danger red
yellow: "#ffb700", // warning amber
@@ -35,7 +38,10 @@ Singleton {
// Accent colors — apex-aeon v2 spine
lavender: "#6a1fb8", // special / root violet
mauve: "#6a1fb8", // special / root violet
focus: "#7c2fd6", // attention — selection / "you are here" crosshair
focus: "#7c2fd6", // attention — "you are here" crosshair (Focus Max)
focusActive: "#6a1fb8", // attention — current selection / matched pair
focusField: "#e3d6f5", // attention — selection / region background
emberField: "#f7dbe2", // danger — critical-severity ground
pink: "#c8003a", // danger red
red: "#c8003a", // danger red
yellow: "#a86b00", // warning amber
@@ -62,6 +68,9 @@ Singleton {
readonly property color lavender: p.lavender
readonly property color mauve: p.mauve
readonly property color focus: p.focus
readonly property color focusActive: p.focusActive
readonly property color focusField: p.focusField
readonly property color emberField: p.emberField
readonly property color pink: p.pink
readonly property color red: p.red
readonly property color yellow: p.yellow