diff --git a/Colors.js b/Colors.js new file mode 100644 index 0000000..9774932 --- /dev/null +++ b/Colors.js @@ -0,0 +1,18 @@ +const colors = { + base00: "#1e1e2e", + base01: "#181825", + base02: "#313244", + base03: "#45475a", + base04: "#585b70", + base05: "#cdd6f4", + base06: "#f5e0dc", + base07: "#b4befe", + base08: "#f38ba8", + base09: "#fab387", + base0A: "#f9e2af", + base0B: "#a6e3a1", + base0C: "#94e2d5", + base0D: "#89b4fa", + base0E: "#cba6f7", + base0F: "#f2cdcd", +} diff --git a/Colors.qml b/Colors.qml index 25df663..c02dcda 100644 --- a/Colors.qml +++ b/Colors.qml @@ -2,76 +2,30 @@ pragma ComponentBehavior: Bound pragma Singleton import QtQuick import Quickshell -import Quickshell.Io +import "Colors.js" as Colors Singleton { id: root - // --- The Backgrounds (Darkest to Lightest) --- readonly property color accent: base0D readonly property color barBg: base01 readonly property color moduleBg: Qt.hsla(base01.hslHue, base01.hslSaturation, base01.hslLightness + 0.05, 1.0) readonly property color activeModuleBg: Qt.hsla(base01.hslHue, base01.hslSaturation, base01.hslLightness + 0.1, 1.0) readonly property color text: base06 - readonly property color base00: "#" + viewer.base00 - readonly property color base01: "#" + viewer.base01 - readonly property color base02: "#" + viewer.base02 - readonly property color base03: "#" + viewer.base03 - readonly property color base04: "#" + viewer.base04 - readonly property color base05: "#" + viewer.base05 - readonly property color base06: "#" + viewer.base06 - readonly property color base07: "#" + viewer.base07 - readonly property color base08: "#" + viewer.base08 - readonly property color base09: "#" + viewer.base09 - readonly property color base0A: "#" + viewer.base0A - readonly property color base0B: "#" + viewer.base0B - readonly property color base0C: "#" + viewer.base0C - readonly property color base0D: "#" + viewer.base0D - readonly property color base0E: "#" + viewer.base0E - readonly property color base0F: "#" + viewer.base0F - - FileView { - id: viewer - path: `${Quickshell.env("HOME")}/.config/stylix/palette.json` - watchChanges: true - onAdapterUpdated: reload() - onAdapterChanged: reload() - blockLoading: true - property alias base00: palette.base00 - property alias base01: palette.base01 - property alias base02: palette.base02 - property alias base03: palette.base03 - property alias base04: palette.base04 - property alias base05: palette.base05 - property alias base06: palette.base06 - property alias base07: palette.base07 - property alias base08: palette.base08 - property alias base09: palette.base09 - property alias base0A: palette.base0A - property alias base0B: palette.base0B - property alias base0C: palette.base0C - property alias base0D: palette.base0D - property alias base0E: palette.base0E - property alias base0F: palette.base0F - - JsonAdapter { - id: palette - property string base00 - property string base01 - property string base02 - property string base03 - property string base04 - property string base05 - property string base06 - property string base07 - property string base08 - property string base09 - property string base0A - property string base0B - property string base0C - property string base0D - property string base0E - property string base0F - } - } + readonly property color base00: Colors.colors.base00 + readonly property color base01: Colors.colors.base01 + readonly property color base02: Colors.colors.base02 + readonly property color base03: Colors.colors.base03 + readonly property color base04: Colors.colors.base04 + readonly property color base05: Colors.colors.base05 + readonly property color base06: Colors.colors.base06 + readonly property color base07: Colors.colors.base07 + readonly property color base08: Colors.colors.base08 + readonly property color base09: Colors.colors.base09 + readonly property color base0A: Colors.colors.base0A + readonly property color base0B: Colors.colors.base0B + readonly property color base0C: Colors.colors.base0C + readonly property color base0D: Colors.colors.base0D + readonly property color base0E: Colors.colors.base0E + readonly property color base0F: Colors.colors.base0F } diff --git a/modules/bar/ActiveWindow.qml b/modules/bar/ActiveWindow.qml index 930179d..6923cf8 100644 --- a/modules/bar/ActiveWindow.qml +++ b/modules/bar/ActiveWindow.qml @@ -11,16 +11,6 @@ import QtQuick.Effects Rectangle { id: root required property double moduleHeight - layer.enabled: true - layer.effect: MultiEffect { - id: dropShadow - source: root - shadowEnabled: true - shadowHorizontalOffset: 4 - shadowVerticalOffset: 2 - shadowOpacity: 0.5 - shadowColor: "#020202" - } implicitHeight: moduleHeight implicitWidth: titleLayout.width + 32 color: Colors.moduleBg diff --git a/modules/bar/Bat.qml b/modules/bar/Bat.qml index 77ae4e6..77ee321 100644 --- a/modules/bar/Bat.qml +++ b/modules/bar/Bat.qml @@ -8,16 +8,6 @@ import qs.settings Rectangle { id: root - layer.enabled: true - layer.effect: MultiEffect { - id: dropShadow - source: root - shadowEnabled: true - shadowHorizontalOffset: 4 - shadowVerticalOffset: 2 - shadowOpacity: 0.5 - shadowColor: "#020202" - } clip: true color: Colors.moduleBg visible: UPower.displayDevice.isLaptopBattery diff --git a/modules/bar/Clock.qml b/modules/bar/Clock.qml index a44ad7b..b960b3b 100644 --- a/modules/bar/Clock.qml +++ b/modules/bar/Clock.qml @@ -8,16 +8,6 @@ import qs.settings Rectangle { id: root - layer.enabled: true - layer.effect: MultiEffect { - id: dropShadow - source: root - shadowEnabled: true - shadowHorizontalOffset: 4 - shadowVerticalOffset: 2 - shadowOpacity: 0.5 - shadowColor: "#020202" - } clip: true required property double moduleHeight implicitHeight: moduleHeight diff --git a/modules/bar/Pw.qml b/modules/bar/Pw.qml index b04731f..1dba7b6 100644 --- a/modules/bar/Pw.qml +++ b/modules/bar/Pw.qml @@ -10,16 +10,6 @@ import qs.settings Rectangle { id: root - layer.enabled: true - layer.effect: MultiEffect { - id: dropShadow - source: root - shadowEnabled: true - shadowHorizontalOffset: 4 - shadowVerticalOffset: 2 - shadowOpacity: 0.5 - shadowColor: "#020202" - } color: clickHandler.containsMouse ? Colors.activeModuleBg : Colors.moduleBg property PwNode defaultAudio: Pipewire.ready ? Pipewire.defaultAudioSink : null property bool mute: Pipewire.ready ? defaultAudio?.audio.muted : null diff --git a/modules/bar/Tray.qml b/modules/bar/Tray.qml index 12668e8..ccac419 100644 --- a/modules/bar/Tray.qml +++ b/modules/bar/Tray.qml @@ -10,16 +10,6 @@ import qs.settings Rectangle { id: root - layer.enabled: true - layer.effect: MultiEffect { - id: dropShadow - source: root - shadowEnabled: true - shadowHorizontalOffset: 4 - shadowVerticalOffset: 2 - shadowOpacity: 0.5 - shadowColor: "#020202" - } visible: iconRepeater.count != 0 Layout.fillHeight: true required property double moduleHeight diff --git a/modules/wallpaper/WallpaperPicker.qml b/modules/wallpaper/WallpaperPicker.qml index eaab9ef..ac20cb5 100644 --- a/modules/wallpaper/WallpaperPicker.qml +++ b/modules/wallpaper/WallpaperPicker.qml @@ -1,11 +1,9 @@ pragma ComponentBehavior: Bound import Quickshell import Quickshell.Wayland -import Quickshell.Widgets import Quickshell.Hyprland import QtQuick import Qt.labs.folderlistmodel 2.11 -import QtQuick.Effects import qs import qs.settings @@ -13,17 +11,6 @@ import qs.widgets Rectangle { id: main - - layer.enabled: true - layer.effect: MultiEffect { - id: dropShadow - source: main - shadowEnabled: true - shadowHorizontalOffset: 4 - shadowVerticalOffset: 2 - shadowOpacity: 0.5 - shadowColor: "#020202" - } required property real moduleHeight required property int screenHeight color: Colors.moduleBg @@ -46,7 +33,8 @@ Rectangle { } WlrLayershell { id: wallPicker - visible: false + visible: true + layer: WlrLayer.Top exclusionMode: ExclusionMode.Ignore keyboardFocus: WlrKeyboardFocus.OnDemand implicitHeight: main.screenHeight / 8 @@ -71,7 +59,7 @@ Rectangle { if (wallPicker.visible) container.forceActiveFocus(); } - ClippingRectangle { + Rectangle { id: container focus: true Keys.onEscapePressed: { @@ -88,39 +76,38 @@ Rectangle { snapMode: GridView.SnapOneRow flow: GridView.FlowTopToBottom cellHeight: container.height - cellWidth: container.width / 8 + cellWidth: container.width / 7 anchors.fill: parent - anchors.rightMargin: 10 + anchors.centerIn: container + anchors.margins: 20 model: wallpaperList - delegate: ClippingWrapperRectangle { + delegate: Rectangle { id: wallTile - margin: 10 required property var modelData color: 'transparent' - implicitWidth: wallPicker.width / 8 - implicitHeight: wallPicker.height - child: ClippingRectangle { - id: wpRounder - color: 'transparent' - radius: Config.rounding / 1.5 - Image { - id: wallpaper - anchors.fill: parent - source: wallTile.modelData.filePath - sourceSize.width: 16 * 30 - sourceSize.height: 9 * 30 - asynchronous: true - cache: true - } - MouseArea { - id: wpClickHandler - anchors.fill: parent - cursorShape: Qt.PointingHandCursor - acceptedButtons: Qt.LeftButton - hoverEnabled: true - onClicked: { - Config.wallpaper = wallTile.modelData.filePath; - } + implicitWidth: wallpaperLayout.cellWidth - 20 + implicitHeight: wallpaperLayout.cellHeight - 20 + anchors.margins: 20 + clip: true + radius: 16 + Image { + id: wallpaper + source: wallTile.modelData.filePath + sourceSize.width: 16 * 20 + sourceSize.height: 9 * 20 + asynchronous: true + anchors.fill: parent + anchors.verticalCenter: parent.verticalCenter + cache: true + } + MouseArea { + id: wpClickHandler + anchors.fill: parent + cursorShape: Qt.PointingHandCursor + acceptedButtons: Qt.LeftButton + hoverEnabled: true + onClicked: { + Config.wallpaper = wallTile.modelData.filePath; } } } diff --git a/settings/Config.qml b/settings/Config.qml index b1d6576..d8daa75 100644 --- a/settings/Config.qml +++ b/settings/Config.qml @@ -29,5 +29,6 @@ Singleton { property alias floating: root.floating property alias wallDir: root.wallDir property alias showCorners: root.showCorners + property alias iconSize: root.iconSize } } diff --git a/widgets/MaterialIcon.qml b/widgets/MaterialIcon.qml index c648aa9..ef43202 100644 --- a/widgets/MaterialIcon.qml +++ b/widgets/MaterialIcon.qml @@ -5,7 +5,7 @@ import QtQuick Text { font.family: "Material Symbols Rounded" color: Colors.text - font.pointSize: Config.iconSize - 4 + font.pointSize: Config.iconSize property bool fill: true renderType: Text.NativeRendering font.variableAxes: {