Scarriffle/onyx
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Farben einstellbar — und erst mal überhaupt eine Farbe

Browse Source 
Das Grün, das überall auftauchte, war die System-Akzentfarbe: `.tint` und
`.accentColor` werden ohne eigene Angabe dorthin durchgereicht, und das
betraf alle Popovers und das ganze Einstellungsfenster. Die Notch-Widgets
dagegen benutzten Onyx' eigenes Blau. Zwei Farben, ungewollt.

Jetzt eine, und die ist einstellbar. Ein neuer Reiter „Farben": Akzentfarbe
mit sechs Vorschlägen und einem Knopf, der die Systemfarbe übernimmt, dazu
das Paar für Herunter- und Hochladen samt Tauschknopf.

Die Signalfarben bleiben fest und stehen nur zur Ansicht dort. Gelb heißt
Warnung, Rot heißt kritisch, Grün heißt in Ordnung — bei Temperatur, Akku,
Lüfter und Fehlern. Wer sie umstellen kann, kann ihre Bedeutung zerstören;
ein rotes „alles gut" liest niemand richtig. Sichtbar sind sie trotzdem,
sonst sucht man die Warnfarbe im Reiter und findet sie nirgends.

Umgesetzt über die Tokens statt über vierzig Fundstellen: `Onyx.Color.accent`
ist keine Konstante mehr, sondern liest bei jedem Zugriff aus `OnyxTheme`.
Damit merkt SwiftUI die Abhängigkeit und zeichnet neu, sobald die Farbe sich
ändert. Dazu ein `.tint` an den vier Wurzeln — Panel, Popovers, Einstellungen,
Einrichtung —, damit auch Haken, Regler und Auswahlfelder mitziehen.

Nebenbei die Beschriftung: „Je Programm" heißt jetzt „Programme". Großgesetzt
las sich das als englisches „J-E".

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Scarriffle
2026-08-13 23:24:40 +02:00
parent 7a3d2c1c39
commit 2aa60eedf9
20 changed files with 757 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

131
Onyx/ColorSettingsView.swift Normal file
View File

@@ -0,0 +1,131 @@
import SwiftUI
import OnyxDesign
/// Die Farbwahl.
///
/// Drei Farben, nicht zehn: die Akzentfarbe, mit der Onyx sich selbst zeichnet,
/// und das Paar für Herunter- und Hochladen. Die Signalfarben stehen bewusst
/// nicht hier — Gelb heißt Warnung, Rot heißt kritisch, und wer das umstellen
/// kann, kann die Bedeutung zerstören.
struct ColorSettingsView: View {
@Bindable var theme: OnyxTheme
/// Ein paar Vorschläge, damit man nicht im Farbwähler anfangen muss.
///
/// Alle gedämpft: Onyx ist eine dunkle Fläche, und eine volle Sättigung
/// darauf sticht, statt zu leiten.
private static let suggestions: [(name: LocalizedStringKey, hex: String)] = [
("color.suggestion.onyx", "#7FA8FF"),
("color.suggestion.mint", "#6FCF97"),
("color.suggestion.amber", "#E8B44A"),
("color.suggestion.coral", "#E5675C"),
("color.suggestion.lilac", "#B79CFF"),
("color.suggestion.slate", "#9AA6B2"),
]
var body: some View {
Form {
Section("color.section.accent") {
ColorPicker(selection: $theme.accent, supportsOpacity: false) {
Text("color.accent")
}
HStack(spacing: 8) {
ForEach(Self.suggestions, id: \.hex) { suggestion in
Swatch(hex: suggestion.hex,
name: suggestion.name,
isSelected: theme.accent.onyxHex == suggestion.hex) {
theme.accent = Color(onyxHex: suggestion.hex) ?? theme.accent
}
}
Spacer(minLength: 0)
}
Button { theme.adoptSystemAccent() } label: {
Text("color.adoptSystem")
}
Text("color.accent.hint")
.font(.caption).foregroundStyle(.secondary)
.fixedSize(horizontal: false, vertical: true)
}
Section("color.section.network") {
ColorPicker(selection: $theme.download, supportsOpacity: false) {
Text("color.download")
}
ColorPicker(selection: $theme.upload, supportsOpacity: false) {
Text("color.upload")
}
Button {
let previous = theme.download
theme.download = theme.upload
theme.upload = previous
} label: {
Text("color.swap")
}
Text("color.network.hint")
.font(.caption).foregroundStyle(.secondary)
.fixedSize(horizontal: false, vertical: true)
}
Section("color.section.fixed") {
// Sichtbar, aber nicht bedienbar: sonst sucht man die
// Warnfarbe hier und findet sie nirgends.
FixedRow(color: Onyx.Color.positive, label: "color.fixed.positive")
FixedRow(color: Onyx.Color.warning, label: "color.fixed.warning")
FixedRow(color: Onyx.Color.critical, label: "color.fixed.critical")
Text("color.fixed.hint")
.font(.caption).foregroundStyle(.secondary)
.fixedSize(horizontal: false, vertical: true)
}
Section {
Button { theme.reset() } label: {
Text("color.reset")
}
.disabled(theme.isDefault)
}
}
.formStyle(.grouped)
}
}
/// Ein Farbfeld zum Anklicken.
private struct Swatch: View {
let hex: String
let name: LocalizedStringKey
let isSelected: Bool
let action: () -> Void
var body: some View {
Button(action: action) {
Circle()
.fill(Color(onyxHex: hex) ?? .gray)
.frame(width: 20, height: 20)
.overlay {
// Der Ring statt eines Hakens: ein Haken auf einer dunklen
// Farbe ist nicht zu sehen, auf einer hellen nicht auf
// einer dunklen Fläche.
Circle()
.strokeBorder(.primary, lineWidth: isSelected ? 2 : 0)
.padding(-3)
}
}
.buttonStyle(.plain)
.help(Text(name))
}
}
private struct FixedRow: View {
let color: Color
let label: LocalizedStringKey
var body: some View {
HStack {
Text(label)
Spacer(minLength: 12)
Circle().fill(color).frame(width: 14, height: 14)
}
}
}

