internal: use icon os logo instead of nerd font

Add caelestia logo to use as fallback os logo
Add recolour lock fetch logo option
This commit is contained in:
2 * r + 2 * t 2025-08-13 23:03:23 +10:00
parent a10054db21
commit 7c0f5533e1
8 changed files with 151 additions and 83 deletions

View file

@ -194,6 +194,9 @@ All configuration options are in `~/.config/caelestia/shell.json`.
}
},
"background": {
"desktopClock": {
"enabled": false
},
"enabled": true
},
"bar": {
@ -285,7 +288,7 @@ All configuration options are in `~/.config/caelestia/shell.json`.
}
},
"lock": {
"maxNotifs": 5
"recolourLogo": false
},
"notifs": {
"actionOnClick": false,

80
assets/logo.svg Normal file
View file

@ -0,0 +1,80 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
width="32"
height="32"
viewBox="0 0 32 32"
version="1.1"
id="svg1"
inkscape:export-filename="logo.svg"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<sodipodi:namedview
id="namedview1"
pagecolor="#ffffff"
bordercolor="#000000"
borderopacity="0.25"
inkscape:showpageshadow="2"
inkscape:pageopacity="0.0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="px"
showguides="true">
<inkscape:page
x="0"
y="0"
width="32"
height="32"
id="page2"
margin="0"
bleed="0" />
</sodipodi:namedview>
<defs
id="defs1" />
<g
inkscape:label="Layer 1"
inkscape:groupmode="layer"
id="layer1">
<g
id="g27"
style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0.5;stroke-dasharray:none;stroke-opacity:1">
<g
id="g120"
style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0.39799;stroke-dasharray:none;stroke-opacity:1"
transform="matrix(1.2563133,0,0,1.2563133,-3.8901453,-4.2534157)">
<path
style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0.39799;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
d="m 20.024092,13.797643 c 5.47,1.72 3.637949,9.84999 -2.003111,11.839946 -6.229996,2.19771 -10.467982,-0.0805 -10.467982,-0.0805 5.786947,4.075289 12.5354,2.977619 16.377338,-0.558406 4.37927,-4.030571 3.747629,-12.313964 -0.896376,-14.76628 -6.135656,-3.239997 -10.749869,1.68524 -9.329869,5.57524 -0.42,-1.59 0.525599,-4.614534 3.531223,-4.803537 1.970434,-0.123907 3.044017,1.457686 2.788777,2.793537 z"
id="path3-4"
sodipodi:nodetypes="cscsscsc" />
<circle
style="fill:#000000;fill-opacity:1;stroke:#000000;stroke-width:0.79598;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
id="path5-9-0"
cx="14.427957"
cy="18.542208"
r="1" />
</g>
<g
id="g120-3"
style="fill:#808080;fill-opacity:1;stroke:#808080;stroke-width:0.39799;stroke-dasharray:none;stroke-opacity:1"
transform="matrix(-1.2563133,0,0,-1.2563133,35.933366,36.359532)">
<path
style="fill:#808080;fill-opacity:1;stroke:#808080;stroke-width:0.39799;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
d="m 20.024092,13.797643 c 5.47,1.72 3.637949,9.84999 -2.003111,11.839946 -6.229996,2.19771 -10.467982,-0.0805 -10.467982,-0.0805 5.786947,4.075289 12.5354,2.977619 16.377338,-0.558406 4.37927,-4.030571 3.747629,-12.313964 -0.896376,-14.76628 -6.135656,-3.239997 -10.749869,1.68524 -9.329869,5.57524 -0.42,-1.59 0.525599,-4.614534 3.531223,-4.803537 1.970434,-0.123907 3.044017,1.457686 2.788777,2.793537 z"
id="path3-4-2"
sodipodi:nodetypes="cscsscsc" />
<circle
style="fill:#808080;fill-opacity:1;stroke:#808080;stroke-width:0.79598;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
id="path5-9-0-0"
cx="14.427957"
cy="18.542208"
r="1" />
</g>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 3.5 KiB

View file

@ -1,7 +1,7 @@
import Quickshell.Io
JsonObject {
property int maxNotifs: 5
property bool recolourLogo: false
property Sizes sizes: Sizes {}
component Sizes: JsonObject {

View file

@ -1,11 +1,15 @@
import qs.components
import qs.components.effects
import qs.services
import qs.utils
import qs.config
import Quickshell.Widgets
StyledText {
text: SysInfo.osIcon
font.pointSize: Appearance.font.size.smaller
font.family: Appearance.font.family.mono
color: Colours.palette.m3tertiary
IconImage {
source: SysInfo.osLogo
implicitSize: Appearance.font.size.large * 1.2
layer.enabled: true
layer.effect: Colouriser {
colorizationColor: Colours.palette.m3tertiary
}
}

View file

@ -1,9 +1,11 @@
import qs.components
import qs.components.effects
import qs.components.images
import qs.services
import qs.config
import qs.utils
import Quickshell
import Quickshell.Widgets
import QtQuick
Row {
@ -111,11 +113,39 @@ Row {
anchors.verticalCenter: parent.verticalCenter
spacing: Appearance.spacing.normal
InfoLine {
icon: SysInfo.osIcon
text: SysInfo.osPrettyName || SysInfo.osName
colour: Colours.palette.m3primary
materialIcon: false
Item {
id: line
implicitWidth: icon.implicitWidth + text.width + text.anchors.leftMargin
implicitHeight: Math.max(icon.implicitHeight, text.implicitHeight)
IconImage {
id: icon
anchors.left: parent.left
anchors.leftMargin: (Config.dashboard.sizes.infoIconSize - implicitWidth) / 2
source: SysInfo.osLogo
implicitSize: Math.floor(Appearance.font.size.normal * 1.34)
layer.enabled: true
layer.effect: Colouriser {
colorizationColor: Colours.palette.m3primary
}
}
StyledText {
id: text
anchors.verticalCenter: icon.verticalCenter
anchors.left: icon.right
anchors.leftMargin: icon.anchors.leftMargin
text: `: ${SysInfo.osPrettyName || SysInfo.osName}`
font.pointSize: Appearance.font.size.normal
width: Config.dashboard.sizes.infoWidth
elide: Text.ElideRight
}
}
InfoLine {
@ -139,7 +169,6 @@ Row {
required property string icon
required property string text
required property color colour
property bool materialIcon: true
implicitWidth: icon.implicitWidth + text.width + text.anchors.leftMargin
implicitHeight: Math.max(icon.implicitHeight, text.implicitHeight)
@ -154,7 +183,6 @@ Row {
text: line.icon
color: line.colour
font.pointSize: Appearance.font.size.normal
font.family: line.materialIcon ? Appearance.font.family.material : Appearance.font.family.sans
}
StyledText {

View file

@ -1,10 +1,11 @@
pragma ComponentBehavior: Bound
import qs.components
import qs.components.widgets
import qs.components.effects
import qs.services
import qs.config
import qs.utils
import Quickshell
import Quickshell.Widgets
import Quickshell.Services.UPower
import QtQuick
@ -50,14 +51,9 @@ ColumnLayout {
WrappedLoader {
Layout.fillHeight: true
asynchronous: true
active: !iconLoader.active
visible: active
sourceComponent: IconImage {
source: Quickshell.iconPath(SysInfo.logo)
implicitSize: height
}
sourceComponent: OsLogo {}
}
}
@ -72,10 +68,7 @@ ColumnLayout {
Layout.fillHeight: true
active: root.width > 320
sourceComponent: IconImage {
source: Quickshell.iconPath(SysInfo.logo)
implicitSize: height
}
sourceComponent: OsLogo {}
}
ColumnLayout {
@ -156,6 +149,17 @@ ColumnLayout {
visible: active
}
component OsLogo: IconImage {
source: SysInfo.osLogo
implicitSize: height
asynchronous: true
layer.enabled: Config.lock.recolourLogo || SysInfo.isDefaultLogo
layer.effect: Colouriser {
colorizationColor: Colours.palette.m3primary
}
}
component FetchText: MonoText {
Layout.fillWidth: true
font.pointSize: root.width > 400 ? Appearance.font.size.larger : Appearance.font.size.normal

View file

@ -6,51 +6,6 @@ import Quickshell.Services.Notifications
Singleton {
id: root
readonly property var osIcons: ({
almalinux: "",
alpine: "",
arch: "",
archcraft: "",
arcolinux: "",
artix: "",
centos: "",
debian: "",
devuan: "",
elementary: "",
endeavouros: "",
fedora: "",
freebsd: "",
garuda: "",
gentoo: "",
hyperbola: "",
kali: "",
linuxmint: "󰣭",
mageia: "",
openmandriva: "",
manjaro: "",
neon: "",
nixos: "",
opensuse: "",
suse: "",
sles: "",
sles_sap: "",
"opensuse-tumbleweed": "",
parrot: "",
pop: "",
raspbian: "",
rhel: "",
rocky: "",
slackware: "",
solus: "",
steamos: "",
tails: "",
trisquel: "",
ubuntu: "",
vanilla: "",
void: "",
zorin: ""
})
readonly property var weatherIcons: ({
"113": "clear_day",
"116": "partly_cloudy_day",

View file

@ -11,8 +11,8 @@ Singleton {
property string osPrettyName
property string osId
property list<string> osIdLike
property string logo
property string osIcon: ""
property string osLogo: `file://${Quickshell.shellDir}/assets/logo.svg`
property bool isDefaultLogo: true
property string uptime
readonly property string user: Quickshell.env("USER")
@ -32,17 +32,11 @@ Singleton {
root.osPrettyName = fd("PRETTY_NAME");
root.osId = fd("ID");
root.osIdLike = fd("ID_LIKE").split(" ");
root.logo = fd("LOGO");
const osIcons = Icons.osIcons;
if (osIcons.hasOwnProperty(root.osId)) {
root.osIcon = osIcons[root.osId];
} else {
for (const id of root.osIdLike) {
if (osIcons.hasOwnProperty(id)) {
root.osIcon = osIcons[id];
}
}
const logo = Quickshell.iconPath(fd("LOGO"), true);
if (logo) {
root.osLogo = logo;
root.isDefaultLogo = false;
}
}
}