Add font settings, replace some Text with NText

This commit is contained in:
Ly-sec 2025-08-20 13:35:49 +02:00
parent 784eb0e592
commit bb4510bbcd
6 changed files with 72 additions and 27 deletions

View file

@ -223,7 +223,12 @@ Singleton {
property JsonObject ui property JsonObject ui
ui: JsonObject { ui: JsonObject {
property string fontFamily: "Roboto" // Family for all text property string fontDefault: "Roboto" // Default font for all text
property string fontFixed: "DejaVu Sans Mono" // Fixed width font for terminal
property string fontBillboard: "Inter" // Large bold font for clocks and prominent displays
// Legacy compatibility
property string fontFamily: fontDefault // Keep for backward compatibility
} }
// Scaling (not stored inside JsonObject, or it crashes) // Scaling (not stored inside JsonObject, or it crashes)

View file

@ -369,7 +369,7 @@ NLoader {
visible: !parent.iconLoaded visible: !parent.iconLoaded
} }
Text { NText {
anchors.centerIn: parent anchors.centerIn: parent
visible: !parent.iconLoaded && !(modelData.isCalculator || modelData.isClipboard visible: !parent.iconLoaded && !(modelData.isCalculator || modelData.isClipboard
|| modelData.isCommand) || modelData.isCommand)

View file

@ -233,13 +233,13 @@ NLoader {
// Time display - Large and prominent with pulse animation // Time display - Large and prominent with pulse animation
Column { Column {
spacing: Style.marginS * scaling spacing: Style.marginXS * scaling
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Text { NText {
id: timeText id: timeText
text: Qt.formatDateTime(new Date(), "HH:mm") text: Qt.formatDateTime(new Date(), "HH:mm")
font.family: "Inter" font.family: Settings.data.ui.fontBillboard
font.pointSize: Style.fontSizeXXXL * 6 * scaling font.pointSize: Style.fontSizeXXXL * 6 * scaling
font.weight: Font.Bold font.weight: Font.Bold
font.letterSpacing: -2 * scaling font.letterSpacing: -2 * scaling
@ -261,10 +261,10 @@ NLoader {
} }
} }
Text { NText {
id: dateText id: dateText
text: Qt.formatDateTime(new Date(), "dddd, MMMM d") text: Qt.formatDateTime(new Date(), "dddd, MMMM d")
font.family: "Inter" font.family: Settings.data.ui.fontBillboard
font.pointSize: Style.fontSizeXXL * scaling font.pointSize: Style.fontSizeXXL * scaling
font.weight: Font.Light font.weight: Font.Light
color: Color.mOnSurface color: Color.mOnSurface
@ -404,10 +404,10 @@ NLoader {
anchors.margins: Style.marginM * scaling anchors.margins: Style.marginM * scaling
spacing: Style.marginM * scaling spacing: Style.marginM * scaling
Text { NText {
text: "SECURE TERMINAL" text: "SECURE TERMINAL"
color: Color.mOnSurface color: Color.mOnSurface
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeL * scaling font.pointSize: Style.fontSizeL * scaling
font.weight: Font.Bold font.weight: Font.Bold
Layout.fillWidth: true Layout.fillWidth: true
@ -424,10 +424,10 @@ NLoader {
color: batteryIndicator.charging ? Color.mPrimary : Color.mOnSurface color: batteryIndicator.charging ? Color.mPrimary : Color.mOnSurface
} }
Text { NText {
text: Math.round(batteryIndicator.percent) + "%" text: Math.round(batteryIndicator.percent) + "%"
color: Color.mOnSurface color: Color.mOnSurface
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeM * scaling font.pointSize: Style.fontSizeM * scaling
font.weight: Font.Bold font.weight: Font.Bold
} }
@ -450,19 +450,19 @@ NLoader {
Layout.fillWidth: true Layout.fillWidth: true
spacing: Style.marginM * scaling spacing: Style.marginM * scaling
Text { NText {
text: "root@noctalia:~$" text: "root@noctalia:~$"
color: Color.mPrimary color: Color.mPrimary
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeL * scaling font.pointSize: Style.fontSizeL * scaling
font.weight: Font.Bold font.weight: Font.Bold
} }
Text { NText {
id: welcomeText id: welcomeText
text: "" text: ""
color: Color.mOnSurface color: Color.mOnSurface
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeL * scaling font.pointSize: Style.fontSizeL * scaling
property int currentIndex: 0 property int currentIndex: 0
property string fullText: "Welcome back, " + Quickshell.env("USER") + "!" property string fullText: "Welcome back, " + Quickshell.env("USER") + "!"
@ -488,18 +488,18 @@ NLoader {
Layout.fillWidth: true Layout.fillWidth: true
spacing: Style.marginM * scaling spacing: Style.marginM * scaling
Text { NText {
text: "root@noctalia:~$" text: "root@noctalia:~$"
color: Color.mPrimary color: Color.mPrimary
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeL * scaling font.pointSize: Style.fontSizeL * scaling
font.weight: Font.Bold font.weight: Font.Bold
} }
Text { NText {
text: "sudo unlock-session" text: "sudo unlock-session"
color: Color.mOnSurface color: Color.mOnSurface
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeL * scaling font.pointSize: Style.fontSizeL * scaling
} }
@ -509,7 +509,7 @@ NLoader {
width: 0 width: 0
height: 0 height: 0
visible: false visible: false
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeL * scaling font.pointSize: Style.fontSizeL * scaling
color: Color.mOnSurface color: Color.mOnSurface
echoMode: TextInput.Password echoMode: TextInput.Password
@ -535,11 +535,11 @@ NLoader {
} }
// Visual password display with integrated cursor // Visual password display with integrated cursor
Text { NText {
id: asterisksText id: asterisksText
text: "*".repeat(passwordInput.text.length) text: "*".repeat(passwordInput.text.length)
color: Color.mOnSurface color: Color.mOnSurface
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeL * scaling font.pointSize: Style.fontSizeL * scaling
visible: passwordInput.activeFocus visible: passwordInput.activeFocus
@ -585,7 +585,7 @@ NLoader {
} }
// Status messages // Status messages
Text { NText {
text: lock.authenticating ? "Authenticating..." : (lock.errorMessage !== "" ? "Authentication failed." : "") text: lock.authenticating ? "Authenticating..." : (lock.errorMessage !== "" ? "Authentication failed." : "")
color: lock.authenticating ? Color.mPrimary : (lock.errorMessage !== "" ? Color.mError : Color.transparent) color: lock.authenticating ? Color.mPrimary : (lock.errorMessage !== "" ? Color.mError : Color.transparent)
font.family: "DejaVu Sans Mono" font.family: "DejaVu Sans Mono"
@ -618,11 +618,11 @@ NLoader {
Layout.alignment: Qt.AlignRight Layout.alignment: Qt.AlignRight
Layout.bottomMargin: -12 * scaling Layout.bottomMargin: -12 * scaling
Text { NText {
anchors.centerIn: parent anchors.centerIn: parent
text: lock.authenticating ? "EXECUTING" : "EXECUTE" text: lock.authenticating ? "EXECUTING" : "EXECUTE"
color: executeButtonArea.containsMouse ? Color.mOnPrimary : Color.mPrimary color: executeButtonArea.containsMouse ? Color.mOnPrimary : Color.mPrimary
font.family: "DejaVu Sans Mono" font.family: Settings.data.ui.fontFixed
font.pointSize: Style.fontSizeM * scaling font.pointSize: Style.fontSizeM * scaling
font.weight: Font.Bold font.weight: Font.Bold
} }

View file

@ -92,6 +92,45 @@ ColumnLayout {
Layout.bottomMargin: Style.marginS * scaling Layout.bottomMargin: Style.marginS * scaling
} }
// Font configuration section
ColumnLayout {
spacing: Style.marginS * scaling
Layout.fillWidth: true
NTextInput {
label: "Default Font"
description: "Main font used throughout the interface."
text: Settings.data.ui.fontDefault
placeholderText: "Roboto"
Layout.fillWidth: true
onEditingFinished: {
Settings.data.ui.fontDefault = text
}
}
NTextInput {
label: "Fixed Width Font"
description: "Monospace font used for terminal and code display."
text: Settings.data.ui.fontFixed
placeholderText: "DejaVu Sans Mono"
Layout.fillWidth: true
onEditingFinished: {
Settings.data.ui.fontFixed = text
}
}
NTextInput {
label: "Billboard Font"
description: "Large font used for clocks and prominent displays."
text: Settings.data.ui.fontBillboard
placeholderText: "Inter"
Layout.fillWidth: true
onEditingFinished: {
Settings.data.ui.fontBillboard = text
}
}
}
NToggle { NToggle {
label: "Show Corners" label: "Show Corners"
description: "Display rounded corners on the edge of the screen." description: "Display rounded corners on the edge of the screen."

View file

@ -1,6 +1,7 @@
import QtQuick import QtQuick
import qs.Commons import qs.Commons
import qs.Services import qs.Services
import qs.Widgets
// Compact circular statistic display used in the SidePanel // Compact circular statistic display used in the SidePanel
Rectangle { Rectangle {
@ -73,7 +74,7 @@ Rectangle {
} }
// Percent centered in the circle // Percent centered in the circle
Text { NText {
id: valueLabel id: valueLabel
anchors.centerIn: parent anchors.centerIn: parent
text: `${root.value}${root.suffix}` text: `${root.value}${root.suffix}`

View file

@ -6,7 +6,7 @@ import qs.Widgets
Text { Text {
id: root id: root
font.family: Settings.data.ui.fontFamily font.family: Settings.data.ui.fontDefault
font.pointSize: Style.fontSizeM * scaling font.pointSize: Style.fontSizeM * scaling
font.weight: Style.fontWeightMedium font.weight: Style.fontWeightMedium
color: Color.mOnSurface color: Color.mOnSurface