never/noctalia-shell
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Settings vs Colors

Browse source 
Moved the fontFamily in the settings
Theme is now called Colors (as in ColorScheme)
This commit is contained in:
quadbyte 2025-08-09 18:40:55 -04:00
parent 285321dcb9
commit 55bc7c9534
11 changed files with 45 additions and 46 deletions
Download patch file Download diff file Expand all files Collapse all files

2
Modules/Bar/Bar.qml
View file

@ -26,7 +26,7 @@ PanelWindow {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
color: Theme.backgroundPrimary color: Colors.backgroundPrimary
layer.enabled: true layer.enabled: true
} }

4
Modules/Bar/Clock.qml
View file

@ -14,10 +14,10 @@ Rectangle {
Text { Text {
id: textItem id: textItem
text: Time.time text: Time.time
font.family: Theme.fontFamily font.family: Settings.settings.fontFamily
font.weight: Font.Bold font.weight: Font.Bold
font.pointSize: Style.fontMedium * scaling font.pointSize: Style.fontMedium * scaling
color: Theme.textPrimary color: Colors.textPrimary
anchors.centerIn: parent anchors.centerIn: parent
} }

10
Modules/DemoPanel/DemoPanel.qml
View file

@ -17,9 +17,9 @@ NPanel {
readonly property real scaling: Scaling.scale(screen) readonly property real scaling: Scaling.scale(screen)
Rectangle { Rectangle {
color: Theme.backgroundPrimary color: Colors.backgroundPrimary
radius: Style.radiusMedium * scaling radius: Style.radiusMedium * scaling
border.color: Theme.backgroundTertiary border.color: Colors.backgroundTertiary
border.width: Math.max(1, 1.5 * scale) border.width: Math.max(1, 1.5 * scale)
width: 500 * scaling width: 500 * scaling
height: 300 height: 300
@ -42,7 +42,7 @@ NPanel {
spacing: 16 * scaling spacing: 16 * scaling
Text { Text {
text: "NIconButton" text: "NIconButton"
color: Theme.textPrimary color: Colors.textPrimary
} }
NIconButton { NIconButton {
@ -64,7 +64,7 @@ NPanel {
uniformCellSizes: true uniformCellSizes: true
Text { Text {
text: "NToggle + NTooltip" text: "NToggle + NTooltip"
color: Theme.textPrimary color: Colors.textPrimary
} }
NToggle { NToggle {
@ -88,7 +88,7 @@ NPanel {
spacing: 16 * scaling spacing: 16 * scaling
Text { Text {
text: "NSlider" text: "NSlider"
color: Theme.textPrimary color: Colors.textPrimary
} }
NSlider {} NSlider {}

5
Services/Theme.qml → Services/Colors.qml
View file

@ -43,9 +43,6 @@ Singleton {
property color shadow: applyOpacity(themeData.shadow, "B3") property color shadow: applyOpacity(themeData.shadow, "B3")
property color overlay: applyOpacity(themeData.overlay, "66") property color overlay: applyOpacity(themeData.overlay, "66")
// Font Properties
property string fontFamily: "Roboto" // Family for all text
function applyOpacity(color, opacity) { function applyOpacity(color, opacity) {
return color.replace("#", "#" + opacity) return color.replace("#", "#" + opacity)
} }
@ -53,7 +50,7 @@ Singleton {
// FileView to load theme data from JSON file // FileView to load theme data from JSON file
FileView { FileView {
id: themeFile id: themeFile
path: Settings.themeFile path: Settings.colorsFile
watchChanges: true watchChanges: true
onFileChanged: reload() onFileChanged: reload()
onAdapterUpdated: writeAdapter() onAdapterUpdated: writeAdapter()

8
Services/Settings.qml
View file

@ -14,8 +14,8 @@ Singleton {
"HOME") + "/.config") + "/" + shellName + "/" "HOME") + "/.config") + "/" + shellName + "/"
property string settingsFile: Quickshell.env("NOCTALIA_SETTINGS_FILE") property string settingsFile: Quickshell.env("NOCTALIA_SETTINGS_FILE")
|| (settingsDir + "Settings.json") || (settingsDir + "Settings.json")
property string themeFile: Quickshell.env("NOCTALIA_THEME_FILE") property string colorsFile: Quickshell.env("NOCTALIA_COLORS_FILE")
|| (settingsDir + "Theme.json") || (settingsDir + "Colors.json")
property var settings: settingAdapter property var settings: settingAdapter
Item { Item {
@ -91,7 +91,9 @@ Singleton {
property var notificationMonitors: [] // Array of monitor names to show notifications on, "*" means all monitors property var notificationMonitors: [] // Array of monitor names to show notifications on, "*" means all monitors
property var monitorScaleOverrides: { property var monitorScaleOverrides: {
} // Map of monitor name -> scale override (e.g., 0.8..2.0). When set, Theme.scale() returns this value } // Map of monitor name -> scale override (e.g., 0.8..2.0). When set, Colors.scale() returns this value
property string fontFamily: "Roboto" // Family for all text
} }
} }

22
Widgets/NCalendar.qml
View file

@ -13,9 +13,9 @@ NPanel {
readonly property real scaling: Scaling.scale(screen) readonly property real scaling: Scaling.scale(screen)
Rectangle { Rectangle {
color: Theme.backgroundPrimary color: Colors.backgroundPrimary
radius: Style.radiusMedium * scaling radius: Style.radiusMedium * scaling
border.color: Theme.backgroundTertiary border.color: Colors.backgroundTertiary
border.width: Math.max(1, 1.5 * scale) border.width: Math.max(1, 1.5 * scale)
width: 340 * scaling width: 340 * scaling
height: 380 height: 380
@ -52,10 +52,10 @@ NPanel {
Layout.fillWidth: true Layout.fillWidth: true
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: calendar.title text: calendar.title
color: Theme.textPrimary color: Colors.textPrimary
opacity: 0.7 opacity: 0.7
font.pointSize: Style.fontSmall * scaling font.pointSize: Style.fontSmall * scaling
font.family: Theme.fontFamily font.family: Settings.settings.fontFamily
font.bold: true font.bold: true
} }
@ -77,10 +77,10 @@ NPanel {
delegate: Text { delegate: Text {
text: shortName text: shortName
color: Theme.textPrimary color: Colors.textPrimary
opacity: 0.8 opacity: 0.8
font.pointSize: Style.fontSmall * scaling font.pointSize: Style.fontSmall * scaling
font.family: Theme.fontFamily font.family: Settings.settings.fontFamily
font.bold: true font.bold: true
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
width: 32 width: 32
@ -136,10 +136,10 @@ NPanel {
radius: 8 radius: 8
color: { color: {
if (model.today) if (model.today)
return Theme.accentPrimary return Colors.accentPrimary
if (mouseArea2.containsMouse) if (mouseArea2.containsMouse)
return Theme.backgroundTertiary return Colors.backgroundTertiary
return "transparent" return "transparent"
} }
@ -150,7 +150,7 @@ NPanel {
width: 4 width: 4
height: 4 height: 4
radius: 4 radius: 4
color: Theme.accentTertiary color: Colors.accentTertiary
anchors.top: parent.top anchors.top: parent.top
anchors.right: parent.right anchors.right: parent.right
anchors.topMargin: 4 anchors.topMargin: 4
@ -161,10 +161,10 @@ NPanel {
Text { Text {
anchors.centerIn: parent anchors.centerIn: parent
text: model.day text: model.day
color: model.today ? Theme.onAccent : Theme.textPrimary color: model.today ? Colors.onAccent : Colors.textPrimary
opacity: model.month === calendar.month ? (mouseArea2.containsMouse ? 1 : 0.7) : 0.3 opacity: model.month === calendar.month ? (mouseArea2.containsMouse ? 1 : 0.7) : 0.3
font.pointSize: Style.fontSmall * scaling font.pointSize: Style.fontSmall * scaling
font.family: Theme.fontFamily font.family: Settings.settings.fontFamily
font.bold: model.today ? true : false font.bold: model.today ? true : false
} }

4
Widgets/NIconButton.qml
View file

@ -19,7 +19,7 @@ Rectangle {
implicitHeight: size implicitHeight: size
radius: width * 0.5 radius: width * 0.5
color: root.hovering ? Theme.accentPrimary : "transparent" color: root.hovering ? Colors.accentPrimary : "transparent"
Text { Text {
id: iconText id: iconText
@ -27,7 +27,7 @@ Rectangle {
text: root.icon text: root.icon
font.family: "Material Symbols Outlined" font.family: "Material Symbols Outlined"
font.pointSize: Style.fontExtraLarge * scaling font.pointSize: Style.fontExtraLarge * scaling
color: root.hovering ? Theme.onAccent : Theme.textPrimary color: root.hovering ? Colors.onAccent : Colors.textPrimary
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
opacity: root.enabled ? 1.0 : 0.5 opacity: root.enabled ? 1.0 : 0.5

2
Widgets/NPanel.qml
View file

@ -9,7 +9,7 @@ PanelWindow {
readonly property real scaling: Scaling.scale(screen) readonly property real scaling: Scaling.scale(screen)
property bool showOverlay: Settings.settings.dimPanels property bool showOverlay: Settings.settings.dimPanels
property int topMargin: Style.barHeight * scaling property int topMargin: Style.barHeight * scaling
property color overlayColor: showOverlay ? Theme.overlay : "transparent" property color overlayColor: showOverlay ? Colors.overlay : "transparent"
function hide() { function hide() {
visible = false visible = false

14
Widgets/NSlider.qml
View file

@ -27,13 +27,13 @@ Slider {
width: root.availableWidth width: root.availableWidth
height: implicitHeight height: implicitHeight
radius: height / 2 radius: height / 2
color: Theme.surfaceVariant color: Colors.surfaceVariant
Rectangle { Rectangle {
id: activeTrack id: activeTrack
width: root.visualPosition * parent.width width: root.visualPosition * parent.width
height: parent.height height: parent.height
color: Theme.accentPrimary color: Colors.accentPrimary
radius: parent.radius radius: parent.radius
// Feels more responsive without animation // Feels more responsive without animation
@ -51,7 +51,7 @@ Slider {
width: knobDiameter + cutoutExtra width: knobDiameter + cutoutExtra
height: knobDiameter + cutoutExtra height: knobDiameter + cutoutExtra
radius: width / 2 radius: width / 2
color: root.cutoutColor !== undefined ? root.cutoutColor : Theme.backgroundPrimary color: root.cutoutColor !== undefined ? root.cutoutColor : Colors.backgroundPrimary
x: Math.max( x: Math.max(
0, Math.min( 0, Math.min(
parent.width - width, parent.width - width,
@ -71,7 +71,7 @@ Slider {
anchors.fill: knob anchors.fill: knob
source: knob source: knob
shadowEnabled: true shadowEnabled: true
shadowColor: Theme.shadow shadowColor: Colors.shadow
shadowOpacity: 0.25 shadowOpacity: 0.25
shadowHorizontalOffset: 0 shadowHorizontalOffset: 0
shadowVerticalOffset: 1 shadowVerticalOffset: 1
@ -83,8 +83,8 @@ Slider {
implicitWidth: knobDiameter implicitWidth: knobDiameter
implicitHeight: knobDiameter implicitHeight: knobDiameter
radius: width * 0.5 radius: width * 0.5
color: root.pressed ? Theme.surfaceVariant : Theme.surface color: root.pressed ? Colors.surfaceVariant : Colors.surface
border.color: Theme.accentPrimary border.color: Colors.accentPrimary
border.width: Math.max(1, 2 * scaling) border.width: Math.max(1, 2 * scaling)
// Press feedback halo (using accent color, low opacity) // Press feedback halo (using accent color, low opacity)
Rectangle { Rectangle {
@ -92,7 +92,7 @@ Slider {
width: parent.width + 8 * scaling width: parent.width + 8 * scaling
height: parent.height + 8 * scaling height: parent.height + 8 * scaling
radius: width / 2 radius: width / 2
color: Theme.accentPrimary color: Colors.accentPrimary
opacity: root.pressed ? 0.16 : 0.0 opacity: root.pressed ? 0.16 : 0.0
} }
} }

12
Widgets/NToggle.qml
View file

@ -23,13 +23,13 @@ RowLayout {
text: label text: label
font.pointSize: Style.fontMedium * scaling font.pointSize: Style.fontMedium * scaling
font.bold: true font.bold: true
color: Theme.textPrimary color: Colors.textPrimary
} }
Text { Text {
text: description text: description
font.pointSize: Style.fontSmall * scaling font.pointSize: Style.fontSmall * scaling
color: Theme.textSecondary color: Colors.textSecondary
wrapMode: Text.WordWrap wrapMode: Text.WordWrap
Layout.fillWidth: true Layout.fillWidth: true
} }
@ -41,16 +41,16 @@ RowLayout {
width: Style.baseWidgetHeight * 1.625 * scaling width: Style.baseWidgetHeight * 1.625 * scaling
height: Style.baseWidgetHeight * scaling height: Style.baseWidgetHeight * scaling
radius: height * 0.5 radius: height * 0.5
color: value ? Theme.accentPrimary :Theme.surfaceVariant color: value ? Colors.accentPrimary :Colors.surfaceVariant
border.color: value ? Theme.accentPrimary : Theme.outline border.color: value ? Colors.accentPrimary : Colors.outline
border.width: Math.max(1, 1.5 * scale) border.width: Math.max(1, 1.5 * scale)
Rectangle { Rectangle {
width: (Style.baseWidgetHeight- 4) * scaling width: (Style.baseWidgetHeight- 4) * scaling
height: (Style.baseWidgetHeight - 4) * scaling height: (Style.baseWidgetHeight - 4) * scaling
radius: height * 0.5 radius: height * 0.5
color: Theme.surface color: Colors.surface
border.color: hovering ? Theme.textDisabled : Theme.outline border.color: hovering ? Colors.textDisabled : Colors.outline
border.width: Math.max(1, 1.5 * scale) border.width: Math.max(1, 1.5 * scale)
y: 2 * scaling y: 2 * scaling
x: value ? switcher.width - width - 2 * scale : 2 * scaling x: value ? switcher.width - width - 2 * scale : 2 * scaling

8
Widgets/NTooltip.qml
View file

@ -99,8 +99,8 @@ Window {
Rectangle { Rectangle {
anchors.fill: parent anchors.fill: parent
radius: Style.radiusMedium * scaling radius: Style.radiusMedium * scaling
color: Theme.backgroundTertiary color: Colors.backgroundTertiary
border.color: Theme.outline border.color: Colors.outline
border.width: 1 * scaling border.width: 1 * scaling
opacity: 0.97 opacity: 0.97
z: 1 z: 1
@ -110,8 +110,8 @@ Window {
id: tooltipText id: tooltipText
anchors.centerIn: parent anchors.centerIn: parent
text: root.text text: root.text
color: Theme.textPrimary color: Colors.textPrimary
font.family: Theme.fontFamily font.family: Settings.settings.fontFamily
font.pointSize: Style.fontMedium * scaling font.pointSize: Style.fontMedium * scaling
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter