diff --git a/Assets/Matugen/matugen.toml b/Assets/Matugen/matugen.toml index ad2bf57..bd165cd 100644 --- a/Assets/Matugen/matugen.toml +++ b/Assets/Matugen/matugen.toml @@ -1,28 +1,7 @@ -# matugen configuration for Noctalia -# This file configures how matugen generates colors from wallpapers - +# This file configures how matugen generates colors from wallpapers for Noctalia [config] -# Color scheme type for generation -scheme = "dark" -# Color space for color extraction -color_space = "oklch" - -# Algorithm for color extraction -algorithm = "kmeans" - -# Number of colors to extract -color_count = 16 - -# Use source image colors -use_source_colors = true - -# Generate dark theme variant -generate_dark = true - -# Generate light theme variant -generate_light = false [templates.noctalia] input_path = "templates/noctalia.json" -output_path = "~/.config/noctalia/theme.json" \ No newline at end of file +output_path = "~/.config/noctalia/colors.json" \ No newline at end of file diff --git a/Assets/Matugen/templates/noctalia.json b/Assets/Matugen/templates/noctalia.json index 35e857f..9044c0d 100644 --- a/Assets/Matugen/templates/noctalia.json +++ b/Assets/Matugen/templates/noctalia.json @@ -1,26 +1,31 @@ { - "backgroundPrimary": "{{colors.surface_dim.default.hex}}", - "backgroundSecondary": "{{colors.surface.default.hex}}", - "backgroundTertiary": "{{colors.surface_bright.default.hex}}", + "colorPrimary": "{{colors.primary.default.hex}}", + "colorOnPrimary": "{{colors.on_primary.default.hex}}", + "colorPrimaryContainer": "{{colors.primary_container.default.hex}}", + "colorOnPrimaryContainer": "{{colors.on_primary_container.default.hex}}", + + "colorSecondary": "{{colors.secondary.default.hex}}", + "colorOnSecondary": "{{colors.on_secondary.default.hex}}", + "colorSecondaryContainer": "{{colors.secondary_container.default.hex}}", + "colorOnSecondaryContainer": "{{colors.on_secondary_container.default.hex}}", + + "colorTertiary": "{{colors.tertiary.default.hex}}", + "colorOnTertiary": "{{colors.on_tertiary.default.hex}}", + "colorTertiaryContainer": "{{colors.tertiary_container.default.hex}}", + "colorOnTertiaryContainer": "{{colors.on_tertiary_container.default.hex}}", + + "colorError": "{{colors.error.default.hex}}", + "colorOnError": "{{colors.on_error.default.hex}}", + "colorErrorContainer": "{{colors.error_container.default.hex}}", + "colorOnErrorContainer": "{{colors.on_error_container.default.hex}}", + + "colorSurface": "{{colors.surface.default.hex}}", + "colorOnSurface": "{{colors.on_surface.default.hex}}", + "colorSurfaceVariant": "{{colors.surface_variant.default.hex}}", + "colorOnSurfaceVariant": "{{colors.on_surface_variant.default.hex}}", - "surface": "{{colors.surface.default.hex}}", - "surfaceVariant": "{{colors.surface_variant.default.hex}}", - - "textPrimary": "{{colors.on_surface.default.hex}}", - "textSecondary": "{{colors.on_surface_variant.default.hex}}", - "textDisabled": "{{colors.on_surface_variant.default.hex}}", - - "accentPrimary": "{{colors.primary.default.hex}}", - "accentSecondary": "{{colors.secondary.default.hex}}", - "accentTertiary": "{{colors.tertiary.default.hex}}", - - "error": "{{colors.error.default.hex}}", - "warning": "{{colors.error_container.default.hex}}", - - "hover": "{{colors.primary_container.default.hex}}", - "onAccent": "{{colors.on_primary.default.hex}}", - "outline": "{{colors.outline.default.hex}}", - - "shadow": "{{colors.shadow.default.hex}}", - "overlay": "{{colors.scrim.default.hex}}" + "colorInversePrimary": "{{colors.inverse_primary.default.hex}}", + "colorOutline": "{{colors.outline.default.hex}}", + "colorOutlineVariant": "{{colors.outline_variant.default.hex}}", + "colorShadow": "{{colors.shadow.default.hex}}" } \ No newline at end of file diff --git a/Bin/matugen-theme.sh b/Bin/matugen-theme.sh deleted file mode 100755 index 73c18ca..0000000 --- a/Bin/matugen-theme.sh +++ /dev/null @@ -1,62 +0,0 @@ -#!/bin/bash - -# matugen-theme.sh - Generate theme colors from wallpaper using matugen -# Usage: ./matugen-theme.sh - -set -e - -# Configuration -SCRIPT_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)" -PROJECT_DIR="$(dirname "$SCRIPT_DIR")" -CONFIG_FILE="$PROJECT_DIR/Assets/Matugen/matugen.toml" -TEMPLATE_FILE="$PROJECT_DIR/Assets/Matugen/templates/noctalia.json" -OUTPUT_DIR="$HOME/.config/noctalia" -OUTPUT_FILE="$OUTPUT_DIR/theme.json" - -# Check if wallpaper path is provided -if [ $# -eq 0 ]; then - echo "Error: No wallpaper path provided" - echo "Usage: $0 " - exit 1 -fi - -WALLPAPER_PATH="$1" - -# Check if wallpaper exists -if [ ! -f "$WALLPAPER_PATH" ]; then - echo "Error: Wallpaper file not found: $WALLPAPER_PATH" - exit 1 -fi - -# Create output directory if it doesn't exist -mkdir -p "$OUTPUT_DIR" - -# Generate theme using matugen -echo "Generating theme from wallpaper: $WALLPAPER_PATH" - -# Use matugen to generate colors and transform to our format -matugen image "$WALLPAPER_PATH" \ - --config "$CONFIG_FILE" \ - --json hex | jq -c ' -{ - "backgroundPrimary": .colors.dark.surface_dim, - "backgroundSecondary": .colors.dark.surface, - "backgroundTertiary": .colors.dark.surface_bright, - "surface": .colors.dark.surface, - "surfaceVariant": .colors.dark.surface_variant, - "textPrimary": .colors.dark.on_surface, - "textSecondary": .colors.dark.on_surface_variant, - "textDisabled": .colors.dark.on_surface_variant, - "accentPrimary": .colors.dark.primary, - "accentSecondary": .colors.dark.secondary, - "accentTertiary": .colors.dark.tertiary, - "error": .colors.dark.error, - "warning": .colors.dark.error_container, - "hover": .colors.dark.primary_container, - "onAccent": .colors.dark.on_primary, - "outline": .colors.dark.outline, - "shadow": .colors.dark.shadow, - "overlay": .colors.dark.scrim -}' > "$OUTPUT_FILE.tmp" && mv "$OUTPUT_FILE.tmp" "$OUTPUT_FILE" - -echo "Theme generated successfully: $OUTPUT_FILE" \ No newline at end of file diff --git a/Modules/AppLauncher/AppLauncher.qml b/Modules/AppLauncher/AppLauncher.qml index 3dc07d5..9120e4d 100644 --- a/Modules/AppLauncher/AppLauncher.qml +++ b/Modules/AppLauncher/AppLauncher.qml @@ -254,19 +254,19 @@ NLoader { width: Math.min(700 * scaling, parent.width * 0.75) height: Math.min(550 * scaling, parent.height * 0.8) radius: 32 * scaling - color: Colors.backgroundPrimary - border.color: Colors.outline + color: Colors.colorSurface + border.color: Colors.colorOutline border.width: Style.borderThin * scaling // Subtle gradient background gradient: Gradient { GradientStop { position: 0.0 - color: Qt.lighter(Colors.backgroundPrimary, 1.02) + color: Qt.lighter(Colors.colorSurface, 1.02) } GradientStop { position: 1.0 - color: Qt.darker(Colors.backgroundPrimary, 1.1) + color: Qt.darker(Colors.colorSurface, 1.1) } } @@ -281,8 +281,8 @@ NLoader { Layout.preferredHeight: 40 * scaling Layout.bottomMargin: Style.marginMedium * scaling radius: 20 * scaling - color: Colors.backgroundSecondary - border.color: searchInput.activeFocus ? Colors.accentPrimary : Colors.outline + color: Colors.colorSurface + border.color: searchInput.activeFocus ? Colors.colorPrimary : Colors.colorOutline border.width: searchInput.activeFocus ? 2 : 1 Row { @@ -294,14 +294,14 @@ NLoader { text: "search" font.family: "Material Symbols Outlined" font.pointSize: 16 * scaling - color: searchInput.activeFocus ? Colors.accentPrimary : Colors.textSecondary + color: searchInput.activeFocus ? Colors.colorPrimary : Colors.colorOnSurface } TextField { id: searchInput placeholderText: "Search applications..." - color: Colors.textPrimary - placeholderTextColor: Colors.textSecondary + color: Colors.colorOnSurface + placeholderTextColor: Colors.colorOnSurface background: null font.pointSize: 13 * scaling Layout.fillWidth: true @@ -309,8 +309,8 @@ NLoader { searchText = text selectedIndex = 0 // Reset selection when search changes } - selectedTextColor: Colors.textPrimary - selectionColor: Colors.accentPrimary + selectedTextColor: Colors.colorOnSurface + selectionColor: Colors.colorPrimary padding: 0 verticalAlignment: TextInput.AlignVCenter leftPadding: 0 @@ -319,14 +319,14 @@ NLoader { bottomPadding: 0 font.bold: true Component.onCompleted: { - contentItem.cursorColor = Colors.textPrimary + contentItem.cursorColor = Colors.colorOnSurface contentItem.verticalAlignment = TextInput.AlignVCenter // Focus the search bar by default Qt.callLater(() => { searchInput.forceActiveFocus() }) } - onActiveFocusChanged: contentItem.cursorColor = Colors.textPrimary + onActiveFocusChanged: contentItem.cursorColor = Colors.colorOnSurface Keys.onDownPressed: selectNext() Keys.onUpPressed: selectPrev() @@ -370,10 +370,10 @@ NLoader { radius: 16 * scaling property bool isSelected: index === selectedIndex color: (appCardArea.containsMouse || isSelected) ? Qt.darker( - Colors.accentPrimary, - 1.1) : Colors.backgroundSecondary + Colors.colorPrimary, + 1.1) : Colors.colorSurface border.color: (appCardArea.containsMouse - || isSelected) ? Colors.accentPrimary : "transparent" + || isSelected) ? Colors.colorPrimary : "transparent" border.width: (appCardArea.containsMouse || isSelected) ? 2 : 0 Behavior on color { @@ -404,8 +404,8 @@ NLoader { Layout.preferredWidth: 40 * scaling Layout.preferredHeight: 40 * scaling radius: 14 * scaling - color: appCardArea.containsMouse ? Qt.darker(Colors.accentPrimary, - 1.1) : Colors.backgroundTertiary + color: appCardArea.containsMouse ? Qt.darker(Colors.colorPrimary, + 1.1) : Colors.colorSurfaceVariant property bool iconLoaded: (modelData.isCalculator || modelData.isClipboard || modelData.isCommand) || (iconImg.status === Image.Ready && iconImg.source !== "" @@ -440,7 +440,7 @@ NLoader { anchors.fill: parent anchors.margins: 6 * scaling radius: 10 * scaling - color: Colors.accentPrimary + color: Colors.colorPrimary opacity: 0.3 visible: !parent.iconLoaded } @@ -452,7 +452,7 @@ NLoader { text: modelData.name ? modelData.name.charAt(0).toUpperCase() : "?" font.pointSize: 18 * scaling font.weight: Font.Bold - color: Colors.accentPrimary + color: Colors.colorPrimary } Behavior on color { @@ -471,7 +471,7 @@ NLoader { text: modelData.name || "Unknown" font.pointSize: 14 * scaling font.weight: Font.Bold - color: Colors.textPrimary + color: Colors.colorOnSurface elide: Text.ElideRight Layout.fillWidth: true } @@ -480,7 +480,7 @@ NLoader { text: modelData.isCalculator ? (modelData.expr + " = " + modelData.result) : modelData.isClipboard ? modelData.content : modelData.isCommand ? modelData.content : (modelData.genericName || modelData.comment || "") font.pointSize: 11 * scaling color: (appCardArea.containsMouse - || isSelected) ? Colors.textPrimary : Colors.textSecondary + || isSelected) ? Colors.colorOnSurface : Colors.colorOnSurface elide: Text.ElideRight Layout.fillWidth: true visible: text !== "" @@ -507,7 +507,7 @@ NLoader { NText { text: searchText.trim() !== "" ? "No applications found" : "No applications available" font.pointSize: Style.fontSizeLarge * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface horizontalAlignment: Text.AlignHCenter Layout.fillWidth: true visible: filteredEntries.length === 0 @@ -521,7 +521,7 @@ NLoader { ">calc") ? `${filteredEntries.length} result${filteredEntries.length !== 1 ? 's' : ''}` : `${filteredEntries.length} application${filteredEntries.length !== 1 ? 's' : ''}` font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface horizontalAlignment: Text.AlignHCenter Layout.fillWidth: true visible: searchText.trim() !== "" diff --git a/Modules/Audio/CircularSpectrum.qml b/Modules/Audio/CircularSpectrum.qml index e4e0850..7d0de41 100644 --- a/Modules/Audio/CircularSpectrum.qml +++ b/Modules/Audio/CircularSpectrum.qml @@ -5,8 +5,8 @@ Item { id: root property int innerRadius: 32 * scaling property int outerRadius: 64 * scaling - property color fillColor: Colors.accentPrimary - property color strokeColor: Colors.textPrimary + property color fillColor: Colors.colorPrimary + property color strokeColor: Colors.colorOnSurface property int strokeWidth: 0 * scaling property var values: [] property int usableOuter: 64 diff --git a/Modules/Audio/LinearSpectrum.qml b/Modules/Audio/LinearSpectrum.qml index bb1600d..b5e1b08 100644 --- a/Modules/Audio/LinearSpectrum.qml +++ b/Modules/Audio/LinearSpectrum.qml @@ -3,8 +3,8 @@ import qs.Services Item { id: root - property color fillColor: Colors.accentPrimary - property color strokeColor: Colors.textPrimary + property color fillColor: Colors.colorPrimary + property color strokeColor: Colors.colorOnSurface property int strokeWidth: 0 property var values: [] diff --git a/Modules/Background/Overview.qml b/Modules/Background/Overview.qml index b44f05e..399c25e 100644 --- a/Modules/Background/Overview.qml +++ b/Modules/Background/Overview.qml @@ -62,7 +62,7 @@ NLoader { Rectangle { anchors.fill: parent - color: Qt.rgba(Colors.backgroundPrimary.r, Colors.backgroundPrimary.g, Colors.backgroundPrimary.b, 0.5) + color: Qt.rgba(Colors.colorSurface.r, Colors.colorSurface.g, Colors.colorSurface.b, 0.5) } } } diff --git a/Modules/Background/ScreenCorners.qml b/Modules/Background/ScreenCorners.qml index 6bd65cd..12acee1 100644 --- a/Modules/Background/ScreenCorners.qml +++ b/Modules/Background/ScreenCorners.qml @@ -17,7 +17,7 @@ NLoader { required property ShellScreen modelData // Visible ring color - property color ringColor: Colors.backgroundPrimary + property color ringColor: Colors.colorSurface // The amount subtracted from full size for the inner cutout // Inner size = full size - borderWidth (per axis) property int borderWidth: Style.borderMedium diff --git a/Modules/Bar/Bar.qml b/Modules/Bar/Bar.qml index afba6fa..dadadb0 100644 --- a/Modules/Bar/Bar.qml +++ b/Modules/Bar/Bar.qml @@ -36,7 +36,7 @@ Variants { id: bar anchors.fill: parent - color: Colors.backgroundPrimary + color: Colors.colorSurface layer.enabled: true } diff --git a/Modules/Bar/Battery.qml b/Modules/Bar/Battery.qml index 97bc807..3c64c96 100644 --- a/Modules/Bar/Battery.qml +++ b/Modules/Bar/Battery.qml @@ -51,10 +51,10 @@ NPill { icon: root.batteryIcon() text: Math.round(root.percent) + "%" - pillColor: Colors.surfaceVariant - iconCircleColor: Colors.accentPrimary - iconTextColor: Colors.backgroundPrimary - textColor: charging ? Colors.accentPrimary : Colors.textPrimary + pillColor: Colors.colorSurfaceVariant + iconCircleColor: Colors.colorPrimary + iconTextColor: Colors.colorSurface + textColor: charging ? Colors.colorPrimary : Colors.colorOnSurface tooltipText: { let lines = [] diff --git a/Modules/Bar/SystemMonitor.qml b/Modules/Bar/SystemMonitor.qml index ccac84b..d8efec0 100644 --- a/Modules/Bar/SystemMonitor.qml +++ b/Modules/Bar/SystemMonitor.qml @@ -23,7 +23,7 @@ Row { font.pointSize: Style.fontSizeLarge * scaling verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter - color: Colors.accentPrimary + color: Colors.colorPrimary } NText { @@ -45,7 +45,7 @@ Row { text: "thermometer" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeLarge * scaling - color: Colors.accentPrimary + color: Colors.colorPrimary verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter } @@ -68,7 +68,7 @@ Row { text: "memory" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeLarge * scaling - color: Colors.accentPrimary + color: Colors.colorPrimary verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter } diff --git a/Modules/Bar/TrayMenu.qml b/Modules/Bar/TrayMenu.qml index 81a0778..153da44 100644 --- a/Modules/Bar/TrayMenu.qml +++ b/Modules/Bar/TrayMenu.qml @@ -73,8 +73,8 @@ PopupWindow { Rectangle { id: bg anchors.fill: parent - color: Colors.backgroundSecondary - border.color: Colors.outline + color: Colors.colorSurface + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) radius: Style.radiusMedium * scaling z: 0 @@ -112,7 +112,7 @@ PopupWindow { Rectangle { id: bg anchors.fill: parent - color: mouseArea.containsMouse ? Colors.hover : "transparent" + color: mouseArea.containsMouse ? Colors.colorTertiary : "transparent" radius: Style.radiusSmall * scaling visible: !(modelData?.isSeparator ?? false) @@ -126,7 +126,7 @@ PopupWindow { id: text Layout.fillWidth: true color: (modelData?.enabled - ?? true) ? (mouseArea.containsMouse ? Colors.textPrimary : Colors.textPrimary) : Colors.textDisabled + ?? true) ? (mouseArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface) : Colors.textDisabled text: modelData?.text ?? "" font.pointSize: Style.fontSizeSmall * scaling verticalAlignment: Text.AlignVCenter @@ -148,7 +148,7 @@ PopupWindow { font.pointSize: Style.fontSizeSmall * scaling verticalAlignment: Text.AlignVCenter visible: modelData?.hasChildren ?? false - color: Colors.textPrimary + color: Colors.colorOnSurface } } @@ -308,8 +308,8 @@ PopupWindow { Rectangle { id: bg anchors.fill: parent - color: Colors.backgroundSecondary - border.color: Colors.outline + color: Colors.colorSurface + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) radius: Style.radiusMedium * scaling z: 0 @@ -347,10 +347,10 @@ PopupWindow { Rectangle { id: bg anchors.fill: parent - color: mouseArea.containsMouse ? Colors.hover : "transparent" + color: mouseArea.containsMouse ? Colors.colorTertiary : "transparent" radius: Style.radiusSmall * scaling visible: !(modelData?.isSeparator ?? false) - property color hoverTextColor: mouseArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + property color hoverTextColor: mouseArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface RowLayout { anchors.fill: parent diff --git a/Modules/Bar/Volume.qml b/Modules/Bar/Volume.qml index ddceda1..ee75c32 100644 --- a/Modules/Bar/Volume.qml +++ b/Modules/Bar/Volume.qml @@ -38,8 +38,8 @@ Item { NPill { id: pill icon: getIcon() - iconCircleColor: Colors.accentPrimary - collapsedIconColor: Colors.textPrimary + iconCircleColor: Colors.colorPrimary + collapsedIconColor: Colors.colorOnSurface autoHide: true text: Math.floor(Audio.volume * 100) + "%" tooltipText: "Volume: " + Math.round( diff --git a/Modules/Bar/WiFiMenu.qml b/Modules/Bar/WiFiMenu.qml index 7d13663..ba320fc 100644 --- a/Modules/Bar/WiFiMenu.qml +++ b/Modules/Bar/WiFiMenu.qml @@ -67,9 +67,9 @@ NLoader { Rectangle { id: wifiMenuRect - color: Colors.backgroundSecondary + color: Colors.colorSurface radius: Style.radiusMedium * scaling - border.color: Colors.backgroundTertiary + border.color: Colors.colorSurfaceVariant border.width: Math.max(1, Style.borderMedium * scaling) width: 340 * scaling height: 320 * scaling @@ -119,14 +119,14 @@ NLoader { text: "wifi" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeXL * scaling - color: Colors.accentPrimary + color: Colors.colorPrimary } NText { text: "WiFi" font.pointSize: Style.fontSizeLarge * scaling font.bold: true - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.fillWidth: true } @@ -180,7 +180,7 @@ NLoader { Layout.fillWidth: true Layout.preferredHeight: Style.baseWidgetSize * 1.5 * scaling radius: Style.radiusMedium * scaling - color: modelData.connected ? Colors.accentPrimary : (networkMouseArea.containsMouse ? Colors.hover : "transparent") + color: modelData.connected ? Colors.colorPrimary : (networkMouseArea.containsMouse ? Colors.colorTertiary : "transparent") RowLayout { anchors.fill: parent @@ -191,7 +191,7 @@ NLoader { text: network.signalIcon(modelData.signal) font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeXL * scaling - color: modelData.connected ? Colors.backgroundPrimary : (networkMouseArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary) + color: modelData.connected ? Colors.colorSurface : (networkMouseArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface) } ColumnLayout { @@ -204,7 +204,7 @@ NLoader { font.pointSize: Style.fontSizeNormal * scaling elide: Text.ElideRight Layout.fillWidth: true - color: modelData.connected ? Colors.backgroundPrimary : (networkMouseArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary) + color: modelData.connected ? Colors.colorSurface : (networkMouseArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface) } // Security Protocol @@ -213,14 +213,14 @@ NLoader { font.pointSize: Style.fontSizeTiny * scaling elide: Text.ElideRight Layout.fillWidth: true - color: modelData.connected ? Colors.backgroundPrimary : (networkMouseArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary) + color: modelData.connected ? Colors.colorSurface : (networkMouseArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface) } NText { visible: network.connectStatusSsid === modelData.ssid && network.connectStatus === "error" && network.connectError.length > 0 text: network.connectError - color: Colors.error + color: Colors.colorError font.pointSize: Style.fontSizeSmall * scaling elide: Text.ElideRight Layout.fillWidth: true @@ -236,7 +236,7 @@ NLoader { NBusyIndicator { visible: network.connectingSsid === modelData.ssid running: network.connectingSsid === modelData.ssid - color: Colors.accentPrimary + color: Colors.colorPrimary anchors.centerIn: parent size: Style.baseWidgetSize * 0.7 * scaling } @@ -257,7 +257,7 @@ NLoader { text: "error" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.error + color: Colors.colorError anchors.centerIn: parent } } @@ -266,7 +266,7 @@ NLoader { visible: modelData.connected text: "connected" font.pointSize: Style.fontSizeSmall * scaling - color: modelData.connected ? Colors.backgroundPrimary : (networkMouseArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary) + color: modelData.connected ? Colors.colorSurface : (networkMouseArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface) } } @@ -298,7 +298,7 @@ NLoader { Layout.preferredHeight: modelData.ssid === passwordPromptSsid && showPasswordPrompt ? 60 : 0 Layout.margins: 8 visible: modelData.ssid === passwordPromptSsid && showPasswordPrompt - color: Colors.surfaceVariant + color: Colors.colorSurfaceVariant radius: Style.radiusSmall * scaling RowLayout { @@ -314,7 +314,7 @@ NLoader { anchors.fill: parent radius: 8 color: "transparent" - border.color: passwordInputField.activeFocus ? Colors.accentPrimary : Colors.outline + border.color: passwordInputField.activeFocus ? Colors.colorPrimary : Colors.colorOutline border.width: 1 TextInput { @@ -323,7 +323,7 @@ NLoader { anchors.margins: Style.marginMedium * scaling text: passwordInput font.pointSize: Style.fontSizeMedium * scaling - color: Colors.textPrimary + color: Colors.colorOnSurface verticalAlignment: TextInput.AlignVCenter clip: true focus: true @@ -350,8 +350,8 @@ NLoader { Layout.preferredWidth: 80 Layout.preferredHeight: 36 radius: Style.radiusMedium * scaling - color: Colors.accentPrimary - border.color: Colors.accentPrimary + color: Colors.colorPrimary + border.color: Colors.colorPrimary border.width: 0 Behavior on color { @@ -363,7 +363,7 @@ NLoader { NText { anchors.centerIn: parent text: "Connect" - color: Colors.backgroundPrimary + color: Colors.colorSurface font.pointSize: Style.fontSizeSmall * scaling } @@ -375,8 +375,8 @@ NLoader { } cursorShape: Qt.PointingHandCursor hoverEnabled: true - onEntered: parent.color = Qt.darker(Colors.accentPrimary, 1.1) - onExited: parent.color = Colors.accentPrimary + onEntered: parent.color = Qt.darker(Colors.colorPrimary, 1.1) + onExited: parent.color = Colors.colorPrimary } } } diff --git a/Modules/Bar/Workspace.qml b/Modules/Bar/Workspace.qml index 36797d1..ac6263e 100644 --- a/Modules/Bar/Workspace.qml +++ b/Modules/Bar/Workspace.qml @@ -18,7 +18,7 @@ Item { property ListModel localWorkspaces: ListModel {} property real masterProgress: 0.0 property bool effectsActive: false - property color effectColor: Colors.accentPrimary + property color effectColor: Colors.colorPrimary property int horizontalPadding: Math.round(16 * s) property int spacingBetweenPills: Math.round(8 * s) @@ -72,7 +72,7 @@ Item { } function triggerUnifiedWave() { - effectColor = Colors.accentPrimary + effectColor = Colors.colorPrimary masterAnimation.restart() } @@ -108,7 +108,7 @@ Item { const ws = localWorkspaces.get(i) if (ws.isFocused === true) { root.triggerUnifiedWave() - root.workspaceChanged(ws.id, Colors.accentPrimary) + root.workspaceChanged(ws.id, Colors.colorPrimary) break } } @@ -121,14 +121,12 @@ Item { anchors.horizontalCenter: parent.horizontalCenter anchors.verticalCenter: parent.verticalCenter radius: Math.round(12 * s) - color: Colors.surfaceVariant - border.color: Qt.rgba(Colors.textPrimary.r, Colors.textPrimary.g, Colors.textPrimary.b, 0.1) + color: Colors.colorSurfaceVariant + border.color: Colors.colorOutlineVariant border.width: Math.max(1, Math.round(1 * s)) layer.enabled: true layer.effect: MultiEffect { - shadowColor: "black" - - // radius: 12 + shadowColor: Colors.colorShadow shadowVerticalOffset: 0 shadowHorizontalOffset: 0 shadowOpacity: 0.10 @@ -168,15 +166,15 @@ Item { } color: { if (model.isFocused) - return Colors.accentPrimary + return Colors.colorPrimary if (model.isUrgent) - return Colors.error + return Colors.colorError if (model.isActive || model.isOccupied) - return Colors.accentTertiary + return Colors.colorSecondary if (model.isUrgent) - return Colors.error + return Colors.colorError - return Colors.outline + return Colors.colorOutline } scale: model.isFocused ? 1.0 : 0.9 z: 0 diff --git a/Modules/Calendar/Calendar.qml b/Modules/Calendar/Calendar.qml index 3feaee8..a2a67d0 100644 --- a/Modules/Calendar/Calendar.qml +++ b/Modules/Calendar/Calendar.qml @@ -63,9 +63,9 @@ NLoader { Rectangle { id: calendarRect - color: Colors.backgroundSecondary + color: Colors.colorSurface radius: Style.radiusMedium * scaling - border.color: Colors.backgroundTertiary + border.color: Colors.colorSurfaceVariant border.width: Math.max(1, Style.borderMedium * scaling) width: 340 * scaling height: 320 * scaling // Reduced height to eliminate bottom space @@ -135,7 +135,7 @@ NLoader { horizontalAlignment: Text.AlignHCenter font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold - color: Colors.accentPrimary + color: Colors.colorPrimary } NIconButton { @@ -172,7 +172,7 @@ NLoader { let dayIndex = (firstDay + index) % 7 return Qt.locale().dayName(dayIndex, Locale.ShortFormat) } - color: Colors.accentSecondary + color: Colors.colorSecondary font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold horizontalAlignment: Text.AlignHCenter @@ -210,12 +210,12 @@ NLoader { width: (Style.baseWidgetSize * scaling) height: (Style.baseWidgetSize * scaling) radius: Style.radiusSmall * scaling - color: model.today ? Colors.accentPrimary : "transparent" + color: model.today ? Colors.colorPrimary : "transparent" NText { anchors.centerIn: parent text: model.day - color: model.today ? Colors.onAccent : Colors.textPrimary + color: model.today ? Colors.onAccent : Colors.colorOnSurface opacity: model.month === grid.month ? Style.opacityHeavy : Style.opacityLight font.pointSize: (Style.fontSizeMedium * scaling) font.weight: model.today ? Style.fontWeightBold : Style.fontWeightRegular diff --git a/Modules/Demo/DemoPanel.qml b/Modules/Demo/DemoPanel.qml index 799fbc6..2025ace 100644 --- a/Modules/Demo/DemoPanel.qml +++ b/Modules/Demo/DemoPanel.qml @@ -68,10 +68,10 @@ NLoader { Rectangle { id: bgRect - color: Colors.backgroundPrimary + color: Colors.colorSurface radius: Style.radiusMedium * scaling - border.color: Colors.accentPrimary - border.width: 2 + border.color: Colors.colorOutlineVariant + border.width: Math.max(1, Style.borderThin * scaling) width: 500 * scaling height: 700 * scaling anchors.centerIn: parent @@ -115,7 +115,7 @@ NLoader { NText { text: "DemoPanel" - color: Colors.accentPrimary + color: Colors.colorPrimary font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold Layout.alignment: Qt.AlignHCenter @@ -130,7 +130,7 @@ NLoader { spacing: Style.marginLarge * scaling NText { text: "Scaling" - color: Colors.accentSecondary + color: Colors.colorSecondary font.weight: Style.fontWeightBold } NText { @@ -173,7 +173,7 @@ NLoader { spacing: Style.marginLarge * scaling NText { text: "NIconButton" - color: Colors.accentSecondary + color: Colors.colorSecondary font.weight: Style.fontWeightBold } @@ -193,7 +193,7 @@ NLoader { spacing: Style.marginMedium * scaling NText { text: "NToggle" - color: Colors.accentSecondary + color: Colors.colorSecondary font.weight: Style.fontWeightBold } @@ -215,7 +215,7 @@ NLoader { spacing: Style.marginMedium * scaling NText { text: "NComboBox" - color: Colors.accentSecondary + color: Colors.colorSecondary font.weight: Style.fontWeightBold } @@ -240,7 +240,7 @@ NLoader { spacing: Style.marginMedium * scaling NText { text: "NTextInput" - color: Colors.accentSecondary + color: Colors.colorSecondary font.weight: Style.fontWeightBold } @@ -263,7 +263,7 @@ NLoader { spacing: Style.marginMedium * scaling NText { text: "NBusyIndicator" - color: Colors.accentSecondary + color: Colors.colorSecondary font.weight: Style.fontWeightBold } diff --git a/Modules/Dock/Dock.qml b/Modules/Dock/Dock.qml index 2e0c2a6..6fc8e82 100644 --- a/Modules/Dock/Dock.qml +++ b/Modules/Dock/Dock.qml @@ -104,7 +104,7 @@ NLoader { id: dockContainer width: dock.width + 40 height: 50 - color: Colors.backgroundSecondary + color: Colors.colorSurface anchors.horizontalCenter: parent.horizontalCenter anchors.bottom: parent.bottom topLeftRadius: 20 @@ -203,7 +203,7 @@ NLoader { text: appButton.appId ? appButton.appId.charAt(0).toUpperCase() : "?" font.pixelSize: 14 font.bold: true - color: appButton.isActive ? Colors.accentPrimary : Colors.textPrimary + color: appButton.isActive ? Colors.colorPrimary : Colors.colorOnSurface } MouseArea { @@ -253,7 +253,7 @@ NLoader { visible: isActive width: 20 height: 3 - color: Colors.accentPrimary + color: Colors.colorPrimary radius: 1.5 anchors.bottom: parent.bottom anchors.horizontalCenter: parent.horizontalCenter @@ -292,8 +292,8 @@ NLoader { width: 80 height: 32 radius: 8 - color: closeMouseArea.containsMouse ? Colors.hover : Colors.backgroundPrimary - border.color: Colors.outline + color: closeMouseArea.containsMouse ? Colors.colorTertiary : Colors.colorSurface + border.color: Colors.colorOutline border.width: 1 x: { @@ -315,7 +315,7 @@ NLoader { anchors.centerIn: parent text: "Close" font.pixelSize: 14 - color: Colors.textPrimary + color: Colors.colorOnSurface } MouseArea { diff --git a/Modules/LockScreen/LockScreen.qml b/Modules/LockScreen/LockScreen.qml index 0adb9e0..07c7077 100644 --- a/Modules/LockScreen/LockScreen.qml +++ b/Modules/LockScreen/LockScreen.qml @@ -138,7 +138,7 @@ WlSessionLock { width: Math.random() * 4 + 2 height: width radius: width * 0.5 - color: Qt.rgba(Colors.accentPrimary.r, Colors.accentPrimary.g, Colors.accentPrimary.b, 0.3) + color: Qt.rgba(Colors.colorPrimary.r, Colors.colorPrimary.g, Colors.colorPrimary.b, 0.3) x: Math.random() * parent.width y: Math.random() * parent.height @@ -181,7 +181,7 @@ WlSessionLock { font.pointSize: Style.fontSizeXXL * 6 font.weight: Font.Bold font.letterSpacing: -2 - color: Colors.textPrimary + color: Colors.colorOnSurface horizontalAlignment: Text.AlignHCenter SequentialAnimation on scale { @@ -205,7 +205,7 @@ WlSessionLock { font.family: "Inter" font.pointSize: Style.fontSizeXL font.weight: Font.Light - color: Colors.textSecondary + color: Colors.colorOnSurface horizontalAlignment: Text.AlignHCenter width: timeText.width } @@ -222,7 +222,7 @@ WlSessionLock { height: 120 * Scaling.scale(screen) radius: width * 0.5 color: "transparent" - border.color: Colors.accentPrimary + border.color: Colors.colorPrimary border.width: 3 * Scaling.scale(screen) anchors.horizontalCenter: parent.horizontalCenter @@ -233,7 +233,7 @@ WlSessionLock { height: parent.height + 24 * Scaling.scale(screen) radius: width * 0.5 color: "transparent" - border.color: Qt.rgba(Colors.accentPrimary.r, Colors.accentPrimary.g, Colors.accentPrimary.b, 0.3) + border.color: Qt.rgba(Colors.colorPrimary.r, Colors.colorPrimary.g, Colors.colorPrimary.b, 0.3) border.width: 2 * Scaling.scale(screen) z: -1 @@ -301,8 +301,8 @@ WlSessionLock { id: terminalBackground anchors.fill: parent radius: 16 - color: Colors.applyOpacity(Colors.backgroundPrimary, "E6") - border.color: Colors.accentPrimary + color: Colors.applyOpacity(Colors.colorSurface, "E6") + border.color: Colors.colorPrimary border.width: 2 * Scaling.scale(screen) // Scanline effect @@ -311,7 +311,7 @@ WlSessionLock { Rectangle { width: parent.width height: 1 - color: Colors.applyOpacity(Colors.accentPrimary, "1A") + color: Colors.applyOpacity(Colors.colorPrimary, "1A") y: index * 10 opacity: 0.3 @@ -333,7 +333,7 @@ WlSessionLock { Rectangle { width: parent.width height: 40 * Scaling.scale(screen) - color: Colors.applyOpacity(Colors.accentPrimary, "33") + color: Colors.applyOpacity(Colors.colorPrimary, "33") topLeftRadius: 14 topRightRadius: 14 @@ -344,7 +344,7 @@ WlSessionLock { Text { text: "SECURE TERMINAL" - color: Colors.textPrimary + color: Colors.colorOnSurface font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge font.weight: Font.Bold @@ -370,7 +370,7 @@ WlSessionLock { Text { text: "root@noctalia:~$" - color: Colors.accentPrimary + color: Colors.colorPrimary font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge font.weight: Font.Bold @@ -379,7 +379,7 @@ WlSessionLock { Text { id: welcomeText text: "" - color: Colors.textPrimary + color: Colors.colorOnSurface font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge property int currentIndex: 0 @@ -408,7 +408,7 @@ WlSessionLock { Text { text: "root@noctalia:~$" - color: Colors.accentPrimary + color: Colors.colorPrimary font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge font.weight: Font.Bold @@ -416,7 +416,7 @@ WlSessionLock { Text { text: "sudo unlock_session" - color: Colors.textPrimary + color: Colors.colorOnSurface font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge } @@ -429,7 +429,7 @@ WlSessionLock { visible: false font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge - color: Colors.textPrimary + color: Colors.colorOnSurface echoMode: TextInput.Password passwordCharacter: "*" passwordMaskDelay: 0 @@ -456,7 +456,7 @@ WlSessionLock { Text { id: asterisksText text: "*".repeat(passwordInput.text.length) - color: Colors.textPrimary + color: Colors.colorOnSurface font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge visible: passwordInput.activeFocus @@ -483,7 +483,7 @@ WlSessionLock { Rectangle { width: 8 * Scaling.scale(screen) height: 20 * Scaling.scale(screen) - color: Colors.accentPrimary + color: Colors.colorPrimary visible: passwordInput.activeFocus anchors.left: asterisksText.right anchors.leftMargin: 2 * Scaling.scale(screen) @@ -506,7 +506,7 @@ WlSessionLock { // Status messages Text { text: lock.authenticating ? "Authenticating..." : (lock.errorMessage !== "" ? "Authentication failed." : "") - color: lock.authenticating ? Colors.accentPrimary : (lock.errorMessage !== "" ? Colors.error : "transparent") + color: lock.authenticating ? Colors.colorPrimary : (lock.errorMessage !== "" ? Colors.colorError : "transparent") font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeLarge Layout.fillWidth: true @@ -530,9 +530,9 @@ WlSessionLock { width: 120 * Scaling.scale(screen) height: 40 * Scaling.scale(screen) radius: 12 - color: executeButtonArea.containsMouse ? Colors.accentPrimary : Colors.applyOpacity( - Colors.accentPrimary, "33") - border.color: Colors.accentPrimary + color: executeButtonArea.containsMouse ? Colors.colorPrimary : Colors.applyOpacity( + Colors.colorPrimary, "33") + border.color: Colors.colorPrimary border.width: 1 enabled: !lock.authenticating Layout.alignment: Qt.AlignRight @@ -541,7 +541,7 @@ WlSessionLock { Text { anchors.centerIn: parent text: lock.authenticating ? "EXECUTING" : "EXECUTE" - color: executeButtonArea.containsMouse ? Colors.onAccent : Colors.accentPrimary + color: executeButtonArea.containsMouse ? Colors.onAccent : Colors.colorPrimary font.family: "DejaVu Sans Mono" font.pointSize: Style.fontSizeMedium font.weight: Font.Bold @@ -595,7 +595,7 @@ WlSessionLock { anchors.fill: parent radius: parent.radius color: "transparent" - border.color: Colors.applyOpacity(Colors.accentPrimary, "4D") + border.color: Colors.applyOpacity(Colors.colorPrimary, "4D") border.width: 1 z: -1 @@ -631,8 +631,8 @@ WlSessionLock { width: 64 * Scaling.scale(screen) height: 64 * Scaling.scale(screen) radius: 32 - color: Qt.rgba(Colors.error.r, Colors.error.g, Colors.error.b, shutdownArea.containsMouse ? 0.9 : 0.2) - border.color: Colors.error + color: Qt.rgba(Colors.colorError.r, Colors.colorError.g, Colors.colorError.b, shutdownArea.containsMouse ? 0.9 : 0.2) + border.color: Colors.colorError border.width: 2 * Scaling.scale(screen) // Glow effect @@ -642,7 +642,7 @@ WlSessionLock { height: parent.height + 10 * Scaling.scale(screen) radius: width * 0.5 color: "transparent" - border.color: Qt.rgba(Colors.error.r, Colors.error.g, Colors.error.b, 0.3) + border.color: Qt.rgba(Colors.colorError.r, Colors.colorError.g, Colors.colorError.b, 0.3) border.width: 2 * Scaling.scale(screen) opacity: shutdownArea.containsMouse ? 1 : 0 z: -1 @@ -671,7 +671,7 @@ WlSessionLock { text: "power_settings_new" font.family: "Material Symbols Outlined" font.pixelSize: 28 * Scaling.scale(screen) - color: shutdownArea.containsMouse ? Colors.onAccent : Colors.error + color: shutdownArea.containsMouse ? Colors.onAccent : Colors.colorError } Behavior on color { @@ -688,9 +688,9 @@ WlSessionLock { width: 64 * Scaling.scale(screen) height: 64 * Scaling.scale(screen) radius: 32 - color: Qt.rgba(Colors.accentPrimary.r, Colors.accentPrimary.g, Colors.accentPrimary.b, + color: Qt.rgba(Colors.colorPrimary.r, Colors.colorPrimary.g, Colors.colorPrimary.b, rebootArea.containsMouse ? 0.9 : 0.2) - border.color: Colors.accentPrimary + border.color: Colors.colorPrimary border.width: 2 * Scaling.scale(screen) // Glow effect @@ -700,7 +700,7 @@ WlSessionLock { height: parent.height + 10 * Scaling.scale(screen) radius: width * 0.5 color: "transparent" - border.color: Qt.rgba(Colors.accentPrimary.r, Colors.accentPrimary.g, Colors.accentPrimary.b, 0.3) + border.color: Qt.rgba(Colors.colorPrimary.r, Colors.colorPrimary.g, Colors.colorPrimary.b, 0.3) border.width: 2 * Scaling.scale(screen) opacity: rebootArea.containsMouse ? 1 : 0 z: -1 @@ -728,7 +728,7 @@ WlSessionLock { text: "refresh" font.family: "Material Symbols Outlined" font.pixelSize: 28 * Scaling.scale(screen) - color: rebootArea.containsMouse ? Colors.onAccent : Colors.accentPrimary + color: rebootArea.containsMouse ? Colors.onAccent : Colors.colorPrimary } Behavior on color { @@ -745,9 +745,9 @@ WlSessionLock { width: 64 * Scaling.scale(screen) height: 64 * Scaling.scale(screen) radius: 32 - color: Qt.rgba(Colors.accentSecondary.r, Colors.accentSecondary.g, Colors.accentSecondary.b, + color: Qt.rgba(Colors.colorSecondary.r, Colors.colorSecondary.g, Colors.colorSecondary.b, logoutArea.containsMouse ? 0.9 : 0.2) - border.color: Colors.accentSecondary + border.color: Colors.colorSecondary border.width: 2 * Scaling.scale(screen) // Glow effect @@ -757,7 +757,7 @@ WlSessionLock { height: parent.height + 10 * Scaling.scale(screen) radius: width * 0.5 color: "transparent" - border.color: Qt.rgba(Colors.accentSecondary.r, Colors.accentSecondary.g, Colors.accentSecondary.b, 0.3) + border.color: Qt.rgba(Colors.colorSecondary.r, Colors.colorSecondary.g, Colors.colorSecondary.b, 0.3) border.width: 2 * Scaling.scale(screen) opacity: logoutArea.containsMouse ? 1 : 0 z: -1 @@ -787,7 +787,7 @@ WlSessionLock { text: "exit_to_app" font.family: "Material Symbols Outlined" font.pixelSize: 28 * Scaling.scale(screen) - color: logoutArea.containsMouse ? Colors.onAccent : Colors.accentSecondary + color: logoutArea.containsMouse ? Colors.onAccent : Colors.colorSecondary } Behavior on color { diff --git a/Modules/Notification/Notification.qml b/Modules/Notification/Notification.qml index d7c3e94..7f71ecb 100644 --- a/Modules/Notification/Notification.qml +++ b/Modules/Notification/Notification.qml @@ -63,18 +63,9 @@ PanelWindow { height: Math.max(80 * scaling, contentColumn.implicitHeight + (Style.marginMedium * 2 * scaling)) clip: true radius: Style.radiusMedium * scaling - border.color: Colors.accentPrimary + border.color: Colors.colorPrimary border.width: Math.max(1, Style.borderThin * scaling) - gradient: Gradient { - GradientStop { - position: 0.0 - color: Colors.backgroundSecondary - } - GradientStop { - position: 1.0 - color: Colors.backgroundTertiary - } - } + color: Colors.colorSurface // Animation properties property real scaleValue: 0.8 @@ -142,14 +133,14 @@ PanelWindow { spacing: Style.marginSmall * scaling NText { text: (model.appName || model.desktopEntry) || "Unknown App" - color: Colors.accentSecondary + color: Colors.colorSecondary font.pointSize: Style.fontSizeSmall * scaling } Rectangle { width: 6 * scaling height: 6 * scaling radius: 3 * scaling - color: (model.urgency === NotificationUrgency.Critical) ? Colors.error : (model.urgency === NotificationUrgency.Low) ? Colors.textSecondary : Colors.accentPrimary + color: (model.urgency === NotificationUrgency.Critical) ? Colors.colorError : (model.urgency === NotificationUrgency.Low) ? Colors.colorOnSurface : Colors.colorPrimary Layout.alignment: Qt.AlignVCenter } Item { @@ -157,7 +148,7 @@ PanelWindow { } NText { text: notificationService.formatTimestamp(model.timestamp) - color: Colors.textSecondary + color: Colors.colorOnSurface font.pointSize: Style.fontSizeSmall * scaling } } @@ -166,7 +157,7 @@ PanelWindow { text: model.summary || "No summary" font.pointSize: Style.fontSizeLarge * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface wrapMode: Text.Wrap width: 300 * scaling maximumLineCount: 3 @@ -176,7 +167,7 @@ PanelWindow { NText { text: model.body || "" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.Wrap width: 300 * scaling maximumLineCount: 5 diff --git a/Modules/Notification/NotificationHistoryPanel.qml b/Modules/Notification/NotificationHistoryPanel.qml index 0fc0aac..3dce3b3 100644 --- a/Modules/Notification/NotificationHistoryPanel.qml +++ b/Modules/Notification/NotificationHistoryPanel.qml @@ -65,9 +65,9 @@ NLoader { Rectangle { id: notificationRect - color: Colors.backgroundSecondary + color: Colors.colorSurface radius: Style.radiusMedium * scaling - border.color: Colors.backgroundTertiary + border.color: Colors.colorSurfaceVariant border.width: Math.max(1, Style.borderMedium * scaling) width: 400 * scaling height: 500 * scaling @@ -117,14 +117,14 @@ NLoader { text: "notifications" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeXL * scaling - color: Colors.accentPrimary + color: Colors.colorPrimary } NText { text: "Notification History" font.pointSize: Style.fontSizeLarge * scaling font.bold: true - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.fillWidth: true } @@ -159,7 +159,7 @@ NLoader { width: notificationList ? (notificationList.width - 20) : 380 * scaling height: Math.max(80, notificationContent.height + 30) radius: Style.radiusMedium * scaling - color: notificationMouseArea.containsMouse ? Colors.accentPrimary : "transparent" + color: notificationMouseArea.containsMouse ? Colors.colorPrimary : "transparent" RowLayout { anchors { @@ -179,7 +179,7 @@ NLoader { text: (summary || "No summary").substring(0, 100) font.pointSize: Style.fontSizeMedium * scaling font.weight: Font.Medium - color: notificationMouseArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary + color: notificationMouseArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface wrapMode: Text.Wrap width: parent.width - 30 maximumLineCount: 2 @@ -189,7 +189,7 @@ NLoader { NText { text: (body || "").substring(0, 150) font.pointSize: Style.fontSizeSmall * scaling - color: notificationMouseArea.containsMouse ? Colors.backgroundPrimary : Colors.textSecondary + color: notificationMouseArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface wrapMode: Text.Wrap width: parent.width - 30 maximumLineCount: 3 @@ -199,7 +199,7 @@ NLoader { NText { text: NotificationService.formatTimestamp(timestamp) font.pointSize: Style.fontSizeSmall * scaling - color: notificationMouseArea.containsMouse ? Colors.backgroundPrimary : Colors.textSecondary + color: notificationMouseArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface } } } diff --git a/Modules/Settings/SettingsPanel.qml b/Modules/Settings/SettingsPanel.qml index 51948ab..e2ae004 100644 --- a/Modules/Settings/SettingsPanel.qml +++ b/Modules/Settings/SettingsPanel.qml @@ -158,9 +158,9 @@ NLoader { Rectangle { id: bgRect - color: Colors.backgroundPrimary + color: Colors.colorSurface radius: Style.radiusLarge * scaling - border.color: Colors.backgroundTertiary + border.color: Colors.colorOutlineVariant border.width: Math.max(1, Style.borderMedium * scaling) layer.enabled: true width: (screen.width * 0.5) * scaling @@ -209,10 +209,10 @@ NLoader { id: sidebar Layout.preferredWidth: 260 * scaling Layout.fillHeight: true - radius: Style.radiusMedium * scaling - color: Colors.backgroundSecondary - border.color: Colors.outline + color: Colors.colorSurfaceVariant + border.color: Colors.colorOutlineVariant border.width: Math.max(1, Style.borderThin * scaling) + radius: Style.radiusMedium * scaling Column { anchors.fill: parent @@ -229,7 +229,7 @@ NLoader { width: parent.width height: 32 * scaling // Back to original height radius: Style.radiusSmall * scaling - color: selected ? Colors.accentPrimary : (tabItem.hovering ? Colors.hover : "transparent") + color: selected ? Colors.colorPrimary : (tabItem.hovering ? Colors.colorTertiary : "transparent") border.color: "transparent" border.width: 0 @@ -238,24 +238,28 @@ NLoader { // Subtle hover effect: only icon/text color tint on hover property bool hovering: false + property color tabTextColor: selected ? Colors.colorOnPrimary : (tabItem.hovering ? Colors.colorOnTertiary : Colors.colorOnSurface) + RowLayout { anchors.fill: parent anchors.leftMargin: Style.marginSmall * scaling anchors.rightMargin: Style.marginSmall * scaling spacing: Style.marginSmall * scaling + // Tab icon on the left side NText { text: modelData.icon + color: tabTextColor font.family: "Material Symbols Outlined" font.variableAxes: { "wght": (Font.Normal + Font.Bold) / 2.0 } font.pointSize: Style.fontSizeLarge * scaling - color: selected ? Colors.onAccent : (tabItem.hovering ? Colors.onAccent : Colors.textSecondary) + } // Tab label on the left side NText { text: modelData.label - color: selected ? Colors.onAccent : (tabItem.hovering ? Colors.onAccent : Colors.textPrimary) + color: tabTextColor font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold Layout.fillWidth: true @@ -281,8 +285,8 @@ NLoader { Layout.fillWidth: true Layout.fillHeight: true radius: Style.radiusMedium * scaling - color: Colors.surfaceVariant - border.color: Colors.outline + color: Colors.colorSurfaceVariant + border.color: Colors.colorOutlineVariant border.width: Math.max(1, Style.borderThin * scaling) clip: true @@ -302,7 +306,7 @@ NLoader { text: panel.tabsModel[currentTabIndex].label font.pointSize: Style.fontSizeLarge * scaling font.weight: Style.fontWeightBold - color: Colors.accentPrimary + color: Colors.colorPrimary Layout.fillWidth: true } NIconButton { diff --git a/Modules/Settings/Tabs/About.qml b/Modules/Settings/Tabs/About.qml index bafd0d0..82b259f 100644 --- a/Modules/Settings/Tabs/About.qml +++ b/Modules/Settings/Tabs/About.qml @@ -59,7 +59,7 @@ ColumnLayout { text: "Noctalia: quiet by design" font.pointSize: Style.fontSizeXXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.alignment: Qt.AlignCenter Layout.bottomMargin: Style.marginSmall * scaling } @@ -67,7 +67,7 @@ ColumnLayout { NText { text: "It may just be another quickshell setup but it won't get in your way." font.pointSize: Style.fontSizeMedium * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface Layout.alignment: Qt.AlignCenter Layout.bottomMargin: Style.marginLarge * scaling } @@ -80,25 +80,25 @@ ColumnLayout { NText { text: "Latest Version:" - color: Colors.textSecondary + color: Colors.colorOnSurface Layout.alignment: Qt.AlignRight } NText { text: root.latestVersion - color: Colors.textPrimary + color: Colors.colorOnSurface font.weight: Style.fontWeightBold } NText { text: "Installed Version:" - color: Colors.textSecondary + color: Colors.colorOnSurface Layout.alignment: Qt.AlignRight } NText { text: root.currentVersion - color: Colors.textPrimary + color: Colors.colorOnSurface font.weight: Style.fontWeightBold } } @@ -109,8 +109,8 @@ ColumnLayout { Layout.preferredWidth: updateText.implicitWidth + 46 * scaling Layout.preferredHeight: 32 * scaling radius: Style.radiusLarge * scaling - color: updateArea.containsMouse ? Colors.accentPrimary : "transparent" - border.color: Colors.accentPrimary + color: updateArea.containsMouse ? Colors.colorPrimary : "transparent" + border.color: Colors.colorPrimary border.width: 1 visible: { if (root.currentVersion === "Unknown" || root.latestVersion === "Unknown") @@ -138,14 +138,14 @@ ColumnLayout { text: "system_update" font.family: "Material Symbols Outlined" font.pointSize: 18 * scaling - color: updateArea.containsMouse ? Colors.backgroundPrimary : Colors.accentPrimary + color: updateArea.containsMouse ? Colors.colorSurface : Colors.colorPrimary } NText { id: updateText text: "Download latest release" font.pointSize: 14 * scaling - color: updateArea.containsMouse ? Colors.backgroundPrimary : Colors.accentPrimary + color: updateArea.containsMouse ? Colors.colorSurface : Colors.colorPrimary } } @@ -171,7 +171,7 @@ ColumnLayout { text: `Shout-out to our ${root.contributors.length} awesome contributors!` font.pointSize: Style.fontSizeLarge * scaling font.weight: Style.fontWeightBold - color: Colors.textSecondary + color: Colors.colorOnSurface Layout.alignment: Qt.AlignCenter Layout.topMargin: Style.marginLarge * 2 } @@ -199,7 +199,7 @@ ColumnLayout { width: contributorsGrid.cellWidth - Style.marginLarge * scaling height: contributorsGrid.cellHeight - Style.marginTiny * scaling radius: Style.radiusLarge * scaling - color: contributorArea.containsMouse ? Colors.hover : "transparent" + color: contributorArea.containsMouse ? Colors.colorTertiary : "transparent" RowLayout { anchors.fill: parent @@ -216,7 +216,7 @@ ColumnLayout { anchors.fill: parent anchors.margins: Style.marginTiny * scaling fallbackIcon: "person" - borderColor: Colors.accentPrimary + borderColor: Colors.colorPrimary borderWidth: Math.max(1, Style.borderMedium * scaling) imageRadius: width * 0.5 } @@ -230,7 +230,7 @@ ColumnLayout { NText { text: modelData.login || "Unknown" font.weight: Style.fontWeightBold - color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textPrimary + color: contributorArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface elide: Text.ElideRight Layout.fillWidth: true } @@ -239,7 +239,7 @@ ColumnLayout { text: (modelData.contributions || 0) + " " + ((modelData.contributions || 0) === 1 ? "commit" : "commits") font.pointSize: Style.fontSizeSmall * scaling - color: contributorArea.containsMouse ? Colors.backgroundPrimary : Colors.textSecondary + color: contributorArea.containsMouse ? Colors.colorSurface : Colors.colorOnSurface } } } diff --git a/Modules/Settings/Tabs/Audio.qml b/Modules/Settings/Tabs/Audio.qml index dc6a052..b174304 100644 --- a/Modules/Settings/Tabs/Audio.qml +++ b/Modules/Settings/Tabs/Audio.qml @@ -49,7 +49,7 @@ ColumnLayout { text: "Audio" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } @@ -70,13 +70,13 @@ ColumnLayout { NText { text: "Master Volume" font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: "System-wide volume level" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -110,7 +110,7 @@ ColumnLayout { NText { text: Math.floor(Audio.volume * 100) + "%" Layout.alignment: Qt.AlignVCenter - color: Colors.textSecondary + color: Colors.colorOnSurface } } } @@ -149,7 +149,7 @@ ColumnLayout { text: "Audio Devices" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } @@ -168,13 +168,13 @@ ColumnLayout { text: "Output Device" font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: "Select the desired audio output device" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -207,13 +207,13 @@ ColumnLayout { text: "Input Device" font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: "Select desired audio input device" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -247,7 +247,7 @@ ColumnLayout { text: "Audio Visualizer" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } diff --git a/Modules/Settings/Tabs/Bar.qml b/Modules/Settings/Tabs/Bar.qml index 39f609a..f54a0a8 100644 --- a/Modules/Settings/Tabs/Bar.qml +++ b/Modules/Settings/Tabs/Bar.qml @@ -36,7 +36,7 @@ ColumnLayout { text: "Components" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NToggle { diff --git a/Modules/Settings/Tabs/Display.qml b/Modules/Settings/Tabs/Display.qml index 66f4a72..f93215e 100644 --- a/Modules/Settings/Tabs/Display.qml +++ b/Modules/Settings/Tabs/Display.qml @@ -44,7 +44,7 @@ Item { text: "Per‑monitor configuration" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } Repeater { @@ -52,8 +52,8 @@ Item { delegate: Rectangle { Layout.fillWidth: true radius: Style.radiusMedium * scaling - color: Colors.surface - border.color: Colors.outline + color: Colors.colorSurface + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) implicitHeight: contentCol.implicitHeight + Style.marginXL * 2 * scaling @@ -67,13 +67,13 @@ Item { text: (modelData.name || "Unknown") font.pointSize: Style.fontSizeLarge * scaling font.weight: Style.fontWeightBold - color: Colors.accentSecondary + color: Colors.colorSecondary } NText { text: `Resolution: ${modelData.width}x${modelData.height} - Position: (${modelData.x}, ${modelData.y})` font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface } ColumnLayout { diff --git a/Modules/Settings/Tabs/General.qml b/Modules/Settings/Tabs/General.qml index 53791ac..2ed620e 100644 --- a/Modules/Settings/Tabs/General.qml +++ b/Modules/Settings/Tabs/General.qml @@ -36,7 +36,7 @@ ColumnLayout { text: "General Settings" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } // Profile section @@ -55,7 +55,7 @@ ColumnLayout { height: 64 * scaling imagePath: Settings.data.general.avatarImage fallbackIcon: "person" - borderColor: Colors.accentPrimary + borderColor: Colors.colorPrimary borderWidth: Math.max(1, Style.borderMedium) } @@ -87,7 +87,7 @@ ColumnLayout { text: "User Interface" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } diff --git a/Modules/Settings/Tabs/Misc.qml b/Modules/Settings/Tabs/Misc.qml index 22958a8..64ace7c 100644 --- a/Modules/Settings/Tabs/Misc.qml +++ b/Modules/Settings/Tabs/Misc.qml @@ -36,7 +36,7 @@ ColumnLayout { text: "Miscellaneous Settings" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } } diff --git a/Modules/Settings/Tabs/Network.qml b/Modules/Settings/Tabs/Network.qml index e3d66d5..5b96c91 100644 --- a/Modules/Settings/Tabs/Network.qml +++ b/Modules/Settings/Tabs/Network.qml @@ -38,7 +38,7 @@ ColumnLayout { text: "Interfaces" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NToggle { diff --git a/Modules/Settings/Tabs/ScreenRecorder.qml b/Modules/Settings/Tabs/ScreenRecorder.qml index b18d2ed..2bc9b2b 100644 --- a/Modules/Settings/Tabs/ScreenRecorder.qml +++ b/Modules/Settings/Tabs/ScreenRecorder.qml @@ -36,7 +36,7 @@ ColumnLayout { text: "Recording" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } @@ -87,7 +87,7 @@ ColumnLayout { text: "Video Settings" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } @@ -155,7 +155,7 @@ ColumnLayout { text: "Audio Settings" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } diff --git a/Modules/Settings/Tabs/TimeWeather.qml b/Modules/Settings/Tabs/TimeWeather.qml index 5f511a0..74d17f5 100644 --- a/Modules/Settings/Tabs/TimeWeather.qml +++ b/Modules/Settings/Tabs/TimeWeather.qml @@ -36,7 +36,7 @@ ColumnLayout { text: "Location" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } @@ -73,7 +73,7 @@ ColumnLayout { text: "Time Format" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: 8 } @@ -111,7 +111,7 @@ ColumnLayout { text: "Weather" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } diff --git a/Modules/Settings/Tabs/Wallpaper.qml b/Modules/Settings/Tabs/Wallpaper.qml index 4520be1..c0cd99e 100644 --- a/Modules/Settings/Tabs/Wallpaper.qml +++ b/Modules/Settings/Tabs/Wallpaper.qml @@ -36,7 +36,7 @@ ColumnLayout { text: "Directory" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } @@ -78,7 +78,7 @@ ColumnLayout { text: "Automation" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: Style.marginSmall * scaling } @@ -111,13 +111,13 @@ ColumnLayout { NText { text: "Wallpaper Interval" font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: "How often to change wallpapers automatically (in seconds)" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -137,7 +137,7 @@ ColumnLayout { stepSize: 10 value: Settings.data.wallpaper.randomInterval onPressedChanged: Settings.data.wallpaper.randomInterval = Math.round(value) - cutoutColor: Colors.backgroundPrimary + cutoutColor: Colors.colorSurface } } } @@ -158,7 +158,7 @@ ColumnLayout { text: "SWWW" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface Layout.bottomMargin: 8 } @@ -212,13 +212,13 @@ ColumnLayout { NText { text: "Transition FPS" font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: "Frames per second for transition animations" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -238,7 +238,7 @@ ColumnLayout { stepSize: 5 value: Settings.data.wallpaper.swww.transitionFps onPressedChanged: Settings.data.wallpaper.swww.transitionFps = Math.round(value) - cutoutColor: Colors.backgroundPrimary + cutoutColor: Colors.colorSurface } } @@ -251,13 +251,13 @@ ColumnLayout { NText { text: "Transition Duration" font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: "Duration of transition animations in seconds" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -277,7 +277,7 @@ ColumnLayout { stepSize: 0.05 value: Settings.data.wallpaper.swww.transitionDuration onPressedChanged: Settings.data.wallpaper.swww.transitionDuration = value - cutoutColor: Colors.backgroundPrimary + cutoutColor: Colors.colorSurface } } } diff --git a/Modules/Settings/Tabs/WallpaperSelector.qml b/Modules/Settings/Tabs/WallpaperSelector.qml index 3be5c0f..3caa2b7 100644 --- a/Modules/Settings/Tabs/WallpaperSelector.qml +++ b/Modules/Settings/Tabs/WallpaperSelector.qml @@ -32,15 +32,15 @@ Item { text: "Current Wallpaper" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } Rectangle { Layout.fillWidth: true Layout.preferredHeight: 120 * scaling radius: Style.radiusMedium * scaling - color: Colors.backgroundSecondary - border.color: Colors.outline + color: Colors.colorSurface + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) clip: true @@ -50,7 +50,7 @@ Item { anchors.margins: Style.marginSmall * scaling imagePath: Wallpapers.currentWallpaper fallbackIcon: "image" - borderColor: Colors.outline + borderColor: Colors.colorOutline borderWidth: Math.max(1, Style.borderThin * scaling) imageRadius: Style.radiusMedium * scaling } @@ -73,12 +73,12 @@ Item { text: "Wallpaper Selector" font.pointSize: Style.fontSizeXL * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: "Click on a wallpaper to set it as your current wallpaper" - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -86,7 +86,7 @@ Item { NText { text: Settings.data.wallpaper.swww.enabled ? "Wallpapers will change with " + Settings.data.wallpaper.swww.transitionType + " transition" : "Wallpapers will change instantly" - color: Colors.textSecondary + color: Colors.colorOnSurface font.pointSize: Style.fontSizeSmall * scaling visible: Settings.data.wallpaper.swww.enabled } @@ -147,8 +147,8 @@ Item { width: wallpaperGridView.itemSize height: Math.floor(wallpaperGridView.itemSize * 0.67) radius: Style.radiusMedium * scaling - color: isSelected ? Colors.accentPrimary : Colors.backgroundSecondary - border.color: isSelected ? Colors.accentSecondary : Colors.outline + color: isSelected ? Colors.colorPrimary : Colors.colorSurface + border.color: isSelected ? Colors.colorSecondary : Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) clip: true @@ -170,8 +170,8 @@ Item { width: 20 * scaling height: 20 * scaling radius: width / 2 - color: Colors.accentPrimary - border.color: Colors.onAccent + color: Colors.colorPrimary + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) visible: isSelected @@ -180,14 +180,14 @@ Item { text: "check" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeSmall * scaling - color: Colors.onAccent + color: Colors.colorOnPrimary } } // Hover effect Rectangle { anchors.fill: parent - color: Colors.textPrimary + color: Colors.colorOnSurface opacity: mouseArea.containsMouse ? 0.1 : 0 radius: parent.radius @@ -213,9 +213,9 @@ Item { // Empty state Rectangle { anchors.fill: parent - color: Colors.backgroundSecondary + color: Colors.colorSurface radius: Style.radiusMedium * scaling - border.color: Colors.outline + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) visible: folderModel.count === 0 && !Wallpapers.scanning @@ -227,20 +227,20 @@ Item { text: "folder_open" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeLarge * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface Layout.alignment: Qt.AlignHCenter } NText { text: "No wallpapers found" - color: Colors.textSecondary + color: Colors.colorOnSurface font.weight: Style.fontWeightBold Layout.alignment: Qt.AlignHCenter } NText { text: "Make sure your wallpaper directory is configured and contains image files" - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap horizontalAlignment: Text.AlignHCenter Layout.preferredWidth: 300 * scaling diff --git a/Modules/SidePanel/Cards/MediaCard.qml b/Modules/SidePanel/Cards/MediaCard.qml index 6a59f24..26aa766 100644 --- a/Modules/SidePanel/Cards/MediaCard.qml +++ b/Modules/SidePanel/Cards/MediaCard.qml @@ -39,13 +39,13 @@ NBox { NText { text: "album" font.family: "Material Symbols Outlined" - font.pointSize: 28 * scaling - color: Colors.textSecondary + font.pointSize: Style.fontSizeXXL * 2.5 * scaling + color: Colors.colorOnSurfaceVariant Layout.alignment: Qt.AlignHCenter } NText { text: "No media player detected" - color: Colors.textDisabled + color: Colors.colorOnSurfaceVariant Layout.alignment: Qt.AlignHCenter } @@ -76,7 +76,7 @@ NBox { // implicitWidth: 120 * scaling // implicitHeight: 30 * scaling color: "transparent" - border.color: playerSelector.activeFocus ? Colors.hover : Colors.outline + border.color: playerSelector.activeFocus ? Colors.colorTertiary : Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) radius: Style.radiusMedium * scaling } @@ -87,7 +87,7 @@ NBox { rightPadding: playerSelector.indicator.width + playerSelector.spacing text: playerSelector.displayText font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textPrimary + color: Colors.colorOnSurface verticalAlignment: Text.AlignVCenter elide: Text.ElideRight } @@ -98,7 +98,7 @@ NBox { text: "arrow_drop_down" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeXL * scaling - color: Colors.textPrimary + color: Colors.colorOnSurface horizontalAlignment: Text.AlignRight } @@ -122,14 +122,14 @@ NBox { gradient: Gradient { GradientStop { position: 0.0 - color: Colors.backgroundSecondary + color: Colors.colorSurface } GradientStop { position: 1.0 - color: Colors.backgroundTertiary + color: Colors.colorSurfaceVariant } } - border.color: Colors.outline + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) radius: Style.radiusTiny * scaling } @@ -140,7 +140,7 @@ NBox { contentItem: NText { text: modelData.identity font.pointSize: Style.fontSizeSmall * scaling - color: highlighted ? Colors.backgroundPrimary : Colors.textPrimary + color: highlighted ? Colors.colorSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter elide: Text.ElideRight } @@ -148,7 +148,7 @@ NBox { background: Rectangle { width: popup.width - Style.marginSmall * scaling * 2 - color: highlighted ? Colors.hover : "transparent" + color: highlighted ? Colors.colorTertiary : "transparent" radius: Style.radiusTiny * scaling } } @@ -169,8 +169,8 @@ NBox { width: 90 * scaling height: 90 * scaling radius: width * 0.5 - color: trackArt.visible ? Colors.accentPrimary : "transparent" - border.color: trackArt.visible ? Colors.outline : "transparent" + color: trackArt.visible ? Colors.colorPrimary : "transparent" + border.color: trackArt.visible ? Colors.colorOutline : "transparent" border.width: Math.max(1, Style.borderThin * scaling) clip: true @@ -182,7 +182,7 @@ NBox { anchors.margins: Style.marginTiny * scaling imagePath: MediaPlayer.trackArtUrl fallbackIcon: "image" - borderColor: Colors.outline + borderColor: Colors.colorOutline borderWidth: Math.max(1, Style.borderThin * scaling) imageRadius: width * 0.5 } @@ -217,7 +217,7 @@ NBox { NText { visible: MediaPlayer.trackArtist !== "" text: MediaPlayer.trackArtist - color: Colors.textSecondary + color: Colors.colorOnSurface font.pointSize: Style.fontSizeSmall * scaling elide: Text.ElideRight Layout.fillWidth: true @@ -226,7 +226,7 @@ NBox { NText { visible: MediaPlayer.trackAlbum !== "" text: MediaPlayer.trackAlbum - color: Colors.textSecondary + color: Colors.colorOnSurface font.pointSize: Style.fontSizeSmall * scaling elide: Text.ElideRight Layout.fillWidth: true @@ -241,7 +241,7 @@ NBox { width: parent.width height: 4 * scaling radius: Style.radiusSmall * scaling - color: Colors.backgroundTertiary + color: Colors.colorSurfaceVariant Layout.fillWidth: true property real progressRatio: { @@ -256,7 +256,7 @@ NBox { width: progressBarBackground.progressRatio * parent.width height: parent.height radius: parent.radius - color: Colors.accentPrimary + color: Colors.colorPrimary Behavior on width { NumberAnimation { @@ -271,8 +271,8 @@ NBox { width: 16 * scaling height: 16 * scaling radius: width * 0.5 - color: Colors.accentPrimary - border.color: Colors.backgroundPrimary + color: Colors.colorPrimary + border.color: Colors.colorSurface border.width: Math.max(1 * Style.borderMedium * scaling) x: Math.max(0, Math.min(parent.width - width, progressFill.width - width / 2)) @@ -345,7 +345,7 @@ NBox { width: 300 * scaling height: 80 * scaling values: Cava.values - fillColor: Colors.textPrimary + fillColor: Colors.colorOnSurface Layout.alignment: Qt.AlignHCenter } } @@ -355,8 +355,8 @@ NBox { // values: Cava.values // innerRadius: 30 * scaling // Position just outside 60x60 album art // outerRadius: 48 * scaling // Extend bars outward from album art - // fillColor: Colors.accentPrimary - // strokeColor: Colors.accentPrimary + // fillColor: Colors.colorPrimary + // strokeColor: Colors.colorPrimary // strokeWidth: 0 * scaling // } } diff --git a/Modules/SidePanel/Cards/ProfileCard.qml b/Modules/SidePanel/Cards/ProfileCard.qml index 39d5b6f..ec74814 100644 --- a/Modules/SidePanel/Cards/ProfileCard.qml +++ b/Modules/SidePanel/Cards/ProfileCard.qml @@ -33,7 +33,7 @@ NBox { height: Style.baseWidgetSize * 1.25 * scaling imagePath: Settings.data.general.avatarImage fallbackIcon: "person" - borderColor: Colors.accentPrimary + borderColor: Colors.colorPrimary borderWidth: Math.max(1, Style.borderMedium * scaling) } @@ -46,7 +46,7 @@ NBox { } NText { text: `System Uptime: ${uptimeText}` - color: Colors.textSecondary + color: Colors.colorOnSurface } } diff --git a/Modules/SidePanel/Cards/WeatherCard.qml b/Modules/SidePanel/Cards/WeatherCard.qml index 040b046..3eab860 100644 --- a/Modules/SidePanel/Cards/WeatherCard.qml +++ b/Modules/SidePanel/Cards/WeatherCard.qml @@ -30,7 +30,7 @@ NBox { text: weatherReady ? Location.weatherSymbolFromCode(Location.data.weather.current_weather.weathercode) : "" font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeXXL * 1.5 * scaling - color: Colors.accentPrimary + color: Colors.colorPrimary } ColumnLayout { @@ -91,13 +91,13 @@ NBox { spacing: Style.marginSmall * scaling NText { text: Qt.formatDateTime(new Date(Location.data.weather.daily.time[index]), "ddd") - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: Location.weatherSymbolFromCode(Location.data.weather.daily.weathercode[index]) font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeXL * scaling - color: Colors.accentPrimary + color: Colors.colorPrimary } NText { text: { @@ -112,7 +112,7 @@ NBox { return `${max}°/${min}°` } font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurfaceVariant } } } diff --git a/Modules/SidePanel/PowerMenu.qml b/Modules/SidePanel/PowerMenu.qml index 2815fc5..1d9afe0 100644 --- a/Modules/SidePanel/PowerMenu.qml +++ b/Modules/SidePanel/PowerMenu.qml @@ -25,16 +25,16 @@ NPanel { width: 160 * scaling height: 220 * scaling radius: Style.radiusMedium * scaling - border.color: Colors.outline + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) gradient: Gradient { GradientStop { position: 0.0 - color: Colors.backgroundSecondary + color: Colors.colorSurface } GradientStop { position: 1.0 - color: Colors.backgroundTertiary + color: Colors.colorSurfaceVariant } } @@ -65,7 +65,7 @@ NPanel { Layout.fillWidth: true Layout.preferredHeight: 36 * scaling radius: Style.radiusSmall * scaling - color: lockButtonArea.containsMouse ? Colors.hover : "transparent" + color: lockButtonArea.containsMouse ? Colors.colorTertiary : "transparent" Item { anchors.left: parent.left @@ -88,7 +88,7 @@ NPanel { font.variableAxes: { "wght": (Font.Normal + Font.Bold) / 2.0 } - color: lockButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: lockButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -96,7 +96,7 @@ NPanel { Text { text: "Lock Screen" - color: lockButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: lockButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -125,7 +125,7 @@ NPanel { Layout.fillWidth: true Layout.preferredHeight: 36 * scaling radius: Style.radiusSmall * scaling - color: suspendButtonArea.containsMouse ? Colors.hover : "transparent" + color: suspendButtonArea.containsMouse ? Colors.colorTertiary : "transparent" Item { anchors.left: parent.left @@ -148,7 +148,7 @@ NPanel { font.variableAxes: { "wght": (Font.Normal + Font.Bold) / 2.0 } - color: suspendButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: suspendButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -156,7 +156,7 @@ NPanel { Text { text: "Suspend" - color: suspendButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: suspendButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -183,7 +183,7 @@ NPanel { Layout.fillWidth: true Layout.preferredHeight: 36 * scaling radius: Style.radiusSmall * scaling - color: rebootButtonArea.containsMouse ? Colors.hover : "transparent" + color: rebootButtonArea.containsMouse ? Colors.colorTertiary : "transparent" Item { anchors.left: parent.left @@ -206,7 +206,7 @@ NPanel { font.variableAxes: { "wght": (Font.Normal + Font.Bold) / 2.0 } - color: rebootButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: rebootButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -214,7 +214,7 @@ NPanel { Text { text: "Reboot" - color: rebootButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: rebootButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -241,7 +241,7 @@ NPanel { Layout.fillWidth: true Layout.preferredHeight: 36 * scaling radius: Style.radiusSmall * scaling - color: logoutButtonArea.containsMouse ? Colors.hover : "transparent" + color: logoutButtonArea.containsMouse ? Colors.colorTertiary : "transparent" Item { anchors.left: parent.left @@ -264,7 +264,7 @@ NPanel { font.variableAxes: { "wght": (Font.Normal + Font.Bold) / 2.0 } - color: logoutButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: logoutButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -272,7 +272,7 @@ NPanel { Text { text: "Logout" - color: logoutButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: logoutButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -299,7 +299,7 @@ NPanel { Layout.fillWidth: true Layout.preferredHeight: 36 * scaling radius: Style.radiusSmall * scaling - color: shutdownButtonArea.containsMouse ? Colors.hover : "transparent" + color: shutdownButtonArea.containsMouse ? Colors.colorTertiary : "transparent" Item { anchors.left: parent.left @@ -322,7 +322,7 @@ NPanel { font.variableAxes: { "wght": (Font.Normal + Font.Bold) / 2.0 } - color: shutdownButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: shutdownButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling @@ -330,7 +330,7 @@ NPanel { Text { text: "Shutdown" - color: shutdownButtonArea.containsMouse ? Colors.textPrimary : Colors.textPrimary + color: shutdownButtonArea.containsMouse ? Colors.colorOnSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter anchors.verticalCenter: parent.verticalCenter anchors.verticalCenterOffset: 1 * scaling diff --git a/Modules/SidePanel/SidePanel.qml b/Modules/SidePanel/SidePanel.qml index 97c267a..7c3aec2 100644 --- a/Modules/SidePanel/SidePanel.qml +++ b/Modules/SidePanel/SidePanel.qml @@ -81,20 +81,9 @@ NLoader { // Inline helpers moved to dedicated widgets: NCard and NCircleStat Rectangle { id: panelBackground - color: "transparent" - gradient: Gradient { - GradientStop { - position: 0.0 - color: Colors.backgroundSecondary - } - GradientStop { - position: 1.0 - color: Colors.backgroundTertiary - } - } - + color: Colors.colorSurface radius: Style.radiusLarge * scaling - border.color: Colors.backgroundTertiary + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderMedium * scaling) layer.enabled: true width: 460 * scaling diff --git a/Services/Colors.qml b/Services/Colors.qml index 45afb9b..fa4230d 100644 --- a/Services/Colors.qml +++ b/Services/Colors.qml @@ -5,117 +5,162 @@ import Quickshell import Quickshell.Io import qs.Services +// -------------------------------- +// Material3 Colors +// We only use a subset of all materials colors to avoid complexity Singleton { id: root - // Backgrounds - property color backgroundPrimary: useMatugen ? matugenTheme.backgroundPrimary : defaultTheme.backgroundPrimary - property color backgroundSecondary: useMatugen ? matugenTheme.backgroundSecondary : defaultTheme.backgroundSecondary - property color backgroundTertiary: useMatugen ? matugenTheme.backgroundTertiary : defaultTheme.backgroundTertiary + // --- Key Colors + property color colorPrimary: useMatugen ? matugenTheme.colorPrimary : defaultTheme.colorPrimary + property color colorOnPrimary: useMatugen ? matugenTheme.colorOnPrimary : defaultTheme.colorOnPrimary + property color colorPrimaryContainer: useMatugen ? matugenTheme.colorPrimaryContainer : defaultTheme.colorPrimaryContainer + property color colorOnPrimaryContainer: useMatugen ? matugenTheme.colorOnPrimaryContainer : defaultTheme.colorOnPrimaryContainer - // Surfaces & Elevation - property color surface: useMatugen ? matugenTheme.surface : defaultTheme.surface - property color surfaceVariant: useMatugen ? matugenTheme.surfaceVariant : defaultTheme.surfaceVariant + property color colorSecondary: useMatugen ? matugenTheme.colorSecondary : defaultTheme.colorSecondary + property color colorOnSecondary: useMatugen ? matugenTheme.colorOnSecondary : defaultTheme.colorOnSecondary + property color colorSecondaryContainer: useMatugen ? matugenTheme.colorSecondaryContainer : defaultTheme.colorSecondaryContainer + property color colorOnSecondaryContainer: useMatugen ? matugenTheme.colorOnSecondaryContainer : defaultTheme.colorOnSecondaryContainer - // Text Colors - property color textPrimary: useMatugen ? matugenTheme.textPrimary : defaultTheme.textPrimary - property color textSecondary: useMatugen ? matugenTheme.textSecondary : defaultTheme.textSecondary - property color textDisabled: useMatugen ? matugenTheme.textDisabled : defaultTheme.textDisabled + property color colorTertiary: useMatugen ? matugenTheme.colorTertiary : defaultTheme.colorTertiary + property color colorOnTertiary: useMatugen ? matugenTheme.colorOnTertiary : defaultTheme.colorOnTertiary + property color colorTertiaryContainer: useMatugen ? matugenTheme.colorTertiaryContainer : defaultTheme.colorTertiaryContainer + property color colorOnTertiaryContainer: useMatugen ? matugenTheme.colorOnTertiaryContainer : defaultTheme.colorOnTertiaryContainer - // Accent Colors - property color accentPrimary: useMatugen ? matugenTheme.accentPrimary : defaultTheme.accentPrimary - property color accentSecondary: useMatugen ? matugenTheme.accentSecondary : defaultTheme.accentSecondary - property color accentTertiary: useMatugen ? matugenTheme.accentTertiary : defaultTheme.accentTertiary + // --- Utility Colors + property color colorError: useMatugen ? matugenTheme.colorError : defaultTheme.colorError + property color colorOnError: useMatugen ? matugenTheme.colorOnError : defaultTheme.colorOnError + property color colorErrorContainer: useMatugen ? matugenTheme.colorErrorContainer : defaultTheme.colorErrorContainer + property color colorOnErrorContainer: useMatugen ? matugenTheme.colorOnErrorContainer : defaultTheme.colorOnErrorContainer - // Error/Warning - property color error: useMatugen ? matugenTheme.error : defaultTheme.error - property color warning: useMatugen ? matugenTheme.warning : defaultTheme.warning + // --- Surface and Variant Colors + property color colorSurface: useMatugen ? matugenTheme.colorSurface : defaultTheme.colorSurface + property color colorOnSurface: useMatugen ? matugenTheme.colorOnSurface : defaultTheme.colorOnSurface + property color colorSurfaceVariant: useMatugen ? matugenTheme.colorSurfaceVariant : defaultTheme.colorSurfaceVariant + property color colorOnSurfaceVariant: useMatugen ? matugenTheme.colorOnSurfaceVariant : defaultTheme.colorOnSurfaceVariant + property color colorInversePrimary: useMatugen ? matugenTheme.colorInversePrimary : defaultTheme.colorInversePrimary + property color colorOutline: useMatugen ? matugenTheme.colorOutline : defaultTheme.colorOutline + property color colorOutlineVariant: useMatugen ? matugenTheme.colorOutlineVariant : defaultTheme.colorOutlineVariant + property color colorShadow: useMatugen ? matugenTheme.colorShadow : defaultTheme.colorShadow - // Hover - property color hover: useMatugen ? matugenTheme.hover : defaultTheme.hover - - // Additional Theme Properties - property color onAccent: useMatugen ? matugenTheme.onAccent : defaultTheme.onAccent - property color outline: useMatugen ? matugenTheme.outline : defaultTheme.outline - - // Shadows & Overlays - property color shadow: applyOpacity(useMatugen ? matugenTheme.shadow : defaultTheme.shadow, "B3") - property color overlay: applyOpacity(useMatugen ? matugenTheme.overlay : defaultTheme.overlay, "66") + // ----------- // Check if we should use Matugen theme property bool useMatugen: Settings.data.wallpaper.generateTheme && matugenFile.loaded + // ----------- function applyOpacity(color, opacity) { // Convert color to string and apply opacity return color.toString().replace("#", "#" + opacity) } - // Default theme colors + // -------------------------------- + // Default theme colors - RosePine QtObject { id: defaultTheme - property color backgroundPrimary: "#191724" - property color backgroundSecondary: "#1f1d2e" - property color backgroundTertiary: "#26233a" + // // --- Key Colors: These are the main accent colors that define your app's theme. + property color colorPrimary: "#000000" // The main brand color, used most frequently. + property color colorOnPrimary: "#000000" // Color for text/icons on a Primary background. + property color colorPrimaryContainer: "#000000" // A lighter/subtler tone of Primary, used for component backgrounds. + property color colorOnPrimaryContainer: "#000000" // Color for text/icons on a Primary Container background. - property color surface: "#1b1927" - property color surfaceVariant: "#262337" + property color colorSecondary: "#000000" // An accent color for less prominent components. + property color colorOnSecondary: "#000000" // Color for text/icons on a Secondary background. + property color colorSecondaryContainer: "#000000" // A lighter/subtler tone of Secondary. + property color colorOnSecondaryContainer: "#000000" // olor for text/icons on a Secondary Container background. - property color textPrimary: "#e0def4" - property color textSecondary: "#908caa" - property color textDisabled: "#6e6a86" + property color colorTertiary: "#000000" // A contrasting accent color used for things like highlights or special actions. + property color colorOnTertiary: "#000000" // Color for text/icons on a Tertiary background. + property color colorTertiaryContainer: "#000000" // A lighter/subtler tone of Tertiary. + property color colorOnTertiaryContainer: "#000000" // Color for text/icons on a Tertiary Container background. - property color accentPrimary: "#ebbcba" - property color accentSecondary: "#31748f" - property color accentTertiary: "#9ccfd8" + // --- Utility colorColors: These colors serve specific, universal purposes like indicating errors or providing neutral backgrounds. + property color colorError: "#000000" // Indicates an error state. + property color colorOnError: "#000000" // Color for text/icons on an Error background. + property color colorErrorContainer: "#000000" // A lighter/subtler tone of Error. + property color colorOnErrorContainer: "#000000" // Color for text/icons on an Error Container background. - property color error: "#eb6f92" - property color warning: "#f6c177" + // --- Surface colorand Variant Colors: These provide additional options for surfaces and their contents, creating visual hierarchy. + property color colorSurface: "#000000" // The color for component surfaces like cards, sheets, and menus. + property color colorOnSurface: "#000000" // The primary color for text/icons on a Surface background. + property color colorSurfaceVariant: "#000000" // A surface color with a slightly different tint for differentiation. + property color colorOnSurfaceVariant: "#000000" // The color for less prominent text/icons on a Surface. + property color colorInversePrimary: "#000000" // A primary color legible on an Inverse Surface, often used for call-to-action buttons. + property color colorOutline: "#000000" // The color for component outlines, like text fields or buttons. + property color colorOutlineVariant: "#000000" // A subtler outline color for decorative elements or dividers. + property color colorShadow: "#000000" // The color used for shadows to create elevation. - property color hover: "#c4a7e7" - property color onAccent: "#191724" - property color outline: "#44415a" + // // property color colorBackground: "#191724" + // // property color colorSurface: "#1f1d2e" + // // property color colorSurfaceVariant: "#26233a" - property color shadow: "#191724" - property color overlay: "#191724" + // // property color surface: "#1b1927" + // // property color surfaceVariant: "#262337" + + // // property color colorOnBackground: "#e0def4" + // // property color textSecondary: "#908caa" + // // property color textDisabled: "#6e6a86" + + // // property color colorPrimary: "#ebbcba" + // // property color accentSecondary: "#31748f" + // // property color accentTertiary: "#9ccfd8" + + // // property color error: "#eb6f92" + // // property color warning: "#f6c177" + + // // property color hover: "#c4a7e7" + + // // property color onAccent: "#191724" + // // property color outline: "#44415a" + + // // property color shadow: "#191724" + // // property color overlay: "#191724" } + // ---------------------------------------------------------------- // Matugen theme colors (loaded from theme.json) QtObject { id: matugenTheme - property color backgroundPrimary: matugenData.backgroundPrimary - property color backgroundSecondary: matugenData.backgroundSecondary - property color backgroundTertiary: matugenData.backgroundTertiary + // --- Key Colors + property color colorPrimary: matugenData.colorPrimary + property color colorOnPrimary: matugenData.colorOnPrimary + property color colorPrimaryContainer: matugenData.colorPrimaryContainer + property color colorOnPrimaryContainer: matugenData.colorOnPrimaryContainer - property color surface: matugenData.surface - property color surfaceVariant: matugenData.surfaceVariant + property color colorSecondary: matugenData.colorSecondary + property color colorOnSecondary: matugenData.colorOnSecondary + property color colorSecondaryContainer: matugenData.colorSecondaryContainer + property color colorOnSecondaryContainer: matugenData.colorOnSecondaryContainer - property color textPrimary: matugenData.textPrimary - property color textSecondary: matugenData.textSecondary - property color textDisabled: matugenData.textDisabled + property color colorTertiary: matugenData.colorTertiary + property color colorOnTertiary: matugenData.colorOnTertiary + property color colorTertiaryContainer: matugenData.colorTertiaryContainer + property color colorOnTertiaryContainer: matugenData.colorOnTertiaryContainer - property color accentPrimary: matugenData.accentPrimary - property color accentSecondary: matugenData.accentSecondary - property color accentTertiary: matugenData.accentTertiary + // --- Utility Colors + property color colorError: matugenData.colorError + property color colorOnError: matugenData.colorOnError + property color colorErrorContainer: matugenData.colorErrorContainer + property color colorOnErrorContainer: matugenData.colorOnErrorContainer - property color error: matugenData.error - property color warning: matugenData.warning - - property color hover: matugenData.hover - - property color onAccent: matugenData.onAccent - property color outline: matugenData.outline - - property color shadow: matugenData.shadow - property color overlay: matugenData.overlay + // --- Surface and Variant Colors + property color colorSurface: matugenData.colorSurface + property color colorOnSurface: matugenData.colorOnSurface + property color colorSurfaceVariant: matugenData.colorSurfaceVariant + property color colorOnSurfaceVariant: matugenData.colorOnSurfaceVariant + property color colorInversePrimary: matugenData.colorInversePrimary + property color colorOutline: matugenData.colorOutline + property color colorOutlineVariant: matugenData.colorOutlineVariant + property color colorShadow: matugenData.colorShadow } - // FileView to load Matugen theme data from Theme.json + // FileView to load Matugen theme data from colors.json FileView { id: matugenFile - path: Settings.configDir + "theme.json" + path: Settings.configDir + "colors.json" watchChanges: true onFileChanged: reload() onAdapterUpdated: writeAdapter() @@ -128,39 +173,37 @@ Singleton { JsonAdapter { id: matugenData - // Backgrounds - property string backgroundPrimary: "#191724" - property string backgroundSecondary: "#1f1d2e" - property string backgroundTertiary: "#26233a" + // --- Key Colors + property color colorPrimary: defaultTheme.colorPrimary + property color colorOnPrimary: defaultTheme.colorOnPrimary + property color colorPrimaryContainer: defaultTheme.colorPrimaryContainer + property color colorOnPrimaryContainer: defaultTheme.colorOnPrimaryContainer - // Surfaces & Elevation - property string surface: "#1b1927" - property string surfaceVariant: "#262337" + property color colorSecondary: defaultTheme.colorSecondary + property color colorOnSecondary: defaultTheme.colorOnSecondary + property color colorSecondaryContainer: defaultTheme.colorSecondaryContainer + property color colorOnSecondaryContainer: defaultTheme.colorOnSecondaryContainer - // Text Colors - property string textPrimary: "#e0def4" - property string textSecondary: "#908caa" - property string textDisabled: "#6e6a86" + property color colorTertiary: defaultTheme.colorTertiary + property color colorOnTertiary: defaultTheme.colorOnTertiary + property color colorTertiaryContainer: defaultTheme.colorTertiaryContainer + property color colorOnTertiaryContainer: defaultTheme.colorOnTertiaryContainer - // Accent Colors - property string accentPrimary: "#ebbcba" - property string accentSecondary: "#31748f" - property string accentTertiary: "#9ccfd8" + // --- Utility Colors + property color colorError: defaultTheme.colorError + property color colorOnError: defaultTheme.colorOnError + property color colorErrorContainer: defaultTheme.colorErrorContainer + property color colorOnErrorContainer: defaultTheme.colorOnErrorContainer - // Error/Warning - property string error: "#eb6f92" - property string warning: "#f6c177" - - // Hover - property string hover: "#c4a7e7" - - // Additional Theme Properties - property string onAccent: "#191724" - property string outline: "#44415a" - - // Shadows & Overlays - property string shadow: "#191724" - property string overlay: "#191724" + // --- Surface and Variant Colors + property color colorSurface: defaultTheme.colorSurface + property color colorOnSurface: defaultTheme.colorOnSurface + property color colorSurfaceVariant: defaultTheme.colorSurfaceVariant + property color colorOnSurfaceVariant: defaultTheme.colorOnSurfaceVariant + property color colorInversePrimary: defaultTheme.colorInversePrimary + property color colorOutline: defaultTheme.colorOutline + property color colorOutlineVariant: defaultTheme.colorOutlineVariant + property color colorShadow: defaultTheme.colorShadow } } } diff --git a/Services/Settings.qml b/Services/Settings.qml index ff78fc1..7bab6c0 100644 --- a/Services/Settings.qml +++ b/Services/Settings.qml @@ -18,7 +18,6 @@ Singleton { "HOME") + "/.cache") + "/" + shellName + "/" property string settingsFile: Quickshell.env("NOCTALIA_SETTINGS_FILE") || (configDir + "settings.json") - property string colorsFile: Quickshell.env("NOCTALIA_COLORS_FILE") || (configDir + "colors.json") property string defaultWallpaper: Qt.resolvedUrl("../Assets/Tests/wallpaper.png") property string defaultAvatar: Quickshell.env("HOME") + "/.face" diff --git a/Services/Wallpapers.qml b/Services/Wallpapers.qml index 0b3201f..74dc578 100644 --- a/Services/Wallpapers.qml +++ b/Services/Wallpapers.qml @@ -155,13 +155,12 @@ Singleton { Process { id: generateThemeProcess - command: [Quickshell.shellDir + "/Bin/matugen-theme.sh", currentWallpaper] + command: ["matugen", "image", currentWallpaper, "--config", Quickshell.shellDir + "/Assets/Matugen/matugen.toml"] workingDirectory: Quickshell.shellDir running: false stdout: StdioCollector { onStreamFinished: { - - // console.log(this.text) + //console.log(this.text) } } } diff --git a/Widgets/NBox.qml b/Widgets/NBox.qml index b75d79c..310f1fe 100644 --- a/Widgets/NBox.qml +++ b/Widgets/NBox.qml @@ -11,9 +11,9 @@ Rectangle { implicitWidth: childrenRect.width implicitHeight: childrenRect.height - color: Colors.surface + color: Colors.colorSurfaceVariant radius: Style.radiusMedium * scaling - border.color: Colors.backgroundTertiary + border.color: Colors.colorOutlineVariant border.width: Math.max(1, Style.borderThin * scaling) clip: true } diff --git a/Widgets/NBusyIndicator.qml b/Widgets/NBusyIndicator.qml index d405449..3164fe9 100644 --- a/Widgets/NBusyIndicator.qml +++ b/Widgets/NBusyIndicator.qml @@ -7,7 +7,7 @@ Item { readonly property real scaling: Scaling.scale(screen) property bool running: true - property color color: Colors.accentPrimary + property color color: Colors.colorPrimary property int size: Style.baseWidgetSize * scaling property int strokeWidth: Style.borderThick * scaling property int duration: 1000 diff --git a/Widgets/NCard.qml b/Widgets/NCard.qml index bc2bb40..3361305 100644 --- a/Widgets/NCard.qml +++ b/Widgets/NCard.qml @@ -10,8 +10,8 @@ Rectangle { implicitWidth: childrenRect.width implicitHeight: childrenRect.height - color: Colors.backgroundSecondary + color: Colors.colorSurface radius: Style.radiusMedium * scaling - border.color: Colors.backgroundTertiary + border.color: Colors.colorSurfaceVariant border.width: Math.max(1, Style.borderThin * scaling) } diff --git a/Widgets/NCircleStat.qml b/Widgets/NCircleStat.qml index 80bec42..4909d62 100644 --- a/Widgets/NCircleStat.qml +++ b/Widgets/NCircleStat.qml @@ -18,9 +18,9 @@ Rectangle { width: 68 * scaling height: 92 * scaling - color: flat ? "transparent" : Colors.backgroundSecondary + color: flat ? "transparent" : Colors.colorSurface radius: Style.radiusSmall * scaling - border.color: flat ? "transparent" : Colors.backgroundTertiary + border.color: flat ? "transparent" : Colors.colorSurfaceVariant border.width: flat ? 0 : Math.max(1, Style.borderThin * scaling) clip: true @@ -58,14 +58,14 @@ Rectangle { ctx.reset() ctx.lineWidth = 6 * root.scaling * contentScale // Track uses surfaceVariant for stronger contrast - ctx.strokeStyle = Colors.surfaceVariant + ctx.strokeStyle = Colors.colorSurface ctx.beginPath() ctx.arc(cx, cy, r, start, endBg) ctx.stroke() // Value arc const ratio = Math.max(0, Math.min(1, root.value / 100)) const end = start + (endBg - start) * ratio - ctx.strokeStyle = Colors.accentPrimary + ctx.strokeStyle = Colors.colorPrimary ctx.beginPath() ctx.arc(cx, cy, r, start, end) ctx.stroke() @@ -79,7 +79,7 @@ Rectangle { text: `${root.value}${root.suffix}` font.pointSize: Style.fontSizeMedium * scaling * contentScale font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface horizontalAlignment: Text.AlignHCenter } @@ -89,8 +89,8 @@ Rectangle { width: 28 * scaling * contentScale height: width radius: width / 2 - color: Colors.surfaceVariant - // border.color: Colors.accentPrimary + color: Colors.colorSurface + // border.color: Colors.colorPrimary // border.width: Math.max(1, Style.borderThin * scaling) anchors.right: parent.right anchors.top: parent.top @@ -102,7 +102,7 @@ Rectangle { text: root.icon font.family: "Material Symbols Outlined" font.pointSize: Style.fontSizeLargeXL * scaling * contentScale - color: Colors.textSecondary + color: Colors.colorOnSurface horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter } diff --git a/Widgets/NComboBox.qml b/Widgets/NComboBox.qml index e34e9f0..ddc8d85 100644 --- a/Widgets/NComboBox.qml +++ b/Widgets/NComboBox.qml @@ -29,13 +29,13 @@ ColumnLayout { text: label font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: description font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap } } @@ -56,8 +56,8 @@ ColumnLayout { background: Rectangle { implicitWidth: 120 * scaling implicitHeight: preferredHeight - color: Colors.surfaceVariant - border.color: combo.activeFocus ? Colors.hover : Colors.outline + color: Colors.colorSurfaceVariant + border.color: combo.activeFocus ? Colors.colorTertiary : Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) radius: Style.radiusMedium * scaling } @@ -97,8 +97,8 @@ ColumnLayout { } background: Rectangle { - color: Colors.surfaceVariant - border.color: Colors.outline + color: Colors.colorSurfaceVariant + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) radius: Style.radiusMedium * scaling } @@ -112,14 +112,14 @@ ColumnLayout { text: (combo.model.indexOf(modelData) >= 0 && combo.model.indexOf( modelData) < root.optionsLabels.length) ? root.optionsLabels[combo.model.indexOf(modelData)] : "" font.pointSize: Style.fontSizeMedium * scaling - color: highlighted ? Colors.backgroundPrimary : Colors.textPrimary + color: highlighted ? Colors.colorSurface : Colors.colorOnSurface verticalAlignment: Text.AlignVCenter elide: Text.ElideRight } background: Rectangle { width: combo.width - Style.marginMedium * scaling * 3 - color: highlighted ? Colors.hover : "transparent" + color: highlighted ? Colors.colorTertiary : "transparent" radius: Style.radiusSmall * scaling } } diff --git a/Widgets/NDivider.qml b/Widgets/NDivider.qml index bd47353..5cb2ea0 100644 --- a/Widgets/NDivider.qml +++ b/Widgets/NDivider.qml @@ -6,5 +6,5 @@ import qs.Services Rectangle { width: parent.width height: Math.max(1, Style.borderThin * scaling) - color: Colors.outline + color: Colors.colorOutline } diff --git a/Widgets/NIconButton.qml b/Widgets/NIconButton.qml index 28e0b6f..19580e3 100644 --- a/Widgets/NIconButton.qml +++ b/Widgets/NIconButton.qml @@ -26,9 +26,9 @@ Rectangle { implicitWidth: size implicitHeight: size - color: (root.hovering || showFilled) ? Colors.accentPrimary : "transparent" + color: (root.hovering || showFilled) ? Colors.colorPrimary : "transparent" radius: width * 0.5 - border.color: showBorder ? Colors.accentPrimary : "transparent" + border.color: showBorder ? Colors.colorPrimary : "transparent" border.width: Math.max(1, Style.borderThin * scaling) NText { @@ -42,7 +42,7 @@ Rectangle { font.variableAxes: { "wght": (Font.Normal + Font.Bold) / 2.0 } - color: (root.hovering || showFilled) ? Colors.onAccent : showBorder ? Colors.accentPrimary : Colors.textPrimary + color: (root.hovering || showFilled) ? Colors.colorOnPrimary : showBorder ? Colors.colorPrimary : Colors.colorOnSurface horizontalAlignment: Text.AlignHCenter verticalAlignment: Text.AlignVCenter opacity: root.enabled ? Style.opacityFull : Style.opacityMedium diff --git a/Widgets/NPill.qml b/Widgets/NPill.qml index 05c3a3e..65a0752 100644 --- a/Widgets/NPill.qml +++ b/Widgets/NPill.qml @@ -10,11 +10,11 @@ Item { property string icon: "" property string text: "" property string tooltipText: "" - property color pillColor: Colors.surfaceVariant - property color textColor: Colors.textPrimary - property color iconCircleColor: Colors.accentPrimary - property color iconTextColor: Colors.backgroundPrimary - property color collapsedIconColor: Colors.textPrimary + property color pillColor: Colors.colorSurfaceVariant + property color textColor: Colors.colorOnSurface + property color iconCircleColor: Colors.colorPrimary + property color iconTextColor: Colors.colorSurface + property color collapsedIconColor: Colors.colorOnSurface property real sizeMultiplier: 0.8 property bool autoHide: false diff --git a/Widgets/NRadioButton.qml b/Widgets/NRadioButton.qml index 06e9098..14e6f49 100644 --- a/Widgets/NRadioButton.qml +++ b/Widgets/NRadioButton.qml @@ -13,7 +13,7 @@ RadioButton { implicitHeight: 20 * scaling radius: width * 0.5 color: "transparent" - border.color: root.checked ? Colors.accentPrimary : Colors.textPrimary + border.color: root.checked ? Colors.colorPrimary : Colors.colorOnSurface border.width: 2 anchors.verticalCenter: parent.verticalCenter @@ -23,7 +23,7 @@ RadioButton { implicitHeight: Style.marginSmall * scaling radius: width * 0.5 - color: Qt.alpha(Colors.accentPrimary, root.checked ? 1 : 0) + color: Qt.alpha(Colors.colorPrimary, root.checked ? 1 : 0) } Behavior on border.color { diff --git a/Widgets/NSlider.qml b/Widgets/NSlider.qml index 2e9e6d1..2a2ed96 100644 --- a/Widgets/NSlider.qml +++ b/Widgets/NSlider.qml @@ -27,13 +27,13 @@ Slider { width: root.availableWidth height: implicitHeight radius: height / 2 - color: Colors.surfaceVariant + color: Colors.colorSurfaceVariant Rectangle { id: activeTrack width: root.visualPosition * parent.width height: parent.height - color: Colors.accentPrimary + color: Colors.colorPrimary radius: parent.radius } @@ -43,7 +43,7 @@ Slider { width: knobDiameter + cutoutExtra height: knobDiameter + cutoutExtra radius: width / 2 - color: root.cutoutColor !== undefined ? root.cutoutColor : Colors.backgroundPrimary + color: root.cutoutColor !== undefined ? root.cutoutColor : Colors.colorSurface x: Math.max(0, Math.min(parent.width - width, root.visualPosition * (parent.width - root.knobDiameter) - cutoutExtra / 2)) y: (parent.height - height) / 2 @@ -61,7 +61,7 @@ Slider { anchors.fill: knob source: knob shadowEnabled: true - shadowColor: Colors.shadow + shadowColor: Colors.colorShadow shadowOpacity: 0.25 shadowHorizontalOffset: 0 shadowVerticalOffset: 1 @@ -73,8 +73,8 @@ Slider { implicitWidth: knobDiameter implicitHeight: knobDiameter radius: width * 0.5 - color: root.pressed ? Colors.surfaceVariant : Colors.surface - border.color: Colors.accentPrimary + color: root.pressed ? Colors.colorSurfaceVariant : Colors.colorSurface + border.color: Colors.colorPrimary border.width: Math.max(1, Style.borderThick * scaling) // Press feedback halo (using accent color, low opacity) @@ -83,7 +83,7 @@ Slider { width: parent.width + 8 * scaling height: parent.height + 8 * scaling radius: width / 2 - color: Colors.accentPrimary + color: Colors.colorPrimary opacity: root.pressed ? 0.16 : 0.0 } } diff --git a/Widgets/NText.qml b/Widgets/NText.qml index 0544aac..d410537 100644 --- a/Widgets/NText.qml +++ b/Widgets/NText.qml @@ -10,5 +10,5 @@ Text { font.family: Settings.data.ui.fontFamily font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightRegular - color: Colors.textPrimary + color: Colors.colorOnSurface } diff --git a/Widgets/NTextInput.qml b/Widgets/NTextInput.qml index 8a7de1a..e96afc6 100644 --- a/Widgets/NTextInput.qml +++ b/Widgets/NTextInput.qml @@ -29,13 +29,13 @@ Item { text: label font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: description font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -47,8 +47,8 @@ Item { implicitWidth: root.width implicitHeight: Style.baseWidgetSize * 1.35 * scaling radius: Style.radiusMedium * scaling - color: Colors.surfaceVariant - border.color: Colors.outline + color: Colors.colorSurfaceVariant + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) // Focus ring @@ -56,7 +56,7 @@ Item { anchors.fill: parent radius: frame.radius color: "transparent" - border.color: input.activeFocus ? Colors.hover : "transparent" + border.color: input.activeFocus ? Colors.colorTertiary : "transparent" border.width: input.activeFocus ? Math.max(1, Style.borderThin * scaling) : 0 } @@ -74,8 +74,8 @@ Item { echoMode: TextInput.Normal readOnly: root.readOnly enabled: root.enabled - color: Colors.textPrimary - placeholderTextColor: Colors.textSecondary + color: Colors.colorOnSurface + placeholderTextColor: Colors.colorOnSurface background: null font.pointSize: Style.fontSizeSmall * scaling onEditingFinished: root.editingFinished() diff --git a/Widgets/NToggle.qml b/Widgets/NToggle.qml index 28c766c..7994229 100644 --- a/Widgets/NToggle.qml +++ b/Widgets/NToggle.qml @@ -27,13 +27,13 @@ RowLayout { text: label font.pointSize: Style.fontSizeMedium * scaling font.weight: Style.fontWeightBold - color: Colors.textPrimary + color: Colors.colorOnSurface } NText { text: description font.pointSize: Style.fontSizeSmall * scaling - color: Colors.textSecondary + color: Colors.colorOnSurface wrapMode: Text.WordWrap Layout.fillWidth: true } @@ -45,16 +45,16 @@ RowLayout { implicitWidth: root.baseSize * 1.625 * scaling implicitHeight: root.baseSize * scaling radius: height * 0.5 - color: value ? Colors.accentPrimary : Colors.surfaceVariant - border.color: value ? Colors.accentPrimary : Colors.outline + color: value ? Colors.colorPrimary : Colors.colorSurface + border.color: value ? Colors.colorPrimary : Colors.colorOutline border.width: Math.max(1, Style.borderMedium * scaling) Rectangle { - implicitWidth: (root.baseSize - 4) * scaling - implicitHeight: (root.baseSize - 4) * scaling + implicitWidth: (root.baseSize - 5) * scaling + implicitHeight: (root.baseSize - 5) * scaling radius: height * 0.5 - color: Colors.surface - border.color: hovering ? Colors.textDisabled : Colors.outline + color: value ? Colors.colorOnSurface : Colors.colorPrimary //Colors.onBackground : Colors.colorSecondary + border.color: value ? Colors.colorSurface: Colors.colorSurface border.width: Math.max(1, Style.borderMedium * scaling) y: 2 * scaling x: value ? switcher.width - width - 2 * scaling : 2 * scaling diff --git a/Widgets/NTooltip.qml b/Widgets/NTooltip.qml index a450eb9..3319083 100644 --- a/Widgets/NTooltip.qml +++ b/Widgets/NTooltip.qml @@ -135,17 +135,8 @@ Window { id: tooltipRect anchors.fill: parent radius: Style.radiusMedium * scaling - gradient: Gradient { - GradientStop { - position: 0.0 - color: Colors.backgroundSecondary - } - GradientStop { - position: 1.0 - color: Colors.backgroundTertiary - } - } - border.color: Colors.outline + color: Colors.colorSurface + border.color: Colors.colorOutline border.width: Math.max(1, Style.borderThin * scaling) z: 1