11
Onyx/FanSettingsView.swift
View File

@@ -1,4 +1,5 @@
import SwiftUI
import OnyxDesign
import MetricsProvider
import OnyxHelperProtocol
@@ -47,7 +48,7 @@ struct FanSettingsView: View {
// Das Risiko benennen, bevor jemand zustimmt — nicht danach.
Label("fans.warning", systemImage: "exclamationmark.triangle.fill")
.font(.callout)
.foregroundStyle(.orange)
.foregroundStyle(Onyx.Color.warning)
.fixedSize(horizontal: false, vertical: true)
Text("fans.safety")
@@ -56,7 +57,7 @@ struct FanSettingsView: View {
.fixedSize(horizontal: false, vertical: true)
if case .failed(let message) = control.installState {
Text(message).font(.callout).foregroundStyle(.red)
Text(message).font(.callout).foregroundStyle(Onyx.Color.critical)
}
Button("fans.install") { control.install() }
@@ -85,7 +86,7 @@ struct FanSettingsView: View {
Spacer()
Text("\(Int(hottest))°").monospacedDigit()
.foregroundStyle(hottest >= FanSafety.criticalCelsius
? .red : .secondary)
? Onyx.Color.critical : .secondary)
}
}
ForEach(report.fans, id: \.index) { fan in
@@ -108,7 +109,7 @@ struct FanSettingsView: View {
Text("fans.connecting").foregroundStyle(.secondary)
}
if let error = control.lastError {
Text(error).font(.callout).foregroundStyle(.red)
Text(error).font(.callout).foregroundStyle(Onyx.Color.critical)
}
}
}
@@ -165,7 +166,7 @@ private struct FanRow: View {
if let reason = fan.automaticReason, reason != "noRequest" {
Label(explanation(for: reason), systemImage: "shield.lefthalf.filled")
.font(.caption)
.foregroundStyle(.orange)
.foregroundStyle(Onyx.Color.warning)
.fixedSize(horizontal: false, vertical: true)
}
}

352
Onyx/Localizable.xcstrings
View File

