Krolyxon
Commit 6a3e480

Branches

Refs →

aurora6a3e480

aurora: bar layout (horizontal/vertical) and floating pill settings, net and bt as separate blocks

Author
krolyxon
Date
2026-10-30 21:21 +0530
Parent
30f2770
Commit
6a3e4805d8ea4c2b2ece7f4dc96087bac585a135

+185 −90

13 files changed

Browse files Patch
−Context 3+
  1. M .config/quickshell/aurora/Bar.qml +86 −47
  2. M .config/quickshell/aurora/BarPill.qml +19 −12
  3. M .config/quickshell/aurora/CalPopup.qml +9 −4
  4. M .config/quickshell/aurora/ControlPanel.qml +1 −1
  5. M .config/quickshell/aurora/Desktop.qml +4 −3
  6. M .config/quickshell/aurora/NotifPopups.qml +1 −1
  7. M .config/quickshell/aurora/Overview.qml +2 −1
  8. M .config/quickshell/aurora/SetAppearance.qml +17 −2
  9. M .config/quickshell/aurora/SetIndex.qml +1 −1
  10. M .config/quickshell/aurora/Settings.qml +7 −1
  11. M .config/quickshell/aurora/Theme.qml +9 −2
  12. M .config/quickshell/aurora/Tray.qml +10 −6
  13. M .config/quickshell/aurora/Workspaces.qml +19 −9
