style overhaul

This commit is contained in:
lucy 2026-02-13 01:41:29 +01:00
parent 2dea213aa2
commit 173df32f9a
13 changed files with 22 additions and 122 deletions

View File

@ -15,7 +15,7 @@ Loader {
sourceComponent: Rectangle { sourceComponent: Rectangle {
id: container id: container
radius: implicitHeight / 2 radius: implicitHeight / 2
color: Colors.surfaceContainer color: Colors.base00
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
implicitWidth: UPower.displayDevice.isLaptopBattery ? root.implicitWidth + 20 : 0 implicitWidth: UPower.displayDevice.isLaptopBattery ? root.implicitWidth + 20 : 0
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10

View File

@ -8,7 +8,7 @@ import qs.reusables
Rectangle { Rectangle {
id: container id: container
radius: implicitHeight / 2 radius: implicitHeight / 2
color: formatSwitch.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer color: formatSwitch.containsMouse ? Colors.base01 : Colors.base00
anchors.verticalCenter: parent.verticalCenter anchors.verticalCenter: parent.verticalCenter
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
implicitWidth: root.implicitWidth + 20 implicitWidth: root.implicitWidth + 20

View File

@ -10,7 +10,7 @@ Rectangle {
visible: root.spotify != null visible: root.spotify != null
radius: implicitHeight / 2 radius: implicitHeight / 2
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
color: clickHandler.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer color: clickHandler.containsMouse ? Colors.base01 : Colors.base00
implicitWidth: statusRow.width + 20 implicitWidth: statusRow.width + 20
property var spotify: root.getSpotify() property var spotify: root.getSpotify()

View File

@ -12,7 +12,7 @@ Rectangle {
// You might want to make this transparent if you only want the "pills" to show // You might want to make this transparent if you only want the "pills" to show
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
implicitWidth: mainLayout.implicitWidth + 20 implicitWidth: mainLayout.implicitWidth + 20
color: Colors.surfaceContainer color: Colors.base00
radius: implicitHeight / 2 radius: implicitHeight / 2
// --- Logic Functions --- // --- Logic Functions ---

View File

@ -7,7 +7,7 @@ import qs
Rectangle { Rectangle {
id: root id: root
radius: implicitHeight / 2 radius: implicitHeight / 2
color: pavuArea.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer color: pavuArea.containsMouse ? Colors.base01 : Colors.base00
implicitWidth: Settings.config.barHeight - 8 implicitWidth: Settings.config.barHeight - 8
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
CustomIcon { CustomIcon {

View File

@ -8,7 +8,7 @@ Rectangle {
implicitWidth: trayRow.implicitWidth + 10 implicitWidth: trayRow.implicitWidth + 10
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
radius: implicitHeight / 2 radius: implicitHeight / 2
color: Colors.surfaceContainer color: Colors.base00
readonly property var count: trayRepeater.count readonly property var count: trayRepeater.count
visible: trayRepeater.count > 0 visible: trayRepeater.count > 0

View File

@ -10,7 +10,7 @@ import QtQuick.Layouts
Rectangle { Rectangle {
id: container id: container
radius: implicitHeight / 2 radius: implicitHeight / 2
color: Colors.surfaceContainer color: Colors.base00
implicitWidth: root.implicitWidth implicitWidth: root.implicitWidth
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
Item { Item {

View File

@ -9,7 +9,7 @@ import qs
Rectangle { Rectangle {
id: root id: root
radius: implicitHeight / 2 radius: implicitHeight / 2
color: pavuArea.containsMouse ? Colors.primaryContainer : Colors.surfaceContainer color: pavuArea.containsMouse ? Colors.base01 : Colors.base00
implicitWidth: textRow.implicitWidth + 20 implicitWidth: textRow.implicitWidth + 20
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
property var sink: Pipewire.defaultAudioSink property var sink: Pipewire.defaultAudioSink

View File

@ -8,7 +8,7 @@ import qs.reusables
Rectangle { Rectangle {
id: root id: root
color: Colors.surfaceContainer color: Colors.base00
implicitWidth: workspaceRow.implicitWidth + 10 implicitWidth: workspaceRow.implicitWidth + 10
implicitHeight: Settings.config.barHeight - 10 implicitHeight: Settings.config.barHeight - 10
@ -40,7 +40,7 @@ Rectangle {
required property var modelData required property var modelData
width: !modelData.focused ? 20 : 40 width: !modelData.focused ? 20 : 40
height: isOnMon ? Settings.config.barHeight - Settings.config.barHeight / 2 : 0 height: isOnMon ? Settings.config.barHeight - Settings.config.barHeight / 2 : 0
color: modelData.focused ? Colors.primary : Colors.surfaceContainer color: modelData.focused ? Colors.base01 : Colors.base00
Behavior on width { Behavior on width {
NumberAnimation { NumberAnimation {
@ -54,8 +54,6 @@ Rectangle {
verticalAlignment: Text.AlignVCenter verticalAlignment: Text.AlignVCenter
horizontalAlignment: Text.AlignHCenter horizontalAlignment: Text.AlignHCenter
text: parent.modelData.id text: parent.modelData.id
color: parent.modelData.focused ? Colors.onPrimaryColor : Colors.onSurfaceColor
opacity: workspaceNumber.modelData.focused ? 1 : 0.5
} }
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent

View File

@ -1,98 +0,0 @@
pragma ComponentBehavior: Bound
import QtQuick
import QtQuick.Layouts
import Quickshell
import QtQuick.Dialogs
import Quickshell.Widgets
import qs
import qs.settings
import qs.reusables
FloatingWindow {
id: root
visible: Settings.config.settingsShown
onClosed: {
Settings.config.settingsShown = false;
}
color: Colors.surface
title: "qs-settings"
implicitWidth: 800
implicitHeight: 600
ListModel {
id: pageModel
ListElement {
text: "welcomePage"
source: "WelcomePage.qml"
}
ListElement {
text: "Appearance"
source: "Appearance.qml"
}
ListElement {
text: "Matugen"
source: "Matugen.qml"
}
ListElement {
text: "test"
source: "WelcomePage.qml"
}
}
RowLayout {
id: windowLayout
clip: true
anchors.fill: parent
spacing: 10
ClippingWrapperRectangle {
id: pageWrapper
Layout.margins: 20
Layout.fillHeight: true
Layout.preferredWidth: 200
Layout.rightMargin: 0
margin: 20
color: Colors.surfaceContainerLow
radius: 12
ListView {
id: pageView
clip: true
model: pageModel
delegate: pageDelegate
Component {
id: pageDelegate
Rectangle {
radius: 24
color: ListView.isCurrentItem ? Colors.surfaceContainerHigh : "transparent"
implicitHeight: 30
implicitWidth: pageWrapper.width - 50
required property var modelData
required property int index
CustomText {
id: delegateText
leftPadding: 10
anchors.verticalCenter: parent.verticalCenter
text: parent.modelData.text
}
MouseArea {
id: clickHandler
anchors.fill: parent
cursorShape: Qt.PointingHandCursor
acceptedButtons: Qt.LeftButton
onClicked: {
contentLoader.source = parent.modelData.source;
pageView.currentIndex = parent.index;
}
}
}
}
}
}
Loader {
id: contentLoader
Layout.leftMargin: 0
Layout.fillHeight: true
Layout.fillWidth: true
Layout.margins: 20
source: pageModel.get(pageView.currentIndex).source
}
}
}

View File

@ -26,7 +26,7 @@ ClippingWrapperRectangle {
} }
anchors.centerIn: parent anchors.centerIn: parent
clip: true clip: true
color: Colors.surfaceContainerLow color: Colors.base01
radius: 12 radius: 12
margin: 20 margin: 20
@ -45,7 +45,7 @@ ClippingWrapperRectangle {
bottomRightRadius: 4 bottomRightRadius: 4
bottomLeftRadius: 4 bottomLeftRadius: 4
color: Colors.surfaceContainerHigh color: Colors.base01
implicitHeight: 30 implicitHeight: 30
child: RowLayout { child: RowLayout {
id: fontLayout id: fontLayout
@ -73,7 +73,7 @@ ClippingWrapperRectangle {
bottomRightRadius: 4 bottomRightRadius: 4
topRightRadius: 4 topRightRadius: 4
topLeftRadius: 4 topLeftRadius: 4
color: Colors.surfaceContainerHigh color: Colors.base01
child: RowLayout { child: RowLayout {
id: floatingToggleLayout id: floatingToggleLayout
spacing: 40 spacing: 40
@ -102,7 +102,7 @@ ClippingWrapperRectangle {
bottomRightRadius: 4 bottomRightRadius: 4
topRightRadius: 4 topRightRadius: 4
topLeftRadius: 4 topLeftRadius: 4
color: Colors.surfaceContainerHigh color: Colors.base01
child: RowLayout { child: RowLayout {
id: screenCornerLayout id: screenCornerLayout
spacing: 40 spacing: 40
@ -131,7 +131,7 @@ ClippingWrapperRectangle {
bottomRightRadius: 4 bottomRightRadius: 4
topRightRadius: 4 topRightRadius: 4
topLeftRadius: 4 topLeftRadius: 4
color: Colors.surfaceContainerHigh color: Colors.base01
child: RowLayout { child: RowLayout {
id: screenCornerRadiusLayout id: screenCornerRadiusLayout
spacing: 5 spacing: 5
@ -174,7 +174,7 @@ ClippingWrapperRectangle {
bottomRightRadius: 4 bottomRightRadius: 4
topRightRadius: 4 topRightRadius: 4
topLeftRadius: 4 topLeftRadius: 4
color: Colors.surfaceContainerHigh color: Colors.base01
child: RowLayout { child: RowLayout {
id: barControlsLayout id: barControlsLayout
spacing: 5 spacing: 5
@ -217,7 +217,7 @@ ClippingWrapperRectangle {
bottomRightRadius: 4 bottomRightRadius: 4
topRightRadius: 4 topRightRadius: 4
topLeftRadius: 4 topLeftRadius: 4
color: Colors.surfaceContainerHigh color: Colors.base01
child: RowLayout { child: RowLayout {
id: barMarginLayout id: barMarginLayout
spacing: 5 spacing: 5
@ -257,7 +257,7 @@ ClippingWrapperRectangle {
bottomRightRadius: 12 bottomRightRadius: 12
topRightRadius: 4 topRightRadius: 4
topLeftRadius: 4 topLeftRadius: 4
color: Colors.surfaceContainerHigh color: Colors.base01
Layout.fillWidth: true Layout.fillWidth: true
RowLayout { RowLayout {
id: translucencyLayout id: translucencyLayout

View File

@ -14,7 +14,7 @@ FloatingWindow {
onClosed: { onClosed: {
Settings.config.settingsShown = false; Settings.config.settingsShown = false;
} }
color: Colors.surface color: Colors.base00
title: "qs-settings" title: "qs-settings"
implicitWidth: 800 implicitWidth: 800
implicitHeight: 600 implicitHeight: 600
@ -50,7 +50,7 @@ FloatingWindow {
Layout.preferredWidth: 200 Layout.preferredWidth: 200
Layout.rightMargin: 0 Layout.rightMargin: 0
margin: 20 margin: 20
color: Colors.surfaceContainerLow color: Colors.base00
radius: 12 radius: 12
ListView { ListView {
id: pageView id: pageView
@ -61,7 +61,7 @@ FloatingWindow {
id: pageDelegate id: pageDelegate
Rectangle { Rectangle {
radius: 24 radius: 24
color: ListView.isCurrentItem ? Colors.surfaceContainerHigh : "transparent" color: ListView.isCurrentItem ? Colors.base01 : "transparent"
implicitHeight: 30 implicitHeight: 30
implicitWidth: pageWrapper.width - 50 implicitWidth: pageWrapper.width - 50
required property var modelData required property var modelData

View File

@ -3,7 +3,7 @@ import qs
import qs.settings import qs.settings
Text { Text {
color: Colors.onSurfaceColor color: Colors.base07
font.family: Settings.config.font font.family: Settings.config.font
font.pixelSize: Settings.config.fontSize font.pixelSize: Settings.config.fontSize
font.weight: Settings.config.fontWeight font.weight: Settings.config.fontWeight