mirror of
https://github.com/prdlk/omarchy-beeper.git
synced 2026-11-02 13:12:48 +00:00
feat(ui): use font-based iconSize and refine stroke calculation
This commit is contained in:
1 parent
40b2445c50
commit
34941367d7
2 files changed
+14
-4
No files matched your search
+14
-3
@@ -5,11 +5,20 @@ import qs.Commons
|
|||||||
// Chat bubble: rounded outline with a tail, and three dots that fade in when
|
// Chat bubble: rounded outline with a tail, and three dots that fade in when
|
||||||
// something is unread. Stroke, not a filled blob, so the silhouette keeps
|
// something is unread. Stroke, not a filled blob, so the silhouette keeps
|
||||||
// contrast on a transparent bar over light, dark, or mixed wallpapers.
|
// contrast on a transparent bar over light, dark, or mixed wallpapers.
|
||||||
// Every painted extent stays inside the optical canvas at every dot pose.
|
// Every painted extent stays inside `iconSize` at every dot pose.
|
||||||
|
//
|
||||||
|
// `iconSize` is the *ink* box, not the bar's icon slot. Neighbouring bar
|
||||||
|
// icons are Nerd Font glyphs drawn at Style.bar.iconFont inside the wider
|
||||||
|
// Style.bar.iconCanvas slot, so their ink is a fraction of the slot, never
|
||||||
|
// the whole of it. Measured off the running bar (VictorMono Nerd Font,
|
||||||
|
// iconFont 13, scale 2): those glyphs ink 9.0-11.5 logical px, median 10,
|
||||||
|
// with a 1 logical px stroke. 0.85 em lands the bubble on that median;
|
||||||
|
// painting edge to edge on the 16 px canvas made it 15 px with a 2 px
|
||||||
|
// stroke, half again as large as everything beside it.
|
||||||
Item {
|
Item {
|
||||||
id: root
|
id: root
|
||||||
|
|
||||||
property real iconSize: Style.bar.iconCanvas
|
property real iconSize: Style.bar.iconFont * 0.85
|
||||||
property color color: Color.foreground
|
property color color: Color.foreground
|
||||||
property color dotColor: color
|
property color dotColor: color
|
||||||
property bool hasMail: false
|
property bool hasMail: false
|
||||||
@@ -32,7 +41,9 @@ Item {
|
|||||||
return Math.max(1, Math.round(v * root.dpr)) / root.dpr
|
return Math.max(1, Math.round(v * root.dpr)) / root.dpr
|
||||||
}
|
}
|
||||||
|
|
||||||
readonly property real stroke: snapStroke(Math.max(1.5, iconSize * 0.11))
|
// snapStroke already floors the stroke at one device pixel, which is what
|
||||||
|
// the glyphs beside it use; a logical-pixel floor would double it on HiDPI.
|
||||||
|
readonly property real stroke: snapStroke(iconSize * 0.11)
|
||||||
readonly property real pad: snap(Math.max(stroke / 2, 0.5))
|
readonly property real pad: snap(Math.max(stroke / 2, 0.5))
|
||||||
|
|
||||||
readonly property real tailH: snap(Math.max(stroke * 1.2, iconSize * 0.16))
|
readonly property real tailH: snap(Math.max(stroke * 1.2, iconSize * 0.16))
|
||||||
|
|||||||
@@ -390,7 +390,6 @@ Panel {
|
|||||||
|
|
||||||
BeeperIcon {
|
BeeperIcon {
|
||||||
anchors.verticalCenter: parent.verticalCenter
|
anchors.verticalCenter: parent.verticalCenter
|
||||||
iconSize: Style.bar.iconCanvas
|
|
||||||
color: button.foreground
|
color: button.foreground
|
||||||
dotColor: button.foreground
|
dotColor: button.foreground
|
||||||
hasMail: root.hasUnread && root.reachable
|
hasMail: root.hasUnread && root.reachable
|
||||||
|
|||||||
Reference in new issue
Block a user