M .config/quickshell/aurora/Bar.qml View
@@ -6,11 +6,14 @@ import Quickshell.Hyprland
66 import Quickshell.Services.Pipewire
77 import Quickshell.Services.UPower
88
9−// The bar: a strip docked at the top of every monitor.
10−// Left: the mark (a dotted ring: click = runner; its centre turns the live colour while something records or listens,
9+// The bar: a strip docked at the top of every monitor, or at the left edge (Settings.barLayout "vertical", like
10+// glyph-rice's; the groups are Grids that turn from rows into columns). Settings.barFloat: a rounded pill held off the
11+// screen edges (glyph's look) instead of a strip along the edge.
12+// Left / top: the mark (a dotted ring: click = runner; its centre turns the live colour while something records or listens,
1113 // the ring lights up in a wave on a new notification), this monitor's workspaces as dots, the cat.
12−// Centre: time · day (click = calendar). Right: tray, recording, privacy, caffeine/airplane, headset, volume,
13−// net + bt, battery. Clicks open the same panel tabs as always.
14+// Centre: time · day, or Doto hours over minutes over the day when vertical (click = calendar).
15+// Right / bottom: tray, recording, privacy, caffeine/airplane, headset, volume, net, bt, battery.
16+// Clicks open the same panel tabs as always.
1417 // After glyph-rice (github.com/Nebelung-cloud/glyph-rice, GPL-3.0), bar/Bar.qml.
1518 PanelWindow {
1619 id: bar
@@ -19,8 +22,10 @@ PanelWindow {
1922 signal togglePanel(string name, var scr)
2023 signal toggleOverlay(string name, var scr)
2124
22− anchors { top: true; left: true; right: true }
23− implicitHeight: Theme.barHeight
25+ readonly property bool vertical: Theme.barVertical
26+ anchors { top: true; left: true; right: !vertical; bottom: vertical }
27+ implicitHeight: vertical ? 0 : Theme.barSpan
28+ implicitWidth: vertical ? Theme.barSpan : 0
2429 color: "transparent"
2530 WlrLayershell.namespace: "aurora-bar"
2631
@@ -78,29 +83,39 @@ PanelWindow {
7883
7984 Rectangle {
8085 id: pill
81− anchors.fill: parent
86+ // floating: barGap off the screen edges, barInner (+ Hyprland's gaps_out) to the windows
87+ x: Theme.barGap
88+ y: Theme.barGap
89+ width: bar.vertical ? Theme.barSize : parent.width - 2 * Theme.barGap
90+ height: bar.vertical ? parent.height - 2 * Theme.barGap : Theme.barSize
91+ radius: Theme.barFloat ? Theme.barSize / 2 : 0
8292 color: Theme.fade(Theme.s1, Theme.barAlpha)
83− Rectangle { // hairline along the bottom
84− anchors.left: parent.left
85− anchors.right: parent.right
86− anchors.bottom: parent.bottom
87− height: 1
93+ border.width: Theme.barFloat ? 1 : 0
94+ border.color: Theme.s2
95+ Rectangle { // hairline along the bottom, or the right edge when vertical (the pill has a border instead)
96+ visible: !Theme.barFloat
97+ x: bar.vertical ? parent.width - 1 : 0
98+ y: bar.vertical ? 0 : parent.height - 1
99+ width: bar.vertical ? 1 : parent.width
100+ height: bar.vertical ? parent.height : 1
88101 color: Theme.s2
89102 }
90103
91− // ---------------- left ----------------
92− Row {
93− anchors.left: parent.left
94− anchors.leftMargin: Math.round(Theme.barSize * 0.25)
95− height: parent.height
104+ // ---------------- left / top ----------------
105+ Grid {
106+ x: bar.vertical ? (parent.width - width) / 2 : Math.round(Theme.barSize * 0.25)
107+ y: bar.vertical ? Math.round(Theme.barSize * 0.25) : 0
108+ height: bar.vertical ? implicitHeight : parent.height
109+ columns: bar.vertical ? 1 : 3 // only columns flips, see BarPill
96110 spacing: 14
111+ horizontalItemAlignment: Grid.AlignHCenter
112+ verticalItemAlignment: Grid.AlignVCenter
97113
98114 Item {
99115 id: mark
100116 readonly property real size: Math.round(Theme.barSize * 0.55)
101117 width: size
102118 height: size
103− anchors.verticalCenter: parent.verticalCenter
104119 Ring {
105120 anchors.fill: parent
106121 anchors.margins: 1.5
@@ -123,31 +138,52 @@ PanelWindow {
123138 onClicked: bar.toggleOverlay("runner", bar.modelData)
124139 }
125140 }
126− Workspaces { height: parent.height; monitor: bar.hmon }
127− CatLoop { height: parent.height }
141+ Workspaces { monitor: bar.hmon }
142+ CatLoop { height: bar.vertical ? 24 : Theme.barSize }
128143 }
129144
130145 // ---------------- center: time · day, one line (click = calendar) ----------------
131146 BarPill {
147+ visible: !bar.vertical
132148 anchors.centerIn: parent
133− height: parent.height
134149 text: Theme.hh(clock.date) + ":" + Qt.formatDateTime(clock.date, "mm") + " · " + Qt.locale("en_US").toString(clock.date, "ddd d")
135150 onActivated: bar.toggleOverlay("cal", bar.modelData)
136151 }
152+ // vertical: hours over minutes in Doto, the day under them
153+ BarPill {
154+ visible: bar.vertical
155+ anchors.centerIn: parent
156+ onActivated: bar.toggleOverlay("cal", bar.modelData)
157+ Column {
158+ readonly property int px: Math.max(26, Math.round(Theme.barSize * 0.5))
159+ Num { anchors.horizontalCenter: parent.horizontalCenter; text: Theme.hh(clock.date); font.pixelSize: parent.px }
160+ Num { anchors.horizontalCenter: parent.horizontalCenter; text: Qt.formatDateTime(clock.date, "mm"); font.pixelSize: parent.px }
161+ Lb {
162+ anchors.horizontalCenter: parent.horizontalCenter
163+ topPadding: 6
164+ text: Qt.locale("en_US").toString(clock.date, "ddd d")
165+ px: 10
166+ }
167+ }
168+ }
137169
138− // ---------------- right ----------------
139− Row {
140− anchors.right: parent.right
141− anchors.rightMargin: 6
142− height: parent.height
143− spacing: 0
170+ // ---------------- right / bottom ----------------
171+ Grid {
172+ x: bar.vertical ? 0 : parent.width - width - (Theme.barFloat ? 10 : 6)
173+ y: bar.vertical ? parent.height - height - (Theme.barFloat ? 12 : 8) : 0
174+ width: bar.vertical ? parent.width : implicitWidth
175+ height: bar.vertical ? implicitHeight : parent.height
176+ columns: bar.vertical ? 1 : Math.max(1, visibleChildren.length) // see BarPill
177+ spacing: bar.vertical ? 2 : 0
178+ horizontalItemAlignment: Grid.AlignHCenter
179+ verticalItemAlignment: Grid.AlignVCenter
144180
145181 Tray { show: bar.monFocused }
146182
147183 BarPill { // click to stop recording / cancel the area selection
148184 visible: Rec.busy
149185 icon: Theme.iStop
150− text: Rec.running ? "rec " + Theme.fmtClock(Rec.elapsed) : "select area"
186+ text: Rec.running ? (bar.vertical ? "" : "rec ") + Theme.fmtClock(Rec.elapsed) : (bar.vertical ? "" : "select area")
151187 tint: Theme.live
152188 onActivated: Rec.stop()
153189 }
@@ -156,28 +192,29 @@ PanelWindow {
156192 BarPill {
157193 visible: bar.monFocused && Privacy.mic
158194 icon: bar.mic && bar.mic.muted ? Theme.iMicOff : Theme.iMic
159− text: Privacy.micApps.join(", ")
195+ text: bar.vertical ? "" : Privacy.micApps.join(", ")
160196 tint: bar.mic && bar.mic.muted ? Theme.grey : Theme.live
161197 onActivated: if (bar.mic) bar.mic.muted = !bar.mic.muted
162198 }
163199 BarPill {
164200 visible: bar.monFocused && Privacy.cam
165201 icon: Theme.iWebcam
166− text: Privacy.camApps.join(", ")
202+ text: bar.vertical ? "" : Privacy.camApps.join(", ")
167203 tint: Theme.live
168204 }
169205 BarPill {
170206 visible: bar.monFocused && Privacy.screen
171207 icon: Theme.iCast
172− text: Privacy.shareApps.join(", ")
208+ text: bar.vertical ? "" : Privacy.shareApps.join(", ")
173209 tint: Theme.live
174210 }
175211
176212 BarPill {
177213 visible: Toggles.caffeine || Toggles.airplane
178− icon: (Toggles.caffeine ? Theme.iCoffee : "") + (Toggles.caffeine && Toggles.airplane ? " " : "")
179− + (Toggles.airplane ? Theme.iPlane : "")
214+ icon: Toggles.caffeine ? Theme.iCoffee : Theme.iPlane
215+ icon2: Toggles.caffeine && Toggles.airplane ? Theme.iPlane : ""
180216 onActivated: bar.togglePanel("home", bar.modelData)
217+ onActivated2: bar.togglePanel("home", bar.modelData)
181218 }
182219
183220 BarPill {
@@ -205,18 +242,21 @@ PanelWindow {
205242 }
206243 }
207244
208− // net + bt share one block: click the left icon for the net tab, the right one for bt
209245 BarPill {
210246 icon: Net.wired && !(Net.wifiEnabled && Net.connected !== "") ? Net.wiredIcon
211247 : (Net.wifiEnabled ? Theme.wifiIcon(Net.connected !== "" ? Net.activeSignal : 0) : Theme.iWifiOff)
212248 tint: Net.portal ? Theme.live : ((Net.wired || (Net.wifiEnabled && Net.connected !== "")) ? Theme.fg : Theme.grey)
213− icon2: bar.adapter === null ? "" : (!bar.btOn ? Theme.iBtOff : (bar.btLink ? Theme.iBtConn : Theme.iBt))
214− tint2: bar.btLink ? Theme.fg : Theme.grey
215249 onActivated: bar.togglePanel("net", bar.modelData)
216− onActivated2: bar.togglePanel("bt", bar.modelData)
250+ }
251+ BarPill {
252+ visible: bar.adapter !== null
253+ icon: !bar.btOn ? Theme.iBtOff : (bar.btLink ? Theme.iBtConn : Theme.iBt)
254+ tint: bar.btLink ? Theme.fg : Theme.grey
255+ onActivated: bar.togglePanel("bt", bar.modelData)
217256 }
218257
219− // battery: a capsule that fills up, the error colour when low, a bolt + breathing fill while charging
258+ // battery: a capsule that fills up (standing, from the bottom, when vertical), the error colour when low,
259+ // a bolt + breathing fill while charging
220260 BarPill {
221261 id: batt
222262 visible: bar.hasBat
@@ -233,25 +273,24 @@ PanelWindow {
233273 onRunningChanged: batt.phase = 0
234274 }
235275 Rectangle {
236− anchors.verticalCenter: parent.verticalCenter
237− width: 26
238− height: 13
239− radius: height / 2
276+ width: bar.vertical ? 13 : 26
277+ height: bar.vertical ? 26 : 13
278+ radius: Math.min(width, height) / 2
240279 color: "transparent"
241280 border.width: 1.5
242281 border.color: bar.batLow ? Theme.err : Theme.grey
243282 Rectangle {
283+ readonly property real fill: Math.max(3, ((bar.vertical ? parent.height : parent.width) - 6) * bar.batPct)
244284 x: 3
245− anchors.verticalCenter: parent.verticalCenter
246− width: Math.max(3, (parent.width - 6) * bar.batPct)
247− height: parent.height - 6
248− radius: height / 2
285+ y: bar.vertical ? parent.height - 3 - height : 3
286+ width: bar.vertical ? parent.width - 6 : fill
287+ height: bar.vertical ? fill : parent.height - 6
288+ radius: Math.min(width, height) / 2
249289 color: bar.batLow ? Theme.err : Theme.fill
250290 opacity: batt.pulse
251291 }
252292 }
253293 Lb {
254− anchors.verticalCenter: parent.verticalCenter
255294 text: Math.round(bar.batPct * 100)
256295 px: 11
257296 color: bar.batLow ? Theme.err : Theme.fg
M .config/quickshell/aurora/BarPill.qml View
@@ -1,7 +1,8 @@
11 import QtQuick
22
33 // One block of the bar: icon, caps label, optional second icon with its own click (activated2), anything else declared
4−// inside goes after them (the battery capsule, the clock). Hover = a rounded highlight.
4+// inside goes after them (the battery capsule, the clock). Side by side in the top bar, stacked in the vertical one.
5+// Hover = a rounded highlight.
56 Item {
67 id: p
78 property string icon: ""
@@ -10,35 +11,41 @@ Item {
1011 property color underline: "transparent" // old style, unused
1112 property string icon2: ""
1213 property color tint2: Theme.fg
14+ property bool vertical: Theme.barVertical
1315 default property alias extra: row.data
1416 signal activated(int button)
1517 signal activated2(int button)
1618 signal scrolled(int dir)
1719
18− implicitWidth: row.implicitWidth + 22
19− implicitHeight: parent ? parent.height : Theme.barSize
20+ implicitWidth: vertical ? Theme.barSize : row.implicitWidth + 22
21+ implicitHeight: vertical ? row.implicitHeight + 16 : Theme.barSize
2022
2123 Rectangle {
2224 anchors.fill: parent
23− anchors.topMargin: 5
24− anchors.bottomMargin: 5
25− radius: height / 2
25+ anchors.topMargin: p.vertical ? 0 : 5
26+ anchors.bottomMargin: p.vertical ? 0 : 5
27+ anchors.leftMargin: p.vertical ? 5 : 0
28+ anchors.rightMargin: p.vertical ? 5 : 0
29+ radius: Math.min(width, height) / 2
2630 color: m.containsMouse ? Theme.s2 : "transparent"
2731 }
28− Row {
32+ // a row, or a column in the vertical bar. Only `columns` flips (rows and columns both changing pass through 1x1 and
33+ // warn), and it must match the shown items exactly: Grid leaves a gap for every empty column.
34+ Grid {
2935 id: row
3036 anchors.centerIn: parent
31− spacing: 7
37+ columns: p.vertical ? 1 : Math.max(1, visibleChildren.length)
38+ spacing: p.vertical ? 5 : 7
39+ horizontalItemAlignment: Grid.AlignHCenter
40+ verticalItemAlignment: Grid.AlignVCenter
3241 Icon {
3342 visible: p.icon !== ""
34− anchors.verticalCenter: parent.verticalCenter
3543 text: p.icon
3644 font.pixelSize: 16
3745 color: p.tint
3846 }
3947 Lb {
4048 visible: p.text !== ""
41− anchors.verticalCenter: parent.verticalCenter
4249 text: p.text
4350 px: 11
4451 color: p.tint
@@ -46,7 +53,6 @@ Item {
4653 Icon {
4754 id: second
4855 visible: p.icon2 !== ""
49− anchors.verticalCenter: parent.verticalCenter
5056 text: p.icon2
5157 font.pixelSize: 16
5258 color: p.tint2
@@ -60,7 +66,8 @@ Item {
6066 acceptedButtons: Qt.LeftButton | Qt.RightButton | Qt.MiddleButton
6167 onClicked: mouse => {
6268 // split at the middle of the gap before the second icon
63− if (second.visible && mouse.x >= row.x + second.x - row.spacing / 2) p.activated2(mouse.button)
69+ var at = p.vertical ? mouse.y - row.y - second.y : mouse.x - row.x - second.x
70+ if (second.visible && at >= -row.spacing / 2) p.activated2(mouse.button)
6471 else p.activated(mouse.button)
6572 }
6673 onWheel: w => p.scrolled(w.angleDelta.y > 0 ? 1 : -1)
M .config/quickshell/aurora/CalPopup.qml View
@@ -18,10 +18,14 @@ PanelWindow {
1818 Behavior on t { NumberAnimation { duration: Theme.t; easing.type: Easing.BezierSpline; easing.bezierCurve: Theme.glide } }
1919
2020 visible: t > 0
21− anchors.top: true
21+ // under the clock: top centre, or next to it (left edge, centred) when the bar is vertical
22+ readonly property bool side: Theme.barVertical
23+ anchors.top: !side
24+ anchors.left: side
2225 margins.top: 6
23− implicitWidth: card.width
24− implicitHeight: card.height + 20 // room for the slide
26+ margins.left: 8
27+ implicitWidth: card.width + (side ? 20 : 0) // room for the slide
28+ implicitHeight: card.height + (side ? 0 : 20)
2529 exclusiveZone: 0
2630 color: "transparent"
2731 mask: Region { item: card }
@@ -88,7 +92,8 @@ PanelWindow {
8892
8993 Rectangle {
9094 id: card
91− y: -16 * (1 - win.t)
95+ x: win.side ? -16 * (1 - win.t) : 0
96+ y: win.side ? 0 : -16 * (1 - win.t)
9297 opacity: win.t
9398 width: row.width + 52
9499 height: row.height + 48
M .config/quickshell/aurora/ControlPanel.qml View
@@ -22,7 +22,7 @@ PanelWindow {
2222
2323 visible: t > 0
2424 anchors { top: true; right: true; bottom: true }
25− margins { top: 6; right: 8; bottom: 8 } // sits just under the bar (bar's exclusive zone is respected)
25+ margins { top: Theme.barTop ? 6 : 8; right: 8; bottom: 8 } // sits just under the bar (bar's exclusive zone is respected)
2626 implicitWidth: card.width + 24 // room for the slide
2727 exclusiveZone: 0
2828 color: "transparent"
M .config/quickshell/aurora/Desktop.qml View
@@ -33,8 +33,8 @@ PanelWindow {
3333
3434 Column {
3535 visible: win.showClock
36− x: 56
37− y: Theme.barHeight + 48
36+ x: Theme.barLeft + 56
37+ y: Theme.barTop + 48
3838 spacing: 2
3939
4040 Row {
@@ -87,9 +87,10 @@ PanelWindow {
8787 anchors.bottom: parent.bottom
8888 anchors.bottomMargin: 18
8989 anchors.horizontalCenter: parent.horizontalCenter
90+ anchors.horizontalCenterOffset: Theme.barLeft / 2 // not under a vertical bar
9091 readonly property int rows: 14
9192 readonly property real d: 6
92− readonly property real gap: Math.max(2, (win.width - 72) / Cava.bars - d)
93+ readonly property real gap: Math.max(2, (win.width - Theme.barLeft - 72) / Cava.bars - d)
9394 spacing: gap
9495 Repeater {
9596 model: Cava.bars
M .config/quickshell/aurora/NotifPopups.qml View
@@ -15,7 +15,7 @@ PanelWindow {
1515
1616 visible: stack.count > 0 && !suppressed
1717 anchors.top: true
18− margins.top: 6
18+ margins.top: Theme.barTop ? 6 : 8
1919 implicitWidth: cardW
2020 implicitHeight: 4 * 160 + 20 // fixed; only the cards take input (mask)
2121 exclusiveZone: 0
M .config/quickshell/aurora/Overview.qml View
@@ -80,7 +80,8 @@ PanelWindow {
8080 ColumnLayout {
8181 anchors.fill: parent
8282 anchors.margins: 40
83− anchors.topMargin: Theme.barHeight + 24
83+ anchors.topMargin: Math.max(40, Theme.barTop + 24)
84+ anchors.leftMargin: Math.max(40, Theme.barLeft + 24)
8485 spacing: 16
8586
8687 RowLayout {
M .config/quickshell/aurora/SetAppearance.qml View
@@ -119,8 +119,23 @@ Flickable {
119119 }
120120 Knob { label: "contrast"; keywords: "colours colors"; from: -1; to: 1; decimals: 2; value: Settings.matuContrast; onMoved: v => Settings.matuContrast = v }
121121
122− SectionLabel { text: "sizes" }
123− Knob { label: "bar height"; keywords: "top bar size"; from: 32; to: 56; value: Settings.barSize; onMoved: v => Settings.barSize = v }
122+ SectionLabel { text: "bar"; keywords: "status bar sizes" }
123+ Choice {
124+ label: "bar layout"
125+ keywords: "vertical horizontal orientation side left top position"
126+ options: [{ value: "horizontal", label: "horizontal" }, { value: "vertical", label: "vertical" }]
127+ value: Settings.barLayout
128+ onPicked: v => Settings.barLayout = v
129+ }
130+ Choice {
131+ label: "bar shape"
132+ keywords: "floating pill attached edge strip rounded"
133+ options: [{ value: false, label: "attached" }, { value: true, label: "floating pill" }]
134+ value: Settings.barFloat
135+ onPicked: v => Settings.barFloat = v
136+ }
137+ Knob { visible: !Theme.barVertical; label: "bar height"; keywords: "top bar size"; from: 32; to: 56; value: Settings.barSize; onMoved: v => Settings.barSize = v }
138+ Knob { visible: Theme.barVertical; label: "bar width"; keywords: "vertical side bar size"; from: 48; to: 80; value: Settings.barWidth; onMoved: v => Settings.barWidth = v }
124139
125140 SectionLabel { text: "transparency"; keywords: "transparent opacity alpha translucent" }
126141 Knob { label: "bar opacity"; keywords: "transparent"; from: 0.3; to: 1; decimals: 2; value: Settings.barAlpha; onMoved: v => Settings.barAlpha = v }
M .config/quickshell/aurora/SetIndex.qml View
@@ -18,7 +18,7 @@ Singleton {
1818 { id: "bluetooth", word: "bluetooth", caption: "bluetooth · devices, pairing", files: ["BtPage.qml"], keywords: "bt" },
1919 { id: "sound", word: "sound", caption: "sound · levels, devices, apps", files: ["AudioPage.qml"],
2020 keywords: "audio volume speakers microphone" },
21− { id: "appearance", word: "look", caption: "look · wallpaper, home screen, colours, sizes", files: ["SetAppearance.qml"],
21+ { id: "appearance", word: "look", caption: "look · wallpaper, home screen, colours, bar", files: ["SetAppearance.qml"],
2222 keywords: "appearance theme style" },
2323 { id: "shell", word: "shell", caption: "shell · home screen, dock, osd, notifications", files: ["SetShell.qml"],
2424 keywords: "aurora" },
M .config/quickshell/aurora/Settings.qml View
@@ -18,7 +18,7 @@ Singleton {
1818 idleDim: 150, idleOff: 330, idleLock: 600, idleSuspend: 0, charTone: 0, portalAutoOpen: true,
1919 chargeMode: "off", batLow: 15, batCritical: 5, batCriticalAction: "none",
2020 privacyIndicators: true, powerAuto: false, powerAc: "balanced", powerBat: "saver",
21− motion: true, clock24: true, appIcons: "dots", barSize: 40,
21+ motion: true, clock24: true, appIcons: "dots", barSize: 40, barLayout: "horizontal", barWidth: 56, barFloat: false,
2222 wallLook: "dots", wallPitch: 10, wallBright: 85, dotGrid: true,
2323 blink: true, weatherLoc: ""
2424 })
@@ -54,6 +54,9 @@ Singleton {
5454 property alias clock24: a.clock24
5555 property alias appIcons: a.appIcons
5656 property alias barSize: a.barSize
57+ property alias barLayout: a.barLayout
58+ property alias barWidth: a.barWidth
59+ property alias barFloat: a.barFloat
5760 property alias wallLook: a.wallLook
5861 property alias wallPitch: a.wallPitch
5962 property alias wallBright: a.wallBright
@@ -115,6 +118,9 @@ Singleton {
115118 property bool clock24: true
116119 property string appIcons: "dots" // dots | mono | colour: how app icons are drawn
117120 property int barSize: 40 // height of the bar (Doto clock from 40 up)
121+ property string barLayout: "horizontal" // horizontal (top edge) | vertical (left edge)
122+ property int barWidth: 56 // width of the vertical bar
123+ property bool barFloat: false // a rounded pill held off the screen edges (glyph-rice) instead of a strip
118124 property string wallLook: "dots" // dots | colour | photo: how aurora draws the wallpaper (WallView)
119125 property int wallPitch: 10 // dot step, px
120126 property int wallBright: 85 // %, from the background to the full image
M .config/quickshell/aurora/Theme.qml View
@@ -16,8 +16,15 @@ Singleton {
1616
1717 // ---- knobs (persisted in ~/.config/aurora/settings.json, edited in the settings app) ----
1818 readonly property real panelAlpha: Settings.panelAlpha
19− readonly property int barSize: Math.max(32, Settings.barSize) // the bar's height (docked at the top)
20− readonly property int barHeight: barSize // what the bar reserves at the top
19+ readonly property bool barVertical: Settings.barLayout === "vertical" // docked at the left edge instead of the top
20+ readonly property int barSize: barVertical ? Math.max(48, Settings.barWidth) : Math.max(32, Settings.barSize) // its thickness
21+ readonly property bool barFloat: Settings.barFloat // a floating pill instead of a strip along the edge
22+ readonly property int barGap: barFloat ? 14 : 0 // the pill's distance from the screen edges (glyph-rice)
23+ // ... and from the windows: glyph's 14 too, there it is Hyprland's gaps_out; here only the part gaps_out doesn't cover
24+ readonly property int barInner: barFloat ? Math.max(0, barGap - (HyprConf.values["general:gaps_out"] || 0)) : 0
25+ readonly property int barSpan: barSize + barGap + barInner // the bar window, across the bar
26+ readonly property int barTop: barVertical ? 0 : barSpan // what the bar reserves at the top
27+ readonly property int barLeft: barVertical ? barSpan : 0 // ... and at the left
2128 readonly property real barAlpha: Settings.barAlpha
2229
2330 // ---- motion: ease-out-quart without overshoot (glyph's "glide"); Settings.motion off = instant ----
M .config/quickshell/aurora/Tray.qml View
@@ -3,29 +3,33 @@ import QtQuick.Effects
33 import Quickshell
44 import Quickshell.Services.SystemTray
55
6−// Tray icons in the bar; monochrome unless Settings.appIcons is "colour" (dots are too coarse at this size).
6+// Tray icons in the bar (a row, or a column in the vertical bar); monochrome unless Settings.appIcons is "colour"
7+// (dots are too coarse at this size).
78 Item {
89 id: tray
910 property bool show: true
11+ property bool vertical: Theme.barVertical
1012 visible: show && SystemTray.items.values.length > 0
11− implicitWidth: row.implicitWidth + 22
12− implicitHeight: parent ? parent.height : Theme.barSize
13+ implicitWidth: vertical ? Theme.barSize : row.implicitWidth + 22
14+ implicitHeight: vertical ? row.implicitHeight + 22 : Theme.barSize
1315
14− Row {
16+ Grid {
1517 id: row
1618 anchors.centerIn: parent
19+ columns: tray.vertical ? 1 : Math.max(1, rep.count) // only columns flips, see BarPill
1720 spacing: 12
1821 Repeater {
22+ id: rep
1923 model: SystemTray.items
2024 delegate: Item {
2125 id: it
2226 required property var modelData
2327 width: 16
2428 height: 16
25− anchors.verticalCenter: parent.verticalCenter
2629
30+ // under the icon, or beside it in the vertical bar
2731 function openMenu() {
28− var p = it.mapToItem(null, 0, it.height + 10)
32+ var p = tray.vertical ? it.mapToItem(null, it.width + 14, 0) : it.mapToItem(null, 0, it.height + 10)
2933 modelData.display(QsWindow.window, p.x, p.y)
3034 }
3135 Image {
M .config/quickshell/aurora/Workspaces.qml View
@@ -3,14 +3,18 @@ import Quickshell.Hyprland
33
44 // This monitor's 10 workspaces as dots (split-monitor-workspaces: monitor 1 owns 1-10, monitor 2 11-20, ...; the block
55 // comes from the monitor's own active workspace, so it works without the plugin too).
6−// Active = a wide pill (primary on the focused monitor, grey on the others), occupied = grey dot, empty = dim dot,
6+// A row, or a column in the vertical bar. Active = a long pill (primary on the focused monitor, grey on the others),
7+// occupied = grey dot, empty = dim dot,
78 // urgent = the live colour. Click = go there, wheel = the next / previous occupied one.
89 // After glyph-rice (github.com/Nebelung-cloud/glyph-rice, GPL-3.0), bar/Bar.qml.
9−Row {
10+Grid {
1011 id: ws
1112 spacing: 6
13+ columns: vertical ? 1 : list.length // only columns flips, see BarPill
1214
1315 property var monitor: null // HyprlandMonitor of the bar this sits in
16+ property bool vertical: Theme.barVertical
17+ property real thick: Theme.barSize // each dot's cell across the bar (its click area)
1418
1519 readonly property var activeWs: monitor ? monitor.activeWorkspace : null
1620 readonly property int offset: activeWs && activeWs.id > 0 ? Math.floor((activeWs.id - 1) / 10) * 10 : 0
@@ -42,14 +46,14 @@ Row {
4246 readonly property bool occupied: obj !== null && obj.toplevels.values.length > 0
4347 readonly property bool urgent: obj !== null && obj.urgent
4448
45− width: dot.width
46− height: ws.height
49+ width: ws.vertical ? ws.thick : dot.width
50+ height: ws.vertical ? dot.height : ws.thick
4751
4852 Rectangle {
4953 id: dot
50− anchors.verticalCenter: parent.verticalCenter
51− width: b.active ? 26 : 8
52− height: 8
54+ anchors.centerIn: parent
55+ width: b.active && !ws.vertical ? 26 : 8
56+ height: b.active && ws.vertical ? 26 : 8
5357 radius: 4
5458 color: b.urgent && !b.active ? Theme.live
5559 : b.active ? (ws.monFocused ? Theme.fill : Theme.grey)
@@ -59,13 +63,19 @@ Row {
5963 enabled: Theme.motion
6064 NumberAnimation { duration: Theme.t; easing.type: Easing.BezierSpline; easing.bezierCurve: Theme.glide }
6165 }
66+ Behavior on height {
67+ enabled: Theme.motion
68+ NumberAnimation { duration: Theme.t; easing.type: Easing.BezierSpline; easing.bezierCurve: Theme.glide }
69+ }
6270 Behavior on color { enabled: Theme.motion; ColorAnimation { duration: Theme.t } }
6371 }
6472 MouseArea {
6573 id: m
6674 anchors.fill: parent
67− anchors.leftMargin: -3
68− anchors.rightMargin: -3
75+ anchors.leftMargin: ws.vertical ? 0 : -3
76+ anchors.rightMargin: ws.vertical ? 0 : -3
77+ anchors.topMargin: ws.vertical ? -3 : 0
78+ anchors.bottomMargin: ws.vertical ? -3 : 0
6979 hoverEnabled: true
7080 cursorShape: Qt.PointingHandCursor
7181 onClicked: Hypr.workspace(b.modelData)