Edit Workspace colors, make settings panels more uniform, update README.md

This commit is contained in:
Ly-sec 2025-07-31 15:51:32 +02:00
parent 9632abc542
commit e85fafcd80
5 changed files with 587 additions and 626 deletions

View file

@ -170,15 +170,12 @@ Item {
return Theme.accentPrimary; return Theme.accentPrimary;
if (model.isUrgent) if (model.isUrgent)
return Theme.error; return Theme.error;
if (model.isActive) if (model.isActive || model.isOccupied)
return Theme.accentSecondary; return Theme.accentTertiary;
if (model.isOccupied)
return Qt.darker(Theme.accentSecondary, 1.5);
if (model.isUrgent) if (model.isUrgent)
return Theme.error; return Theme.error;
return Theme.surfaceVariant.lighter(1.5); return Theme.outline;
} }
scale: model.isFocused ? 1.0 : 0.9 scale: model.isFocused ? 1.0 : 0.9
z: 0 z: 0

View file

@ -208,6 +208,14 @@ Contributions are welcome! Feel free to open issues or submit pull requests.
--- ---
#### Donation
---
While I actually didn't want to accept donations, more and more people are asking to donate so... I don't know, if you really feel like donating then I obviously highly appreciate it but **PLEASE** never feel forced to donate or anything. It won't change how I work on Noctalia, it's a project that I work on for fun in the end.
[![ko-fi](https://ko-fi.com/img/githubbutton_sm.svg)](https://ko-fi.com/R6R01IX85B)
---
## License ## License
This project is licensed under the terms of the [MIT License](./LICENSE). This project is licensed under the terms of the [MIT License](./LICENSE).

View file

@ -10,62 +10,24 @@ Rectangle {
Layout.preferredHeight: 580 Layout.preferredHeight: 580
color: Theme.surface color: Theme.surface
radius: 18 radius: 18
border.color: "transparent"
border.width: 0
Layout.bottomMargin: 16
ScrollView {
id: scrollView
anchors.fill: parent
clip: true
padding: 12
ScrollBar.vertical: ScrollBar {
id: scrollBar
policy: ScrollBar.AsNeeded
visible: size < 1.0
opacity: (active || hovered) && size < 1.0 ? 1 : 0
width: 8
padding: 0
background: Rectangle {
color: "transparent"
}
contentItem: Rectangle {
implicitWidth: 6
radius: 3
color: scrollBar.hovered ? Theme.accentPrimary : Qt.darker(Theme.surfaceVariant, 1.2)
Behavior on opacity {
OpacityAnimator { duration: 200 }
}
}
Behavior on opacity {
OpacityAnimator { duration: 300 }
}
}
ColumnLayout { ColumnLayout {
id: mainLayout anchors.fill: parent
width: scrollView.availableWidth - (scrollBar.visible ? scrollBar.width + 4 : 0)
spacing: 12
anchors.margins: 18 anchors.margins: 18
spacing: 12
// Header
RowLayout { RowLayout {
Layout.fillWidth: true Layout.fillWidth: true
spacing: 12 spacing: 12
Text { Text {
text: "settings" text: "settings"
font.family: "Material Symbols Outlined" font.family: "Material Symbols Outlined"
font.pixelSize: 20 font.pixelSize: 20
color: Theme.accentPrimary color: Theme.accentPrimary
} }
Text { Text {
text: "System Settings" text: "Profile Settings"
font.family: Theme.fontFamily font.family: Theme.fontFamily
font.pixelSize: 16 font.pixelSize: 16
font.bold: true font.bold: true
@ -111,6 +73,7 @@ Rectangle {
sourceSize.width: 64 sourceSize.width: 64
sourceSize.height: 64 sourceSize.height: 64
} }
OpacityMask { OpacityMask {
anchors.fill: avatarImage anchors.fill: avatarImage
source: avatarImage source: avatarImage
@ -136,7 +99,7 @@ Rectangle {
Rectangle { Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 40 Layout.preferredHeight: 40
radius: 8 radius: 16
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: profileImageInput.activeFocus ? Theme.accentPrimary : Theme.outline border.color: profileImageInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1 border.width: 1
@ -154,19 +117,16 @@ Rectangle {
color: Theme.textPrimary color: Theme.textPrimary
verticalAlignment: TextInput.AlignVCenter verticalAlignment: TextInput.AlignVCenter
clip: true clip: true
focus: true
selectByMouse: true selectByMouse: true
activeFocusOnTab: true activeFocusOnTab: true
inputMethodHints: Qt.ImhNone inputMethodHints: Qt.ImhUrlCharactersOnly
onTextChanged: { onTextChanged: {
Settings.settings.profileImage = text Settings.settings.profileImage = text
} }
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
cursorShape: Qt.IBeamCursor cursorShape: Qt.IBeamCursor
onClicked: { onClicked: profileImageInput.forceActiveFocus()
profileImageInput.forceActiveFocus()
}
} }
} }
} }
@ -181,7 +141,6 @@ Rectangle {
Text { Text {
text: "Show Active Window Icon" text: "Show Active Window Icon"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
@ -192,7 +151,7 @@ Rectangle {
} }
Rectangle { Rectangle {
id: customSwitch id: activeWindowIconSwitch
width: 52 width: 52
height: 32 height: 32
radius: 16 radius: 16
@ -201,7 +160,7 @@ Rectangle {
border.width: 2 border.width: 2
Rectangle { Rectangle {
id: thumb id: activeWindowIconThumb
width: 28 width: 28
height: 28 height: 28
radius: 14 radius: 14
@ -209,10 +168,13 @@ Rectangle {
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
y: 2 y: 2
x: Settings.settings.showActiveWindowIcon ? customSwitch.width - width - 2 : 2 x: Settings.settings.showActiveWindowIcon ? activeWindowIconSwitch.width - width - 2 : 2
Behavior on x { Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic } NumberAnimation {
duration: 200
easing.type: Easing.OutCubic
}
} }
} }
@ -234,11 +196,9 @@ Rectangle {
Text { Text {
text: "Show System Info In Bar" text: "Show System Info In Bar"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
} }
Item { Item {
@ -246,7 +206,7 @@ Rectangle {
} }
Rectangle { Rectangle {
id: customSwitch2 id: systemInfoSwitch
width: 52 width: 52
height: 32 height: 32
radius: 16 radius: 16
@ -255,7 +215,7 @@ Rectangle {
border.width: 2 border.width: 2
Rectangle { Rectangle {
id: thumb2 id: systemInfoThumb
width: 28 width: 28
height: 28 height: 28
radius: 14 radius: 14
@ -263,10 +223,13 @@ Rectangle {
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
y: 2 y: 2
x: Settings.settings.showSystemInfoInBar ? customSwitch2.width - width - 2 : 2 x: Settings.settings.showSystemInfoInBar ? systemInfoSwitch.width - width - 2 : 2
Behavior on x { Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic } NumberAnimation {
duration: 200
easing.type: Easing.OutCubic
}
} }
} }
@ -280,7 +243,7 @@ Rectangle {
} }
} }
// Show Corners In Bar Setting // Show Corners Setting
RowLayout { RowLayout {
spacing: 8 spacing: 8
Layout.fillWidth: true Layout.fillWidth: true
@ -288,11 +251,9 @@ Rectangle {
Text { Text {
text: "Show Corners" text: "Show Corners"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
} }
Item { Item {
@ -300,7 +261,7 @@ Rectangle {
} }
Rectangle { Rectangle {
id: customSwitch4 id: cornersSwitch
width: 52 width: 52
height: 32 height: 32
radius: 16 radius: 16
@ -309,7 +270,7 @@ Rectangle {
border.width: 2 border.width: 2
Rectangle { Rectangle {
id: thumb4 id: cornersThumb
width: 28 width: 28
height: 28 height: 28
radius: 14 radius: 14
@ -317,10 +278,13 @@ Rectangle {
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
y: 2 y: 2
x: Settings.settings.showCorners ? customSwitch4.width - width - 2 : 2 x: Settings.settings.showCorners ? cornersSwitch.width - width - 2 : 2
Behavior on x { Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic } NumberAnimation {
duration: 200
easing.type: Easing.OutCubic
}
} }
} }
@ -334,7 +298,7 @@ Rectangle {
} }
} }
// Show Taskbar in Bar Setting // Show Taskbar Setting
RowLayout { RowLayout {
spacing: 8 spacing: 8
Layout.fillWidth: true Layout.fillWidth: true
@ -342,11 +306,9 @@ Rectangle {
Text { Text {
text: "Show Taskbar" text: "Show Taskbar"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
} }
Item { Item {
@ -354,7 +316,7 @@ Rectangle {
} }
Rectangle { Rectangle {
id: customSwitch5 id: taskbarSwitch
width: 52 width: 52
height: 32 height: 32
radius: 16 radius: 16
@ -363,7 +325,7 @@ Rectangle {
border.width: 2 border.width: 2
Rectangle { Rectangle {
id: thumb5 id: taskbarThumb
width: 28 width: 28
height: 28 height: 28
radius: 14 radius: 14
@ -371,10 +333,13 @@ Rectangle {
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
y: 2 y: 2
x: Settings.settings.showTaskbar ? customSwitch5.width - width - 2 : 2 x: Settings.settings.showTaskbar ? taskbarSwitch.width - width - 2 : 2
Behavior on x { Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic } NumberAnimation {
duration: 200
easing.type: Easing.OutCubic
}
} }
} }
@ -396,11 +361,9 @@ Rectangle {
Text { Text {
text: "Show Media In Bar" text: "Show Media In Bar"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
Layout.alignment: Qt.AlignVCenter
} }
Item { Item {
@ -408,7 +371,7 @@ Rectangle {
} }
Rectangle { Rectangle {
id: customSwitch3 id: mediaSwitch
width: 52 width: 52
height: 32 height: 32
radius: 16 radius: 16
@ -417,7 +380,7 @@ Rectangle {
border.width: 2 border.width: 2
Rectangle { Rectangle {
id: thumb3 id: mediaThumb
width: 28 width: 28
height: 28 height: 28
radius: 14 radius: 14
@ -425,10 +388,13 @@ Rectangle {
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
y: 2 y: 2
x: Settings.settings.showMediaInBar ? customSwitch3.width - width - 2 : 2 x: Settings.settings.showMediaInBar ? mediaSwitch.width - width - 2 : 2
Behavior on x { Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic } NumberAnimation {
duration: 200
easing.type: Easing.OutCubic
}
} }
} }
@ -450,7 +416,6 @@ Rectangle {
Text { Text {
text: "Dim Desktop" text: "Dim Desktop"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
@ -461,7 +426,7 @@ Rectangle {
} }
Rectangle { Rectangle {
id: dimWindowsSwitch id: dimSwitch
width: 52 width: 52
height: 32 height: 32
radius: 16 radius: 16
@ -470,7 +435,7 @@ Rectangle {
border.width: 2 border.width: 2
Rectangle { Rectangle {
id: dimWindowsThumb id: dimThumb
width: 28 width: 28
height: 28 height: 28
radius: 14 radius: 14
@ -478,10 +443,13 @@ Rectangle {
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
y: 2 y: 2
x: Settings.settings.dimPanels ? dimWindowsSwitch.width - width - 2 : 2 x: Settings.settings.dimPanels ? dimSwitch.width - width - 2 : 2
Behavior on x { Behavior on x {
NumberAnimation { duration: 200; easing.type: Easing.OutCubic } NumberAnimation {
duration: 200
easing.type: Easing.OutCubic
}
} }
} }
@ -503,7 +471,6 @@ Rectangle {
Text { Text {
text: "Visualizer Type" text: "Visualizer Type"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
@ -522,7 +489,7 @@ Rectangle {
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: visualizerTypeComboBox.activeFocus ? Theme.accentPrimary : Theme.outline border.color: visualizerTypeComboBox.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1 border.width: 1
radius: 8 radius: 16
} }
contentItem: Text { contentItem: Text {
@ -564,7 +531,7 @@ Rectangle {
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
radius: 8 radius: 16
} }
} }
@ -595,11 +562,10 @@ Rectangle {
ColumnLayout { ColumnLayout {
spacing: 8 spacing: 8
Layout.fillWidth: true Layout.fillWidth: true
Layout.topMargin: 8 Layout.topMargin: 16
Text { Text {
text: "Video Path" text: "Video Path"
font.family: Theme.fontFamily
font.pixelSize: 13 font.pixelSize: 13
font.bold: true font.bold: true
color: Theme.textPrimary color: Theme.textPrimary
@ -608,17 +574,14 @@ Rectangle {
Rectangle { Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 40 Layout.preferredHeight: 40
radius: 8 radius: 16
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: videoPathInput.activeFocus ? Theme.accentPrimary : Theme.outline border.color: videoPathInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1 border.width: 1
TextInput { TextInput {
id: videoPathInput id: videoPathInput
anchors.left: parent.left anchors.fill: parent
anchors.right: parent.right
anchors.top: parent.top
anchors.bottom: parent.bottom
anchors.leftMargin: 12 anchors.leftMargin: 12
anchors.rightMargin: 12 anchors.rightMargin: 12
anchors.topMargin: 6 anchors.topMargin: 6
@ -643,12 +606,5 @@ Rectangle {
} }
} }
} }
// Add an extra spacer at the bottom to ensure all content is reachable
Item {
Layout.fillHeight: true
Layout.minimumHeight: 20
}
}
} }
} }

View file

@ -51,7 +51,7 @@ Rectangle {
Rectangle { Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 40 Layout.preferredHeight: 40
radius: 8 radius: 16
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: folderInput.activeFocus ? Theme.accentPrimary : Theme.outline border.color: folderInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1 border.width: 1
@ -350,7 +350,7 @@ Rectangle {
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: resizeComboBox.activeFocus ? Theme.accentPrimary : Theme.outline border.color: resizeComboBox.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1 border.width: 1
radius: 8 radius: 16
} }
contentItem: Text { contentItem: Text {
@ -392,7 +392,7 @@ Rectangle {
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
radius: 8 radius: 16
} }
} }
@ -445,7 +445,7 @@ Rectangle {
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: transitionTypeComboBox.activeFocus ? Theme.accentPrimary : Theme.outline border.color: transitionTypeComboBox.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1 border.width: 1
radius: 8 radius: 16
} }
contentItem: Text { contentItem: Text {
@ -487,7 +487,7 @@ Rectangle {
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: Theme.outline border.color: Theme.outline
border.width: 1 border.width: 1
radius: 8 radius: 16
} }
} }

View file

@ -52,7 +52,7 @@ Rectangle {
Rectangle { Rectangle {
Layout.fillWidth: true Layout.fillWidth: true
Layout.preferredHeight: 40 Layout.preferredHeight: 40
radius: 8 radius: 16
color: Theme.surfaceVariant color: Theme.surfaceVariant
border.color: cityInput.activeFocus ? Theme.accentPrimary : Theme.outline border.color: cityInput.activeFocus ? Theme.accentPrimary : Theme.outline
border.width: 1 border.width: 1