diff options
45 files changed, 169 insertions, 112 deletions
diff --git a/components/controls/CustomSpinBox.qml b/components/controls/CustomSpinBox.qml index 4611bed..e2ed508 100644 --- a/components/controls/CustomSpinBox.qml +++ b/components/controls/CustomSpinBox.qml @@ -30,7 +30,7 @@ RowLayout { background: StyledRect { implicitWidth: 100 radius: Appearance.rounding.small - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh } } diff --git a/components/controls/FilledSlider.qml b/components/controls/FilledSlider.qml index 8d0e547..af60e9f 100644 --- a/components/controls/FilledSlider.qml +++ b/components/controls/FilledSlider.qml @@ -14,7 +14,7 @@ Slider { orientation: Qt.Vertical background: StyledRect { - color: Colours.alpha(Colours.palette.m3surfaceContainer, true) + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.full StyledRect { @@ -24,7 +24,7 @@ Slider { y: root.handle.y implicitHeight: parent.height - y - color: Colours.alpha(Colours.palette.m3secondary, true) + color: Colours.palette.m3secondary radius: parent.radius } } @@ -49,7 +49,7 @@ Slider { anchors.fill: parent - color: Colours.alpha(Colours.palette.m3inverseSurface, true) + color: Colours.palette.m3inverseSurface radius: Appearance.rounding.full MouseArea { diff --git a/components/controls/StyledSlider.qml b/components/controls/StyledSlider.qml index 25b5bdd..0670e1c 100644 --- a/components/controls/StyledSlider.qml +++ b/components/controls/StyledSlider.qml @@ -32,7 +32,7 @@ Slider { implicitWidth: parent.width - root.handle.x - root.handle.implicitWidth - root.implicitHeight / 6 - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.full topLeftRadius: root.implicitHeight / 15 bottomLeftRadius: root.implicitHeight / 15 diff --git a/components/controls/StyledSwitch.qml b/components/controls/StyledSwitch.qml index c9d7330..e90ced2 100644 --- a/components/controls/StyledSwitch.qml +++ b/components/controls/StyledSwitch.qml @@ -8,12 +8,14 @@ import QtQuick.Shapes Switch { id: root + property int cLayer: 1 + implicitWidth: implicitIndicatorWidth implicitHeight: implicitIndicatorHeight indicator: StyledRect { radius: Appearance.rounding.full - color: root.checked ? Colours.palette.m3primary : Colours.palette.m3surfaceContainerHighest + color: root.checked ? Colours.palette.m3primary : Colours.layer(Colours.palette.m3surfaceContainerHighest, root.cLayer) implicitWidth: implicitHeight * 1.7 implicitHeight: Appearance.font.size.normal + Appearance.padding.smaller * 2 diff --git a/components/effects/InnerBorder.qml b/components/effects/InnerBorder.qml index e5092ca..d4a751f 100644 --- a/components/effects/InnerBorder.qml +++ b/components/effects/InnerBorder.qml @@ -15,7 +15,7 @@ StyledRect { property alias bottomThickness: maskInner.anchors.bottomMargin anchors.fill: parent - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer layer.enabled: true layer.effect: MultiEffect { diff --git a/components/filedialog/CurrentItem.qml b/components/filedialog/CurrentItem.qml index e042445..9f8ffac 100644 --- a/components/filedialog/CurrentItem.qml +++ b/components/filedialog/CurrentItem.qml @@ -23,7 +23,7 @@ Item { readonly property real roundingY: flatten ? root.implicitHeight / 2 : rounding strokeWidth: -1 - fillColor: Colours.palette.m3surfaceContainer + fillColor: Colours.tPalette.m3surfaceContainer startX: root.implicitWidth startY: root.implicitHeight diff --git a/components/filedialog/DialogButtons.qml b/components/filedialog/DialogButtons.qml index a64195a..c5b11dc 100644 --- a/components/filedialog/DialogButtons.qml +++ b/components/filedialog/DialogButtons.qml @@ -11,7 +11,7 @@ StyledRect { implicitHeight: inner.implicitHeight + Appearance.padding.normal * 2 - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer RowLayout { id: inner @@ -30,7 +30,7 @@ StyledRect { Layout.fillHeight: true Layout.rightMargin: Appearance.spacing.normal - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh radius: Appearance.rounding.small StyledText { @@ -42,7 +42,7 @@ StyledRect { } StyledRect { - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh radius: Appearance.rounding.small implicitWidth: cancelText.implicitWidth + Appearance.padding.normal * 2 @@ -68,7 +68,7 @@ StyledRect { } StyledRect { - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh radius: Appearance.rounding.small implicitWidth: cancelText.implicitWidth + Appearance.padding.normal * 2 diff --git a/components/filedialog/FileDialog.qml b/components/filedialog/FileDialog.qml index a533243..8b0b331 100644 --- a/components/filedialog/FileDialog.qml +++ b/components/filedialog/FileDialog.qml @@ -50,7 +50,7 @@ LazyLoader { implicitWidth: 1000 implicitHeight: 600 - color: Colours.palette.m3surface + color: Colours.tPalette.m3surface title: loader.title onVisibleChanged: { diff --git a/components/filedialog/FolderContents.qml b/components/filedialog/FolderContents.qml index 57500c8..7a7cc31 100644 --- a/components/filedialog/FolderContents.qml +++ b/components/filedialog/FolderContents.qml @@ -22,7 +22,7 @@ Item { StyledRect { anchors.fill: parent - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer layer.enabled: true layer.effect: MultiEffect { @@ -124,7 +124,7 @@ Item { implicitHeight: nonAnimHeight radius: Appearance.rounding.normal - color: Qt.alpha(Colours.palette.m3surfaceContainerHighest, GridView.isCurrentItem ? 1 : 0) + color: Qt.alpha(Colours.tPalette.m3surfaceContainerHighest, GridView.isCurrentItem ? 1 : 0) z: GridView.isCurrentItem || implicitHeight !== nonAnimHeight ? 1 : 0 clip: true diff --git a/components/filedialog/HeaderBar.qml b/components/filedialog/HeaderBar.qml index 4af9672..b6e5dba 100644 --- a/components/filedialog/HeaderBar.qml +++ b/components/filedialog/HeaderBar.qml @@ -14,7 +14,7 @@ StyledRect { implicitWidth: inner.implicitWidth + Appearance.padding.normal * 2 implicitHeight: inner.implicitHeight + Appearance.padding.normal * 2 - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer RowLayout { id: inner @@ -50,7 +50,7 @@ StyledRect { Layout.fillWidth: true radius: Appearance.rounding.small - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh implicitHeight: pathComponents.implicitHeight + pathComponents.anchors.margins * 2 diff --git a/components/filedialog/Sidebar.qml b/components/filedialog/Sidebar.qml index 173b429..e9a15bd 100644 --- a/components/filedialog/Sidebar.qml +++ b/components/filedialog/Sidebar.qml @@ -14,7 +14,7 @@ StyledRect { implicitWidth: Sizes.sidebarWidth implicitHeight: inner.implicitHeight + Appearance.padding.normal * 2 - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer ColumnLayout { id: inner diff --git a/modules/bar/Bar.qml b/modules/bar/Bar.qml index d661b86..e7d3cd0 100644 --- a/modules/bar/Bar.qml +++ b/modules/bar/Bar.qml @@ -90,7 +90,7 @@ Item { anchors.topMargin: Appearance.spacing.normal radius: Appearance.rounding.full - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer implicitWidth: workspacesInner.implicitWidth + Appearance.padding.small * 2 implicitHeight: workspacesInner.implicitHeight + Appearance.padding.small * 2 @@ -152,7 +152,7 @@ Item { anchors.bottomMargin: Appearance.spacing.normal radius: Appearance.rounding.full - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer implicitHeight: statusIconsInner.implicitHeight + Appearance.padding.normal * 2 diff --git a/modules/bar/components/workspaces/OccupiedBg.qml b/modules/bar/components/workspaces/OccupiedBg.qml index 567510a..bfdbbbd 100644 --- a/modules/bar/components/workspaces/OccupiedBg.qml +++ b/modules/bar/components/workspaces/OccupiedBg.qml @@ -51,7 +51,7 @@ Item { readonly property Workspace start: root.workspaces[modelData.start - 1 - root.groupOffset] ?? null readonly property Workspace end: root.workspaces[modelData.end - 1 - root.groupOffset] ?? null - color: Colours.alpha(Colours.palette.m3surfaceContainerHigh, true) + color: Colours.tPalette.m3surfaceContainerHigh radius: Config.bar.workspaces.rounded ? Appearance.rounding.full : 0 x: start?.x ?? 0 diff --git a/modules/bar/popouts/Battery.qml b/modules/bar/popouts/Battery.qml index 254e2af..08bb814 100644 --- a/modules/bar/popouts/Battery.qml +++ b/modules/bar/popouts/Battery.qml @@ -112,7 +112,7 @@ Column { implicitWidth: saver.implicitHeight + balance.implicitHeight + perf.implicitHeight + Appearance.padding.normal * 2 + Appearance.spacing.large * 2 implicitHeight: Math.max(saver.implicitHeight, balance.implicitHeight, perf.implicitHeight) + Appearance.padding.small * 2 - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.full StyledRect { diff --git a/modules/bar/popouts/Bluetooth.qml b/modules/bar/popouts/Bluetooth.qml index 09ed768..f8035ed 100644 --- a/modules/bar/popouts/Bluetooth.qml +++ b/modules/bar/popouts/Bluetooth.qml @@ -108,7 +108,7 @@ ColumnLayout { implicitHeight: connectIcon.implicitHeight + Appearance.padding.small radius: Appearance.rounding.full - color: device.modelData.state === BluetoothDeviceState.Connected ? Colours.palette.m3primary : Colours.palette.m3surface + color: device.modelData.state === BluetoothDeviceState.Connected ? Colours.palette.m3primary : Colours.tPalette.m3surface StyledBusyIndicator { anchors.centerIn: parent diff --git a/modules/bar/popouts/Network.qml b/modules/bar/popouts/Network.qml index 6c21f24..ed48b86 100644 --- a/modules/bar/popouts/Network.qml +++ b/modules/bar/popouts/Network.qml @@ -102,7 +102,7 @@ ColumnLayout { implicitHeight: connectIcon.implicitHeight + Appearance.padding.small radius: Appearance.rounding.full - color: networkItem.modelData.active ? Colours.palette.m3primary : Colours.palette.m3surface + color: networkItem.modelData.active ? Colours.palette.m3primary : Colours.tPalette.m3surface StyledBusyIndicator { anchors.centerIn: parent @@ -156,7 +156,7 @@ ColumnLayout { implicitHeight: rescanBtn.implicitHeight + Appearance.padding.small * 2 radius: Appearance.rounding.normal - color: Network.scanning ? Colours.palette.m3surfaceContainer : Colours.palette.m3primaryContainer + color: Network.scanning ? Colours.tPalette.m3surfaceContainer : Colours.palette.m3primaryContainer StateLayer { color: Network.scanning ? Colours.palette.m3onSurface : Colours.palette.m3onPrimaryContainer diff --git a/modules/controlcenter/ControlCenter.qml b/modules/controlcenter/ControlCenter.qml index 0eeb3bf..8cdf01f 100644 --- a/modules/controlcenter/ControlCenter.qml +++ b/modules/controlcenter/ControlCenter.qml @@ -58,7 +58,7 @@ Item { topLeftRadius: root.rounding bottomLeftRadius: root.rounding implicitWidth: navRail.implicitWidth - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer CustomMouseArea { anchors.fill: parent diff --git a/modules/controlcenter/WindowFactory.qml b/modules/controlcenter/WindowFactory.qml index f5c6b73..cc80e72 100644 --- a/modules/controlcenter/WindowFactory.qml +++ b/modules/controlcenter/WindowFactory.qml @@ -25,7 +25,7 @@ Singleton { property alias active: cc.active property alias navExpanded: cc.navExpanded - color: Colours.palette.m3surface + color: Colours.tPalette.m3surface onVisibleChanged: { if (!visible) diff --git a/modules/controlcenter/WindowTitle.qml b/modules/controlcenter/WindowTitle.qml index 35af9a1..fb71608 100644 --- a/modules/controlcenter/WindowTitle.qml +++ b/modules/controlcenter/WindowTitle.qml @@ -11,7 +11,7 @@ StyledRect { required property Session session implicitHeight: text.implicitHeight + Appearance.padding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer StyledText { id: text diff --git a/modules/controlcenter/bluetooth/Details.qml b/modules/controlcenter/bluetooth/Details.qml index dc1cc9b..7a7d6c3 100644 --- a/modules/controlcenter/bluetooth/Details.qml +++ b/modules/controlcenter/bluetooth/Details.qml @@ -64,7 +64,7 @@ Item { implicitHeight: deviceStatus.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer ColumnLayout { id: deviceStatus @@ -118,7 +118,7 @@ Item { implicitHeight: deviceProps.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer ColumnLayout { id: deviceProps @@ -326,7 +326,7 @@ Item { implicitHeight: deviceInfo.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer ColumnLayout { id: deviceInfo @@ -652,6 +652,8 @@ Item { StyledSwitch { id: toggle + + cLayer: 2 } } diff --git a/modules/controlcenter/bluetooth/DeviceList.qml b/modules/controlcenter/bluetooth/DeviceList.qml index cc0a966..1e2cb50 100644 --- a/modules/controlcenter/bluetooth/DeviceList.qml +++ b/modules/controlcenter/bluetooth/DeviceList.qml @@ -167,7 +167,7 @@ ColumnLayout { anchors.right: parent.right implicitHeight: deviceInner.implicitHeight + Appearance.padding.normal * 2 - color: Qt.alpha(Colours.palette.m3surfaceContainer, root.session.bt.active === modelData ? 1 : 0) + color: Qt.alpha(Colours.tPalette.m3surfaceContainer, root.session.bt.active === modelData ? 1 : 0) radius: Appearance.rounding.normal StateLayer { @@ -191,7 +191,7 @@ ColumnLayout { implicitHeight: icon.implicitHeight + Appearance.padding.normal * 2 radius: Appearance.rounding.normal - color: device.connected ? Colours.palette.m3primaryContainer : device.modelData.bonded ? Colours.palette.m3secondaryContainer : Colours.palette.m3surfaceContainerHigh + color: device.connected ? Colours.palette.m3primaryContainer : device.modelData.bonded ? Colours.palette.m3secondaryContainer : Colours.tPalette.m3surfaceContainerHigh StyledRect { anchors.fill: parent diff --git a/modules/controlcenter/bluetooth/Settings.qml b/modules/controlcenter/bluetooth/Settings.qml index f2801a0..6c51ee7 100644 --- a/modules/controlcenter/bluetooth/Settings.qml +++ b/modules/controlcenter/bluetooth/Settings.qml @@ -48,7 +48,7 @@ ColumnLayout { implicitHeight: adapterStatus.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer ColumnLayout { id: adapterStatus @@ -109,7 +109,7 @@ ColumnLayout { implicitHeight: adapterSettings.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer ColumnLayout { id: adapterSettings @@ -474,7 +474,7 @@ ColumnLayout { implicitHeight: adapterInfo.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer ColumnLayout { id: adapterInfo @@ -535,6 +535,8 @@ ColumnLayout { StyledSwitch { id: toggle + + cLayer: 2 } } diff --git a/modules/dashboard/Dash.qml b/modules/dashboard/Dash.qml index 09d7e93..388130c 100644 --- a/modules/dashboard/Dash.qml +++ b/modules/dashboard/Dash.qml @@ -84,6 +84,6 @@ GridLayout { component Rect: StyledRect { radius: Appearance.rounding.small - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer } } diff --git a/modules/dashboard/Media.qml b/modules/dashboard/Media.qml index edb09af..cdd27c9 100644 --- a/modules/dashboard/Media.qml +++ b/modules/dashboard/Media.qml @@ -125,7 +125,7 @@ Item { implicitWidth: Config.dashboard.sizes.mediaCoverArtSize implicitHeight: Config.dashboard.sizes.mediaCoverArtSize - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh radius: Appearance.rounding.full MaterialIcon { @@ -330,7 +330,7 @@ Item { fontSize: Appearance.font.size.larger padding: Appearance.padding.small fill: false - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer function onClicked(): void { Players.active?.raise(); @@ -348,7 +348,7 @@ Item { implicitWidth: slider.implicitWidth * 0.6 implicitHeight: currentPlayer.implicitHeight + Appearance.padding.smaller * 2 radius: Appearance.rounding.normal - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer z: 1 StateLayer { @@ -373,7 +373,7 @@ Item { Layout.fillWidth: true Layout.maximumWidth: playerSelector.implicitWidth - implicitHeight - parent.spacing - Appearance.padding.normal * 2 text: Players.active?.identity ?? "No players" - color: Colours.palette.m3onSecondaryContainer + color: Players.active ? Colours.palette.m3onSurface : Colours.palette.m3onSurfaceVariant elide: Text.ElideRight } } @@ -480,7 +480,7 @@ Item { fontSize: Appearance.font.size.larger padding: Appearance.padding.small fill: false - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer function onClicked(): void { Players.active?.quit(); diff --git a/modules/dashboard/dash/Media.qml b/modules/dashboard/dash/Media.qml index cdb2c1a..8d6c636 100644 --- a/modules/dashboard/dash/Media.qml +++ b/modules/dashboard/dash/Media.qml @@ -38,7 +38,7 @@ Item { ShapePath { fillColor: "transparent" - strokeColor: Colours.palette.m3surfaceContainerHigh + strokeColor: Colours.layer(Colours.palette.m3surfaceContainerHigh, 2) strokeWidth: Config.dashboard.sizes.mediaProgressThickness capStyle: ShapePath.RoundCap @@ -94,7 +94,7 @@ Item { anchors.margins: Appearance.padding.large + Config.dashboard.sizes.mediaProgressThickness + Appearance.spacing.small implicitHeight: width - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh radius: Appearance.rounding.full MaterialIcon { diff --git a/modules/dashboard/dash/Resources.qml b/modules/dashboard/dash/Resources.qml index 3edba0c..326bfb7 100644 --- a/modules/dashboard/dash/Resources.qml +++ b/modules/dashboard/dash/Resources.qml @@ -55,7 +55,7 @@ Row { implicitWidth: Config.dashboard.sizes.resourceProgessThickness - color: Colours.palette.m3surfaceContainerHigh + color: Colours.layer(Colours.palette.m3surfaceContainerHigh, 2) radius: Appearance.rounding.full StyledRect { diff --git a/modules/dashboard/dash/User.qml b/modules/dashboard/dash/User.qml index 9b029ba..d4d52be 100644 --- a/modules/dashboard/dash/User.qml +++ b/modules/dashboard/dash/User.qml @@ -21,7 +21,7 @@ Row { implicitHeight: info.implicitHeight radius: Appearance.rounding.large - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh MaterialIcon { anchors.centerIn: parent diff --git a/modules/drawers/Backgrounds.qml b/modules/drawers/Backgrounds.qml index ff09232..e1773a1 100644 --- a/modules/drawers/Backgrounds.qml +++ b/modules/drawers/Backgrounds.qml @@ -20,45 +20,44 @@ Shape { anchors.margins: Config.border.thickness anchors.leftMargin: bar.implicitWidth preferredRendererType: Shape.CurveRenderer - opacity: Colours.transparency.enabled ? Colours.transparency.base : 1 Osd.Background { - wrapper: panels.osd + wrapper: root.panels.osd - startX: root.width - panels.session.width + startX: root.width - root.panels.session.width startY: (root.height - wrapper.height) / 2 - rounding } Notifications.Background { - wrapper: panels.notifications + wrapper: root.panels.notifications startX: root.width startY: 0 } Session.Background { - wrapper: panels.session + wrapper: root.panels.session startX: root.width startY: (root.height - wrapper.height) / 2 - rounding } Launcher.Background { - wrapper: panels.launcher + wrapper: root.panels.launcher startX: (root.width - wrapper.width) / 2 - rounding startY: root.height } Dashboard.Background { - wrapper: panels.dashboard + wrapper: root.panels.dashboard startX: (root.width - wrapper.width) / 2 - rounding startY: 0 } BarPopouts.Background { - wrapper: panels.popouts + wrapper: root.panels.popouts invertBottomRounding: wrapper.y + wrapper.height + 1 >= root.height startX: wrapper.x @@ -66,7 +65,7 @@ Shape { } Utilities.Background { - wrapper: panels.utilities + wrapper: root.panels.utilities startX: root.width startY: root.height diff --git a/modules/drawers/Border.qml b/modules/drawers/Border.qml index b7cb374..6fdd73b 100644 --- a/modules/drawers/Border.qml +++ b/modules/drawers/Border.qml @@ -15,7 +15,7 @@ Item { StyledRect { anchors.fill: parent - color: Colours.alpha(Colours.palette.m3surface, false) + color: Colours.palette.m3surface layer.enabled: true layer.effect: MultiEffect { diff --git a/modules/drawers/Drawers.qml b/modules/drawers/Drawers.qml index 8b043a1..26f177c 100644 --- a/modules/drawers/Drawers.qml +++ b/modules/drawers/Drawers.qml @@ -88,6 +88,7 @@ Variants { Item { anchors.fill: parent + opacity: Colours.transparency.enabled ? Colours.transparency.base : 1 layer.enabled: true layer.effect: MultiEffect { shadowEnabled: true diff --git a/modules/launcher/Content.qml b/modules/launcher/Content.qml index d7acd55..9b0e4e5 100644 --- a/modules/launcher/Content.qml +++ b/modules/launcher/Content.qml @@ -44,7 +44,7 @@ Item { StyledRect { id: searchWrapper - color: Colours.alpha(Colours.palette.m3surfaceContainer, true) + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.full anchors.left: parent.left diff --git a/modules/launcher/items/ActionItem.qml b/modules/launcher/items/ActionItem.qml index 102b3fd..9e97228 100644 --- a/modules/launcher/items/ActionItem.qml +++ b/modules/launcher/items/ActionItem.qml @@ -58,7 +58,7 @@ Item { text: root.modelData?.desc ?? "" font.pointSize: Appearance.font.size.small - color: Colours.alpha(Colours.palette.m3outline, true) + color: Colours.tPalette.m3outline elide: Text.ElideRight width: root.width - icon.width - Appearance.rounding.normal * 2 diff --git a/modules/launcher/items/AppItem.qml b/modules/launcher/items/AppItem.qml index 6012356..1ba1f42 100644 --- a/modules/launcher/items/AppItem.qml +++ b/modules/launcher/items/AppItem.qml @@ -61,7 +61,7 @@ Item { text: (root.modelData?.comment || root.modelData?.genericName || root.modelData?.name) ?? "" font.pointSize: Appearance.font.size.small - color: Colours.alpha(Colours.palette.m3outline, true) + color: Colours.tPalette.m3outline elide: Text.ElideRight width: root.width - icon.width - Appearance.rounding.normal * 2 diff --git a/modules/launcher/items/VariantItem.qml b/modules/launcher/items/VariantItem.qml index 4d33a38..2d3cbf1 100644 --- a/modules/launcher/items/VariantItem.qml +++ b/modules/launcher/items/VariantItem.qml @@ -58,7 +58,7 @@ Item { text: root.modelData?.description ?? "" font.pointSize: Appearance.font.size.small - color: Colours.alpha(Colours.palette.m3outline, true) + color: Colours.tPalette.m3outline elide: Text.ElideRight width: root.width - icon.width - Appearance.rounding.normal * 2 diff --git a/modules/lock/Backgrounds.qml b/modules/lock/Backgrounds.qml index eba7c7b..cc95176 100644 --- a/modules/lock/Backgrounds.qml +++ b/modules/lock/Backgrounds.qml @@ -37,7 +37,7 @@ Item { id: base anchors.fill: parent - color: Colours.alpha(Colours.palette.m3surface, false) + color: Colours.tPalette.m3surface layer.enabled: true layer.effect: MultiEffect { @@ -86,7 +86,7 @@ Item { readonly property real roundingY: flatten ? height / 2 : rounding strokeWidth: -1 - fillColor: Colours.palette.m3surface + fillColor: Colours.tPalette.m3surface startX: (innerMask.width - width) / 2 - rounding @@ -153,7 +153,7 @@ Item { readonly property real roundingY: flatten ? height / 2 : rounding strokeWidth: -1 - fillColor: Colours.palette.m3surface + fillColor: Colours.tPalette.m3surface startX: (innerMask.width - width) / 2 - rounding startY: Math.ceil(innerMask.height) @@ -221,7 +221,7 @@ Item { readonly property real roundingY: height < rounding * 2 ? height / 2 : rounding strokeWidth: -1 - fillColor: Colours.palette.m3surface + fillColor: Colours.tPalette.m3surface startY: Math.ceil(innerMask.height) - height - roundingY @@ -286,7 +286,7 @@ Item { readonly property real roundingY: height < rounding * 2 ? height / 2 : rounding strokeWidth: -1 - fillColor: root.isNormal ? Colours.palette.m3surface : "transparent" + fillColor: root.isNormal ? Colours.tPalette.m3surface : "transparent" startX: root.isLarge ? 0 : Math.ceil(innerMask.width) startY: root.isLarge ? height + roundingY : Math.ceil(innerMask.height) - height - roundingY @@ -351,7 +351,7 @@ Item { readonly property real roundingY: height < rounding * 2 ? height / 2 : rounding strokeWidth: -1 - fillColor: root.isLarge ? Colours.palette.m3surface : "transparent" + fillColor: root.isLarge ? Colours.tPalette.m3surface : "transparent" startX: Math.ceil(innerMask.width) startY: Math.ceil(innerMask.height) - height - rounding @@ -416,7 +416,7 @@ Item { readonly property real roundingY: height < rounding * 2 ? height / 2 : rounding strokeWidth: -1 - fillColor: root.isLarge ? Colours.palette.m3surface : "transparent" + fillColor: root.isLarge ? Colours.tPalette.m3surface : "transparent" startX: Math.ceil(innerMask.width) startY: height + rounding diff --git a/modules/lock/Input.qml b/modules/lock/Input.qml index b1d2ae3..b989bb9 100644 --- a/modules/lock/Input.qml +++ b/modules/lock/Input.qml @@ -31,7 +31,7 @@ ColumnLayout { implicitHeight: Config.lock.sizes.faceSize radius: Appearance.rounding.large - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer MaterialIcon { anchors.centerIn: parent @@ -77,7 +77,7 @@ ColumnLayout { Layout.preferredHeight: Appearance.font.size.normal + Appearance.padding.large * 2 focus: true - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.small clip: true diff --git a/modules/lock/MediaPlaying.qml b/modules/lock/MediaPlaying.qml index a38f0e8..4fc7991 100644 --- a/modules/lock/MediaPlaying.qml +++ b/modules/lock/MediaPlaying.qml @@ -47,7 +47,7 @@ RowLayout { ClippingWrapperRectangle { anchors.fill: parent - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh radius: Appearance.rounding.small rotation: 9 @@ -91,7 +91,7 @@ RowLayout { StyledClippingRect { anchors.fill: parent - color: Colours.palette.m3surfaceContainerHigh + color: Colours.tPalette.m3surfaceContainerHigh radius: Appearance.rounding.small border.width: Config.lock.sizes.mediaCoverBorder diff --git a/modules/lock/Notification.qml b/modules/lock/Notification.qml index c06db56..c9bf05e 100644 --- a/modules/lock/Notification.qml +++ b/modules/lock/Notification.qml @@ -19,7 +19,7 @@ StyledRect { readonly property bool hasAppIcon: modelData.appIcon.length > 0 readonly property int nonAnimHeight: Math.max(image.height, details.implicitHeight) + Appearance.padding.normal * 2 - color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondaryContainer : Colours.palette.m3surfaceContainer + color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondaryContainer : Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.normal implicitWidth: Config.notifs.sizes.width @@ -113,7 +113,7 @@ StyledRect { sourceComponent: StyledRect { radius: Appearance.rounding.full - color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3error : root.modelData.urgency === NotificationUrgency.Low ? Colours.palette.m3surfaceContainerHighest : Colours.palette.m3tertiaryContainer + color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3error : root.modelData.urgency === NotificationUrgency.Low ? Colours.tPalette.m3surfaceContainerHighest : Colours.palette.m3tertiaryContainer implicitWidth: root.hasImage ? Config.notifs.sizes.badge : Config.notifs.sizes.image implicitHeight: root.hasImage ? Config.notifs.sizes.badge : Config.notifs.sizes.image diff --git a/modules/notifications/Notification.qml b/modules/notifications/Notification.qml index cdb6804..080ee7b 100644 --- a/modules/notifications/Notification.qml +++ b/modules/notifications/Notification.qml @@ -20,7 +20,7 @@ StyledRect { readonly property int nonAnimHeight: summary.implicitHeight + (root.expanded ? appName.height + body.height + actions.height + actions.anchors.topMargin : bodyPreview.height) + inner.anchors.margins * 2 property bool expanded - color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondaryContainer : Colours.palette.m3surfaceContainer + color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondaryContainer : Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.normal implicitWidth: Config.notifs.sizes.width implicitHeight: inner.implicitHeight @@ -147,7 +147,7 @@ StyledRect { sourceComponent: StyledRect { radius: Appearance.rounding.full - color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3error : root.modelData.urgency === NotificationUrgency.Low ? Colours.palette.m3surfaceContainerHighest : Colours.palette.m3tertiaryContainer + color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3error : root.modelData.urgency === NotificationUrgency.Low ? Colours.layer(Colours.palette.m3surfaceContainerHighest, 2) : Colours.palette.m3tertiaryContainer implicitWidth: root.hasImage ? Config.notifs.sizes.badge : Config.notifs.sizes.image implicitHeight: root.hasImage ? Config.notifs.sizes.badge : Config.notifs.sizes.image @@ -450,7 +450,7 @@ StyledRect { required property var modelData radius: Appearance.rounding.full - color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondary : Colours.palette.m3surfaceContainerHigh + color: root.modelData.urgency === NotificationUrgency.Critical ? Colours.palette.m3secondary : Colours.tPalette.m3surfaceContainerHigh Layout.preferredWidth: actionText.width + Appearance.padding.normal * 2 Layout.preferredHeight: actionText.height + Appearance.padding.small * 2 diff --git a/modules/session/Content.qml b/modules/session/Content.qml index a75de10..ca6bf17 100644 --- a/modules/session/Content.qml +++ b/modules/session/Content.qml @@ -93,7 +93,7 @@ Column { implicitHeight: Config.session.sizes.button radius: Appearance.rounding.large - color: button.activeFocus ? Colours.palette.m3secondaryContainer : Colours.palette.m3surfaceContainer + color: button.activeFocus ? Colours.palette.m3secondaryContainer : Colours.tPalette.m3surfaceContainer Keys.onEnterPressed: Quickshell.execDetached(button.command) Keys.onReturnPressed: Quickshell.execDetached(button.command) diff --git a/modules/utilities/Background.qml b/modules/utilities/Background.qml index 37ef3de..b3d513b 100644 --- a/modules/utilities/Background.qml +++ b/modules/utilities/Background.qml @@ -1,6 +1,5 @@ import qs.services import qs.config -import Quickshell import QtQuick import QtQuick.Shapes diff --git a/modules/windowinfo/Buttons.qml b/modules/windowinfo/Buttons.qml index dea5059..67e97a2 100644 --- a/modules/windowinfo/Buttons.qml +++ b/modules/windowinfo/Buttons.qml @@ -81,7 +81,7 @@ ColumnLayout { readonly property int wsId: Math.floor((Hyprland.activeWsId - 1) / 10) * 10 + index + 1 readonly property bool isCurrent: root.client?.workspace.id === wsId - color: isCurrent ? Colours.palette.m3surfaceContainerHighest : Colours.palette.m3tertiaryContainer + color: isCurrent ? Colours.tPalette.m3surfaceContainerHighest : Colours.palette.m3tertiaryContainer onColor: isCurrent ? Colours.palette.m3onSurface : Colours.palette.m3onTertiaryContainer text: wsId disabled: isCurrent diff --git a/modules/windowinfo/Preview.qml b/modules/windowinfo/Preview.qml index 2cae647..d2c5682 100644 --- a/modules/windowinfo/Preview.qml +++ b/modules/windowinfo/Preview.qml @@ -29,7 +29,7 @@ Item { implicitWidth: view.implicitWidth - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.small Loader { diff --git a/modules/windowinfo/WindowInfo.qml b/modules/windowinfo/WindowInfo.qml index 713122a..919b3fb 100644 --- a/modules/windowinfo/WindowInfo.qml +++ b/modules/windowinfo/WindowInfo.qml @@ -38,7 +38,7 @@ Item { Layout.fillWidth: true Layout.fillHeight: true - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.normal Details { @@ -50,7 +50,7 @@ Item { Layout.fillWidth: true Layout.preferredHeight: buttons.implicitHeight - color: Colours.palette.m3surfaceContainer + color: Colours.tPalette.m3surfaceContainer radius: Appearance.rounding.normal Buttons { diff --git a/services/Colours.qml b/services/Colours.qml index 47df15b..12447d4 100644 --- a/services/Colours.qml +++ b/services/Colours.qml @@ -1,32 +1,41 @@ pragma Singleton +pragma ComponentBehavior: Bound -import qs.config import qs.utils import Quickshell import Quickshell.Io import QtQuick +import QtQuick.Controls Singleton { id: root - readonly property list<string> colourNames: ["rosewater", "flamingo", "pink", "mauve", "red", "maroon", "peach", "yellow", "green", "teal", "sky", "sapphire", "blue", "lavender"] - property bool showPreview property string scheme property string flavour - property bool light + readonly property bool light: showPreview ? previewLight : currentLight + property bool currentLight + property bool previewLight readonly property M3Palette palette: showPreview ? preview : current + readonly property M3TPalette tPalette: M3TPalette {} readonly property M3Palette current: M3Palette {} readonly property M3Palette preview: M3Palette {} readonly property Transparency transparency: Transparency {} - function alpha(c: color, layer: bool): color { + function alterColour(c: color, a: real, layer: int): color { + const luminance = Math.sqrt(0.299 * (c.r ** 2) + 0.587 * (c.g ** 2) + 0.114 * (c.b ** 2)); + const scale = (luminance + (!light || layer == 1 ? 1 : -layer / 2) * (light ? 0.1 : 0.3) * (1 - transparency.base)) / luminance; + const r = Math.max(0, Math.min(1, c.r * scale)); + const g = Math.max(0, Math.min(1, c.g * scale)); + const b = Math.max(0, Math.min(1, c.b * scale)); + return Qt.rgba(r, g, b, a); + } + + function layer(c: color, layer: var): color { if (!transparency.enabled) return c; - c = Qt.rgba(c.r, c.g, c.b, layer ? transparency.layers : transparency.base); - if (layer) - c.hsvValue = Math.max(0, Math.min(1, c.hslLightness + (light ? -0.2 : 0.2))); // TODO: edit based on colours (hue or smth) - return c; + + return layer === 0 ? Qt.alpha(c, transparency.base) : alterColour(c, transparency.layers, layer ?? 1); } function on(c: color): color { @@ -42,12 +51,13 @@ Singleton { if (!isPreview) { root.scheme = scheme.name; flavour = scheme.flavour; + currentLight = scheme.mode === "light"; + } else { + previewLight = scheme.mode === "light"; } - light = scheme.mode === "light"; - for (const [name, colour] of Object.entries(scheme.colours)) { - const propName = colourNames.includes(name) ? name : `m3${name}`; + const propName = `m3${name}`; if (colours.hasOwnProperty(propName)) colours[propName] = `#${colour}`; } @@ -65,9 +75,66 @@ Singleton { } component Transparency: QtObject { - readonly property bool enabled: false - readonly property real base: 0.78 - readonly property real layers: 0.58 + property bool enabled: true + property real base: 0.8 + property real layers: 0.75 + } + + component M3TPalette: M3Palette { + m3primary_paletteKeyColor: root.layer(root.palette.m3primary_paletteKeyColor) + m3secondary_paletteKeyColor: root.layer(root.palette.m3secondary_paletteKeyColor) + m3tertiary_paletteKeyColor: root.layer(root.palette.m3tertiary_paletteKeyColor) + m3neutral_paletteKeyColor: root.layer(root.palette.m3neutral_paletteKeyColor) + m3neutral_variant_paletteKeyColor: root.layer(root.palette.m3neutral_variant_paletteKeyColor) + m3background: root.layer(root.palette.m3background, 0) + m3onBackground: root.layer(root.palette.m3onBackground) + m3surface: root.layer(root.palette.m3surface, 0) + m3surfaceDim: root.layer(root.palette.m3surfaceDim, 0) + m3surfaceBright: root.layer(root.palette.m3surfaceBright, 0) + m3surfaceContainerLowest: root.layer(root.palette.m3surfaceContainerLowest) + m3surfaceContainerLow: root.layer(root.palette.m3surfaceContainerLow) + m3surfaceContainer: root.layer(root.palette.m3surfaceContainer) + m3surfaceContainerHigh: root.layer(root.palette.m3surfaceContainerHigh) + m3surfaceContainerHighest: root.layer(root.palette.m3surfaceContainerHighest) + m3onSurface: root.layer(root.palette.m3onSurface) + m3surfaceVariant: root.layer(root.palette.m3surfaceVariant, 0) + m3onSurfaceVariant: root.layer(root.palette.m3onSurfaceVariant) + m3inverseSurface: root.layer(root.palette.m3inverseSurface, 0) + m3inverseOnSurface: root.layer(root.palette.m3inverseOnSurface) + m3outline: root.layer(root.palette.m3outline) + m3outlineVariant: root.layer(root.palette.m3outlineVariant) + m3shadow: root.layer(root.palette.m3shadow) + m3scrim: root.layer(root.palette.m3scrim) + m3surfaceTint: root.layer(root.palette.m3surfaceTint) + m3primary: root.layer(root.palette.m3primary) + m3onPrimary: root.layer(root.palette.m3onPrimary) + m3primaryContainer: root.layer(root.palette.m3primaryContainer) + m3onPrimaryContainer: root.layer(root.palette.m3onPrimaryContainer) + m3inversePrimary: root.layer(root.palette.m3inversePrimary) + m3secondary: root.layer(root.palette.m3secondary) + m3onSecondary: root.layer(root.palette.m3onSecondary) + m3secondaryContainer: root.layer(root.palette.m3secondaryContainer) + m3onSecondaryContainer: root.layer(root.palette.m3onSecondaryContainer) + m3tertiary: root.layer(root.palette.m3tertiary) + m3onTertiary: root.layer(root.palette.m3onTertiary) + m3tertiaryContainer: root.layer(root.palette.m3tertiaryContainer) + m3onTertiaryContainer: root.layer(root.palette.m3onTertiaryContainer) + m3error: root.layer(root.palette.m3error) + m3onError: root.layer(root.palette.m3onError) + m3errorContainer: root.layer(root.palette.m3errorContainer) + m3onErrorContainer: root.layer(root.palette.m3onErrorContainer) + m3primaryFixed: root.layer(root.palette.m3primaryFixed) + m3primaryFixedDim: root.layer(root.palette.m3primaryFixedDim) + m3onPrimaryFixed: root.layer(root.palette.m3onPrimaryFixed) + m3onPrimaryFixedVariant: root.layer(root.palette.m3onPrimaryFixedVariant) + m3secondaryFixed: root.layer(root.palette.m3secondaryFixed) + m3secondaryFixedDim: root.layer(root.palette.m3secondaryFixedDim) + m3onSecondaryFixed: root.layer(root.palette.m3onSecondaryFixed) + m3onSecondaryFixedVariant: root.layer(root.palette.m3onSecondaryFixedVariant) + m3tertiaryFixed: root.layer(root.palette.m3tertiaryFixed) + m3tertiaryFixedDim: root.layer(root.palette.m3tertiaryFixedDim) + m3onTertiaryFixed: root.layer(root.palette.m3onTertiaryFixed) + m3onTertiaryFixedVariant: root.layer(root.palette.m3onTertiaryFixedVariant) } component M3Palette: QtObject { @@ -125,20 +192,5 @@ Singleton { property color m3tertiaryFixedDim: "#ECB8CD" property color m3onTertiaryFixed: "#301121" property color m3onTertiaryFixedVariant: "#613B4C" - - property color rosewater: "#B8C4FF" - property color flamingo: "#DBB9F8" - property color pink: "#F3B3E3" - property color mauve: "#D0BDFE" - property color red: "#F8B3D1" - property color maroon: "#F6B2DA" - property color peach: "#E4B7F4" - property color yellow: "#C3C0FF" - property color green: "#ADC6FF" - property color teal: "#D4BBFC" - property color sky: "#CBBEFF" - property color sapphire: "#BDC2FF" - property color blue: "#C7BFFF" - property color lavender: "#EAB5ED" } } |