@@ -141,6 +141,342 @@
}
}
},
"color.accent": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Farbe"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Colour"
}
}
}
},
"color.accent.hint": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Gilt überall, wo Onyx sich selbst zeichnet: Regler, Ringe, Abschnittstitel, Haken und Auswahl."
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Applies everywhere Onyx draws itself: sliders, dials, section headings, check marks and selection."
}
}
}
},
"color.adoptSystem": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Systemfarbe übernehmen"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Adopt system colour"
}
}
}
},
"color.download": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Herunterladen"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Download"
}
}
}
},
"color.fixed.critical": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Kritisch"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Critical"
}
}
}
},
"color.fixed.hint": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Diese drei bleiben, wie sie sind. Sie bedeuten etwas — bei Temperatur, Akku, Lüfter und Fehlern."
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "These three stay as they are. They carry meaning — for temperature, battery, fans and errors."
}
}
}
},
"color.fixed.positive": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "In Ordnung"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Normal"
}
}
}
},
"color.fixed.warning": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Warnung"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Warning"
}
}
}
},
"color.network.hint": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Welche Richtung grün ist und welche rosa, ist Gewohnheit — nicht Bedeutung."
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Which direction is green and which is pink is habit, not meaning."
}
}
}
},
"color.reset": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Auf Standard zurücksetzen"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Reset to defaults"
}
}
}
},
"color.section.accent": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Akzentfarbe"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Accent colour"
}
}
}
},
"color.section.fixed": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Feste Farben"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Fixed colours"
}
}
}
},
"color.section.network": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Netzwerk"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Network"
}
}
}
},
"color.suggestion.amber": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Bernstein"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Amber"
}
}
}
},
"color.suggestion.coral": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Koralle"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Coral"
}
}
}
},
"color.suggestion.lilac": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Flieder"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Lilac"
}
}
}
},
"color.suggestion.mint": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Minze"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Mint"
}
}
}
},
"color.suggestion.onyx": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Onyx-Blau"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Onyx blue"
}
}
}
},
"color.suggestion.slate": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Schiefer"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Slate"
}
}
}
},
"color.swap": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Richtungen tauschen"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Swap directions"
}
}
}
},
"color.upload": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Hochladen"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Upload"
}
}
}
},
"fans.approval.needed": {
"extractionState": "stale",
"localizations": {
@@ -2014,6 +2350,22 @@
}
}
},
"settings.tab.colors": {
"localizations": {
"de": {
"stringUnit": {
"state": "translated",
"value": "Farben"
}
},
"en": {
"stringUnit": {
"state": "translated",
"value": "Colours"
}
}
}
},
"settings.tab.display": {
"extractionState": "stale",
"localizations": {

5
Onyx/OnboardingView.swift
View File

@@ -1,4 +1,5 @@
import SwiftUI
import OnyxDesign
import AppKit
import CalendarProvider
import WeatherProvider
@@ -175,7 +176,7 @@ private struct OnboardingRow: View {
HStack(alignment: .top, spacing: 14) {
Image(systemName: symbol)
.font(.system(size: 15))
.foregroundStyle(state == .granted ? .green : .secondary)
.foregroundStyle(state == .granted ? Onyx.Color.positive : .secondary)
.frame(width: 22, height: 22)
VStack(alignment: .leading, spacing: 2) {
@@ -190,7 +191,7 @@ private struct OnboardingRow: View {
switch state {
case .granted:
Image(systemName: "checkmark.circle.fill")
.foregroundStyle(.green)
.foregroundStyle(Onyx.Color.positive)
.font(.system(size: 16))
case .undetermined:
Button("onboarding.allow") { Task { await request() } }

4
Onyx/OnboardingWindowController.swift
View File

@@ -1,5 +1,6 @@
import AppKit
import SwiftUI
import OnyxDesign
import CalendarProvider
import WeatherProvider
import AudioProvider
@@ -43,7 +44,8 @@ final class OnboardingWindowController: NSObject, NSWindowDelegate {
rootView: OnboardingView(
calendarModel: calendarModel, weatherModel: weatherModel,
mixer: mixer, fanControl: fanControl, launchAtLogin: launchAtLogin,
onFinish: { [weak self] in self?.finish() }))
onFinish: { [weak self] in self?.finish() })
.tint(Onyx.Color.accent))
let window = NSWindow(contentViewController: hosting)
window.title = "Onyx"

3
Onyx/OnyxApp.swift
View File

@@ -76,7 +76,8 @@ final class AppDelegate: NSObject, NSApplicationDelegate {
NotchHostingView(
rootView: NotchContainer(presentation: presentation) {
NotchPanelContent(model: model)
},
}
.tint(Onyx.Color.accent),
presentation: presentation)
}
coordinator.start()

7
Onyx/SettingsView.swift
View File

@@ -10,7 +10,7 @@ import OnyxHelperProtocol
import WeatherProvider
enum SettingsTab: Hashable {
case widgets, display, sources, menubar, fans, permissions
case widgets, display, colors, sources, menubar, fans, permissions
}
struct SettingsView: View {
@@ -32,6 +32,9 @@ struct SettingsView: View {
DisplaySettings(model: model)
.tabItem { Label("settings.tab.display", systemImage: "macbook") }
.tag(SettingsTab.display)
ColorSettingsView(theme: OnyxTheme.shared)
.tabItem { Label("settings.tab.colors", systemImage: "paintpalette") }
.tag(SettingsTab.colors)
WidgetOptionsView(calendarModel: calendarModel, weatherModel: weatherModel,
shelfStore: shelfStore)
.tabItem { Label("settings.tab.options", systemImage: "slider.horizontal.3") }
@@ -189,7 +192,7 @@ private struct PermissionRow: View {
switch state {
case .granted:
Label("settings.permissions.granted", systemImage: "checkmark.circle.fill")
.foregroundStyle(.green)
.foregroundStyle(Onyx.Color.positive)
.labelStyle(.titleAndIcon)
case .undetermined:
Button("settings.permissions.request") { Task { await request() } }

7
Onyx/SettingsWindowController.swift
View File

@@ -1,5 +1,6 @@
import AppKit
import SwiftUI
import OnyxDesign
import CalendarProvider
import WeatherProvider
import MetricsProvider
@@ -53,7 +54,11 @@ final class SettingsWindowController: NSObject, NSWindowDelegate {
showOnboarding: showOnboarding,
selectedTab: Binding(
get: { [weak self] in self?.selectedTab ?? .widgets },
set: { [weak self] in self?.selectedTab = $0 })))
set: { [weak self] in self?.selectedTab = $0 }))
// Ohne das folgen Haken, Regler und Auswahlfelder der
// Systemfarbe statt der eingestellten. Genau daher kam das
// Grün, das in Onyx sonst nirgends vorkommt.
.tint(Onyx.Color.accent))
let window = NSWindow(contentViewController: hosting)
window.title = "Onyx"

9
Onyx/WidgetOptionsView.swift
View File

@@ -1,4 +1,5 @@
import SwiftUI
import OnyxDesign
import CalendarProvider
import WeatherProvider
import ShelfProvider
@@ -116,9 +117,9 @@ private struct CalendarrStatus: View {
case .loggedOut:
Text("calendar.source.status.loggedOut").font(.callout).foregroundStyle(.secondary)
case .incompatible:
Text("calendar.source.status.incompatible").font(.callout).foregroundStyle(.orange)
Text("calendar.source.status.incompatible").font(.callout).foregroundStyle(Onyx.Color.warning)
case .unreadable(let reason):
Text(reason).font(.callout).foregroundStyle(.orange)
Text(reason).font(.callout).foregroundStyle(Onyx.Color.warning)
case .denied, .none:
ProgressView().controlSize(.small)
}
@@ -148,7 +149,7 @@ private struct WeatherOptions: View {
// steht hier, statt dass das Widget stumm leer bleibt.
if model.locationIsDenied {
Text("options.weather.needsLocation")
.font(.callout).foregroundStyle(.orange)
.font(.callout).foregroundStyle(Onyx.Color.warning)
.fixedSize(horizontal: false, vertical: true)
}
} else if case .fixed(let name, _, _) = model.place {
@@ -172,7 +173,7 @@ private struct WeatherOptions: View {
}
if notFound {
Text("options.weather.notFound").font(.callout).foregroundStyle(.orange)
Text("options.weather.notFound").font(.callout).foregroundStyle(Onyx.Color.warning)
}
}