add setting for margins in bar

This commit is contained in:
lucy 2026-03-20 10:34:10 +01:00
parent 57f9603531
commit e0808edeb5
11 changed files with 189 additions and 158 deletions

View File

@ -3,24 +3,24 @@ import QtQuick
QtObject { QtObject {
// --- The Backgrounds (Darkest to Lightest) --- // --- The Backgrounds (Darkest to Lightest) ---
readonly property string base00: "#1f2430" // Default Background readonly property string base00: "#181616" // Default Background
readonly property string base01: "#242936" // Lighter Background (Status bars, panels) readonly property string base01: "#282727" // Lighter Background (Status bars, panels)
readonly property string base02: "#323844" // Selection Background readonly property string base02: "#393836" // Selection Background
readonly property string base03: "#4a5059" // Comments, Invisibles, line highlighting readonly property string base03: "#625e5a" // Comments, Invisibles, line highlighting
// --- The Foregrounds (Darkest to Lightest) --- // --- The Foregrounds (Darkest to Lightest) ---
readonly property string base04: "#707a8c" // Dark Foreground (Used for status bars) readonly property string base04: "#737c73" // Dark Foreground (Used for status bars)
readonly property string base05: "#cccac2" // Default Foreground, Caret readonly property string base05: "#c5c9c5" // Default Foreground, Caret
readonly property string base06: "#d9d7ce" // Light Foreground (Rarely used) readonly property string base06: "#c8c093" // Light Foreground (Rarely used)
readonly property string base07: "#f3f4f5" // Lightest Foreground readonly property string base07: "#c5c9c5" // Lightest Foreground
// --- The Accent Colors --- // --- The Accent Colors ---
readonly property string base08: "#f28779" // Red (Variables, errors) readonly property string base08: "#c4746e" // Red (Variables, errors)
readonly property string base09: "#ffad66" // Orange (Integers, booleans, constants) readonly property string base09: "#b6927b" // Orange (Integers, booleans, constants)
readonly property string base0A: "#ffd173" // Yellow (Classes, search text bg, warnings) readonly property string base0A: "#c4b28a" // Yellow (Classes, search text bg, warnings)
readonly property string base0B: "#d5ff80" // Green (Strings, success states) readonly property string base0B: "#8a9a7b" // Green (Strings, success states)
readonly property string base0C: "#95e6cb" // Cyan (Support, regex, escape chars) readonly property string base0C: "#8ea4a2" // Cyan (Support, regex, escape chars)
readonly property string base0D: "#73d0ff" // Blue (Functions, methods, headings) readonly property string base0D: "#8ba4b0" // Blue (Functions, methods, headings)
readonly property string base0E: "#d4bfff" // Purple/Mauve (Keywords, storage, selectors) readonly property string base0E: "#a292a3" // Purple/Mauve (Keywords, storage, selectors)
readonly property string base0F: "#f27983" // Brown/Flamingo (Deprecated, embedded tags) readonly property string base0F: "#b98d7b" // Brown/Flamingo (Deprecated, embedded tags)
} }

View File

@ -26,8 +26,8 @@ Variants {
implicitHeight: Settings.config.barHeight implicitHeight: Settings.config.barHeight
color: "transparent" color: "transparent"
Rectangle { Rectangle {
anchors.fill: parent
id: bar id: bar
anchors.fill: parent
radius: Settings.config.floating ? Settings.config.rounding * 2 : 0 radius: Settings.config.floating ? Settings.config.rounding * 2 : 0
color: Colors.base00 color: Colors.base00
RowLayout { RowLayout {
@ -41,22 +41,22 @@ Variants {
barScreen: root.modelData barScreen: root.modelData
} }
MPris {} MPris {}
Title {}
} }
RowLayout { RowLayout {
id: center id: center
anchors { anchors {
centerIn: parent centerIn: parent
} }
Title {} Clock {}
} }
RowLayout { RowLayout {
id: right id: right
anchors { anchors {
right: parent.right right: parent.right
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
rightMargin: Settings.config.floating ? 6 : 10 rightMargin: Settings.config.floating ? Settings.config.barmargins : 10
} }
Clock {}
StatusIcons {} StatusIcons {}
Tray {} Tray {}
} }

View File

@ -1,11 +1,14 @@
import Quickshell import Quickshell
import Quickshell.Widgets
import QtQuick import QtQuick
import Qt5Compat.GraphicalEffects import Qt5Compat.GraphicalEffects
import qs.settings import qs.settings
import qs import qs
import qs.widgets import qs.widgets
Rectangle { WrapperRectangle {
id: root
margin: Settings.config.barmargins
layer { layer {
enabled: true enabled: true
effect: DropShadow { effect: DropShadow {
@ -16,18 +19,21 @@ Rectangle {
samples: 18 samples: 18
} }
} }
id: root
color: Colors.base02 color: Colors.base02
implicitWidth: clockText.implicitWidth + 14
implicitHeight: Settings.config.barHeight / 1.5
radius: Settings.config.rounding radius: Settings.config.rounding
implicitWidth: clockText.implicitWidth + 20
implicitHeight: Settings.config.barHeight - margin * 2
SystemClock { SystemClock {
id: clock id: clock
precision: SystemClock.Minutes precision: SystemClock.Minutes
} }
child: Item {
id: textWrap
CText { CText {
id: clockText id: clockText
anchors.centerIn: root
text: Qt.formatDateTime(clock.date, "hh:mm") text: Qt.formatDateTime(clock.date, "hh:mm")
anchors.centerIn: parent
}
} }
} }

View File

@ -1,5 +1,6 @@
import Quickshell import Quickshell
import Quickshell.Services.Mpris import Quickshell.Services.Mpris
import Quickshell.Widgets
import QtQuick import QtQuick
import Qt5Compat.GraphicalEffects import Qt5Compat.GraphicalEffects
import QtQuick.Layouts import QtQuick.Layouts
@ -7,7 +8,10 @@ import qs
import qs.settings import qs.settings
import qs.widgets import qs.widgets
Rectangle { WrapperRectangle {
id: root
margin: Settings.config.barmargins
layer { layer {
enabled: true enabled: true
effect: DropShadow { effect: DropShadow {
@ -18,10 +22,9 @@ Rectangle {
samples: 18 samples: 18
} }
} }
id: root
color: Colors.base02 color: Colors.base02
implicitWidth: songLayout.implicitWidth + 14 implicitWidth: songLayout.implicitWidth + 20
implicitHeight: Settings.config.barHeight / 1.5 implicitHeight: Settings.config.barHeight - margin * 2
radius: Settings.config.rounding radius: Settings.config.rounding
property var spotify: root.getSpotify() property var spotify: root.getSpotify()
visible: getSpotify() == null ? false : true visible: getSpotify() == null ? false : true
@ -37,6 +40,7 @@ Rectangle {
return null; return null;
} }
child: Item {
RowLayout { RowLayout {
id: songLayout id: songLayout
anchors.centerIn: parent anchors.centerIn: parent
@ -47,4 +51,5 @@ Rectangle {
elide: Text.ElideRight elide: Text.ElideRight
} }
} }
}
} }

View File

@ -1,5 +1,6 @@
import Quickshell.Services.UPower import Quickshell.Services.UPower
import Quickshell.Services.Pipewire import Quickshell.Services.Pipewire
import Quickshell.Widgets
import QtQuick import QtQuick
import Qt5Compat.GraphicalEffects import Qt5Compat.GraphicalEffects
import QtQuick.Layouts import QtQuick.Layouts
@ -7,7 +8,9 @@ import qs
import qs.settings import qs.settings
import qs.widgets import qs.widgets
Rectangle { WrapperRectangle {
id: root
margin: Settings.config.barmargins
layer { layer {
enabled: true enabled: true
effect: DropShadow { effect: DropShadow {
@ -18,10 +21,9 @@ Rectangle {
samples: 18 samples: 18
} }
} }
id: root
color: Colors.base02 color: Colors.base02
implicitWidth: iconLayout.implicitWidth + 14 implicitWidth: iconLayout.implicitWidth + 14
implicitHeight: Settings.config.barHeight / 1.5 implicitHeight: Settings.config.barHeight - margin * 2
radius: Settings.config.rounding radius: Settings.config.rounding
property var battery: UPower.displayDevice property var battery: UPower.displayDevice
property var percentage: UPower.displayDevice.percentage property var percentage: UPower.displayDevice.percentage
@ -78,10 +80,10 @@ Rectangle {
return ""; return "";
} }
} }
child: Item {
RowLayout { RowLayout {
id: iconLayout id: iconLayout
anchors.centerIn: parent anchors.centerIn: parent
spacing: 5
CIcon { CIcon {
id: batteryIcon id: batteryIcon
Layout.leftMargin: 2 Layout.leftMargin: 2
@ -90,12 +92,11 @@ Rectangle {
CIcon { CIcon {
id: volIcon id: volIcon
text: root.getVolumeIcon() text: root.getVolumeIcon()
}
}
property var audioSink: Pipewire.defaultAudioSink
PwObjectTracker { PwObjectTracker {
id: audioTracker id: audioTracker
objects: Pipewire.ready ? Pipewire.defaultAudioSink : [] objects: Pipewire.ready ? Pipewire.defaultAudioSink : []
} }
}
}
}
} }

View File

@ -1,14 +1,16 @@
import Quickshell import Quickshell
import Qt5Compat.GraphicalEffects import Qt5Compat.GraphicalEffects
import Quickshell.Wayland import Quickshell.Wayland
import Quickshell.Widgets
import QtQuick import QtQuick
import QtQuick.Layouts import QtQuick.Layouts
import qs import qs
import qs.widgets import qs.widgets
import qs.settings import qs.settings
Rectangle { WrapperRectangle {
id: root id: root
margin: Settings.config.barmargins
layer { layer {
enabled: true enabled: true
effect: DropShadow { effect: DropShadow {
@ -23,15 +25,19 @@ Rectangle {
property bool active: activeWindow ? activeWindow.activated ? true : false : false property bool active: activeWindow ? activeWindow.activated ? true : false : false
radius: Settings.config.rounding radius: Settings.config.rounding
color: active ? Colors.base02 : "transparent" color: active ? Colors.base02 : "transparent"
implicitHeight: Settings.config.barHeight / 1.5 implicitWidth: titleText.width + 40
implicitWidth: titleText.width + 14 implicitHeight: Settings.config.barHeight - margin * 2
child: Item {
RowLayout { RowLayout {
anchors.centerIn: parent anchors.centerIn: parent
CText { CText {
id: titleText id: titleText
Layout.maximumWidth: 300 Layout.maximumWidth: 250
text: root.activeWindow ? root.activeWindow.activated ? root.activeWindow.title : "" : "" text: root.activeWindow ? root.activeWindow.activated ? root.activeWindow.title : "" : ""
elide: Text.ElideRight // Allows wrapping elide: Text.ElideRight // Allows wrapping
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
} }
} }
Layout.alignment: Qt.AlignHCenter
}
} }

View File

@ -1,12 +1,14 @@
import Quickshell.Services.SystemTray import Quickshell.Services.SystemTray
import Quickshell.Widgets
import QtQuick import QtQuick
import Qt5Compat.GraphicalEffects import Qt5Compat.GraphicalEffects
import qs import qs
import qs.settings import qs.settings
import QtQuick.Layouts import QtQuick.Layouts
Rectangle { WrapperRectangle {
id: root id: root
margin: Settings.config.barmargins
layer { layer {
enabled: true enabled: true
effect: DropShadow { effect: DropShadow {
@ -18,17 +20,20 @@ Rectangle {
} }
} }
implicitWidth: trayRow.implicitWidth + 14 implicitWidth: trayRow.implicitWidth + 14
implicitHeight: Settings.config.barHeight / 1.5 implicitHeight: Settings.config.barHeight - margin * 2
visible: trayRep.count > 0 visible: trayRep.count > 0
color: Colors.base02 color: Colors.base02
radius: Settings.config.rounding radius: Settings.config.rounding
child: Item {
RowLayout { RowLayout {
id: trayRow id: trayRow
anchors.centerIn: parent anchors.centerIn: parent
Repeater { Repeater {
id: trayRep id: trayRep
Layout.alignment: Qt.AlignVCenter | Qt.AlignHCenter
model: SystemTray.items model: SystemTray.items
delegate: TrayItem {} delegate: TrayItem {}
} }
} }
}
} }

View File

@ -1,5 +1,6 @@
pragma ComponentBehavior: Bound pragma ComponentBehavior: Bound
import Quickshell import Quickshell
import Quickshell.Widgets
import Quickshell.Hyprland import Quickshell.Hyprland
import QtQuick import QtQuick
import Qt5Compat.GraphicalEffects import Qt5Compat.GraphicalEffects
@ -8,13 +9,16 @@ import qs
import qs.settings import qs.settings
import qs.widgets import qs.widgets
Rectangle { WrapperRectangle {
id: wsWrap id: wsWrap
margin: Settings.config.barmargins
leftMargin: margin * 2
required property ShellScreen barScreen required property ShellScreen barScreen
color: "transparent" color: "transparent"
radius: Settings.config.rounding radius: Settings.config.rounding
implicitWidth: wsLayout.implicitWidth + 6 implicitWidth: wsLayout.implicitWidth + 6
implicitHeight: wsLayout.implicitHeight + 6 implicitHeight: Settings.config.barHeight - margin * 2
child: Item {
RowLayout { RowLayout {
id: wsLayout id: wsLayout
spacing: 6 spacing: 6
@ -23,6 +27,7 @@ Rectangle {
id: wsRep id: wsRep
model: Hyprland.workspaces model: Hyprland.workspaces
delegate: Rectangle { delegate: Rectangle {
id: wsRect
layer { layer {
enabled: true enabled: true
effect: DropShadow { effect: DropShadow {
@ -33,9 +38,8 @@ Rectangle {
samples: 16 samples: 16
} }
} }
id: wsRect
implicitWidth: modelData.focused ? Settings.config.barHeight * 1.5 : Settings.config.barHeight / 2 + 10 implicitWidth: modelData.focused ? Settings.config.barHeight * 1.5 : Settings.config.barHeight / 2 + 10
implicitHeight: Settings.config.barHeight / 1.5 implicitHeight: Settings.config.barHeight - wsWrap.margin * 2
visible: modelData.id < 0 ? false : modelData.monitor?.name == wsWrap.barScreen.name visible: modelData.id < 0 ? false : modelData.monitor?.name == wsWrap.barScreen.name
required property var modelData required property var modelData
color: modelData.focused ? Colors.base0D : Colors.base02 color: modelData.focused ? Colors.base0D : Colors.base02
@ -68,4 +72,5 @@ Rectangle {
} }
} }
} }
}
} }

View File

@ -14,7 +14,7 @@ Rectangle {
implicitHeight: fullLayout.implicitHeight + 40 implicitHeight: fullLayout.implicitHeight + 40
color: dismissArea.containsMouse ? Colors.base02 : Colors.base00 color: dismissArea.containsMouse ? Colors.base02 : Colors.base00
radius: Settings.config.rounding radius: Settings.config.rounding
border.width: 0 border.width: 2
border.color: Colors.base0D border.color: Colors.base0D
Timer { Timer {
id: dismissTimer id: dismissTimer
@ -27,8 +27,9 @@ Rectangle {
RowLayout { RowLayout {
id: fullLayout id: fullLayout
anchors.margins: 10 anchors.margins: 20
anchors.fill: parent anchors.fill: parent
anchors.centerIn: parent
spacing: 10 spacing: 10
ClippingWrapperRectangle { ClippingWrapperRectangle {

View File

@ -24,6 +24,7 @@ Singleton {
property int margins property int margins
property var currentWall property var currentWall
property bool wallswitchershown property bool wallswitchershown
property int barmargins
} }
} }
} }

View File

@ -6,5 +6,6 @@
"fontSize": 12, "fontSize": 12,
"margins": 10, "margins": 10,
"rounding": 26, "rounding": 26,
"wallswitchershown": false "wallswitchershown": false,
"barmargins": 8
} }