wrong(ly formated?) symbol for lock

[awawartemis]

Description

Since app. 3-4 days ago gBar shows a lock icon which does not look like it should for me (see below) this seems to have been caused by some update, either to gBar or some dependency, since I have made no configuration changes

Steps to Reproduce

I have no frickin clue, just restarted gBar after rebooting, now always looks this way, even after PC- and gBar restart

Expected behavior

show the lock icon in the same style as the other icons

the config I use:

# Example configuration.
# Everything after '#' is ignored
# Format of the variables:
#    [variable]: [value]
# Whitespaces are ignored in the following locations:
# - Before the variable
# - After the ':'
# - After the value

# The following three options control the ordering of the widgets.
# Reordering can cause slight margin inconsistencies,
# so it is recommend to only make minor adjustments to the default layout.
# Adding the same widget multiple times to the layout is *not* supported and will cause issues.

# Widgets to show on the left side
WidgetsLeft: [Workspaces]
# Widgets to center
WidgetsCenter: [Time]
# Widgets to display on the right side
WidgetsRight: [Tray, Packages, Audio, Bluetooth, Network, Disk, VRAM, GPU, RAM, CPU, Battery, Power]

# The CPU sensor to use
CPUThermalZone: /sys/class/thermal/thermal_zone0/hwmon1/temp1_input

# The command to execute on suspend
SuspendCommand: systemctl suspend

# The command to execute on lock
LockCommand: swaylock -f -i /usr/share/backgrounds/cosmiccliffs1440p.png

# The command to execute on exit
ExitCommand: killall Hyprland

# The folder, where the battery sensors reside
BatteryFolder: /sys/class/power_supply/BAT0

# The partition to monitor with disk sensor
DiskPartition: /

# Overrides the icon of the nth (in this case the first) workspace.
# Please note the missing space between "," and the symbol. Adding a space here adds it to the bar too!
#WorkspaceSymbol: 1,

# The default symbol for the workspaces
DefaultWorkspaceSymbol: 

# Scroll through the workspaces of the current monitor instead of all workspaces
WorkspaceScrollOnMonitor: true

# When true: Scroll up -> Next workspace instead of previous workspace. Analogous with scroll down
WorkspaceScrollInvert: false

# Number of workspaces to display. Displayed workspace IDs are 1-n (Default: 1-9)
NumWorkspaces: 10

# Use Hyprland IPC instead of the ext_workspace protocol for workspace polling.
# Hyprland IPC is *slightly* less performant (+0.1% one core), but way less bug prone,
# since the protocol is not as feature complete as Hyprland IPC.
# NOTE: Hyprland no longer supports ext-workspace-unstable-v1 as of commit bb09334.
# Hyprland IPC is thus *required* for workspace support under Hyprland >=v0.30.0!
UseHyprlandIPC: true

# The location of the bar
# Needs to be capitalized!!
# Values are: L (Left), R (Right), T (Top), B (bottom)
Location: T

# Forces the time to be centered.
# This can cause the right widget to clip outside, if there is not enough space on screen (e.g. when opening the text)
# Setting this to false will definitely fix this issue, but it won't look very good, since it will be off-center.
# So try to decrease "TimeSpace" first, before setting this configuration to false.
CenterTime: true

# How much space should be reserved for the time widget. Setting this too high can cause the right widget to clip outside.
# Therefore try to set it as low as possible if you experience clipping.
# Although keep in mind, that a value that is too low can cause the widget to be be off-center,
# which can also cause clipping.
# If you can't find an optimal value, consider setting 'CenterTime' to false
TimeSpace: 300

# Set datetime style
DateTimeStyle: %a %y-%m-%d - %H:%M:%S %Z

# Set datetime locale (defaults to system locale if not set or set to empty string)
#DateTimeLocale: de_DE.utf8

# Adds a audio input(aka. microphone) widget
AudioInput: false

# Sets the audio slider to be on reveal (Just like the sensors) when true. Only affects the bar.
AudioRevealer: false

# Sets the rate of change of the slider on each scroll. In Percent
AudioScrollSpeed: 5

# Display numbers instead of a slider for the two audio widgets. Doesn't affect the audio flyin
AudioNumbers: false

# Command that is run to check if there are out-of-date packages.
# The script should return *ONLY* a number. If it doesn't output a number, updates are no longer checked.
# Default value is applicable for Arch Linux. (See data/update.sh for a human-readable version)
CheckPackagesCommand: p="$(checkupdates)"; e=$?; if [ $e -eq 127 ] ; then exit 127; fi; if [ $e -eq 2 ] ; then echo "0" && exit 0; fi; echo "$p" | wc -l

# How often to check for updates. In seconds
CheckUpdateInterval: 300

# Limits the range of the audio slider. Only works for audio output.
# Slider "empty" is AudioMinVolume, Slider "full" is AudioMaxVolume
# AudioMinVolume: 30 # Audio can't get below 30%
# AudioMaxVolume: 120 # Audio can't get above 120%

# The network adapter to use. You can query /sys/class/net for all possible values
NetworkAdapter: wlan0 

# Disables the network widget when set to false
NetworkWidget: true

# Use tooltips instead of sliders for the sensors
SensorTooltips: false

# Enables tray icons
EnableSNI: true

# SNIIconSize sets the icon size for a SNI icon.
# SNIPaddingTop Can be used to push the Icon down. Negative values are allowed
# For both: The first parameter is a filter of the tooltip(The text that pops up, when the icon is hovered) of the icon

# Scale everything down to 25 pixels ('*' as filter means everything)
#SNIIconSize: *, 25
# Explicitly make OBS a bit smaller than default
#SNIIconSize: OBS, 23
# Nudges the Discord icon a bit down
#SNIPaddingTop: Discord, 5

# These set the range for the network widget. The widget changes colors at six intervals:
#    - Below Min...Bytes ("under")
#    - Between ]0%;25%]. 0% = Min...Bytes; 100% = Max...Bytes ("low")
#    - Between ]25%;50%]. 0% = Min...Bytes; 100% = Max...Bytes ("mid-low")
#    - Between ]50%;75%]. 0% = Min...Bytes; 100% = Max...Bytes ("mid-high")
#    - Between ]75%;100%]. 0% = Min...Bytes; 100% = Max...Bytes ("high")
#    - Above Max...Bytes ("over")
MinDownloadBytes: 0
MaxDownloadBytes: 10485760 # 10 * 1024 * 1024 = 10 MiB
MinUploadBytes:   0
MaxUploadBytes:   5242880    # 5 * 1024 * 1024 = 5 MiB

my css

* {
  all: unset;
  font-family: "CaskaydiaCove Nerd Font"; }

.popup {
  color: #50fa7b; }

.bar, tooltip {
  background-color: #282a36;
  border-radius: 16px; }

.right {
  margin-right: 10px;
  border-radius: 16px; }

.time-text {
  font-size: 16px; }

.reboot-button {
  font-size: 28px;
  margin-right: 6px;
  color: #6272a4; }

.sleep-button {
  font-size: 28px;
  color: #6272a4; }

.exit-button {
  font-size: 28px;
  color: #6272a4; }

.power-button {
  font-size: 28px;
  color: #ffb86c; }

.power-box-expand {
  margin-right: 6px; }

.system-confirm {
  color: #50fa7b; }

trough {
  border-radius: 3px;
  border-width: 1px;
  border-style: none;
  background-color: #44475a;
  margin-top: 2px;
  min-width: 4px;
  min-height: 4px; }

slider {
  border-radius: 0%;
  border-width: 1px;
  border-style: none;
  margin: -9px -9px -9px -9px;
  min-width: 16px;
  min-height: 16px;
  background-color: transparent; }

highlight {
  border-radius: 3px;
  border-width: 1px;
  border-style: none;
  min-height: 6px; }

.audio-icon {
  font-size: 24px;
  color: #ff79c6;
  margin-right: 12px; }

.audio-volume trough {
  background-color: #44475a; }

.audio-volume slider {
  background-color: transparent; }

.audio-volume highlight {
  background-color: #ff79c6; }

.mic-icon {
  font-size: 24px;
  color: #bd93f9;
  margin-right: 0px; }

.mic-volume trough {
  background-color: #44475a; }

.mic-volume slider {
  background-color: transparent; }

.mic-volume highlight {
  background-color: #bd93f9; }

.package-outofdate {
  font-size: 24px;
  margin-right: -5px;
  margin-left: -5px;
  color: #ffb86c; }

.bt-num {
  font-size: 16px;
  color: #1793D1;
  margin-left: -6px; }

.bt-label-on {
  font-size: 20px;
  color: #1793D1;
  margin-right: 6px; }

.bt-label-off {
  font-size: 24px;
  color: #1793D1;
  margin-right: 6px; }

.bt-label-connected {
  font-size: 28px;
  color: #1793D1;
  margin-right: 6px; }

.disk-util-progress {
  color: #bd93f9;
  background-color: #44475a;
  font-size: 16px; }

.disk-data-text {
  color: #bd93f9;
  margin-right: 6px;
  font-size: 16px; }

.vram-util-progress {
  color: #ff79c6;
  background-color: #44475a; }

.vram-data-text {
  color: #ff79c6;
  margin-right: 6px;
  font-size: 16px; }

.ram-util-progress {
  color: #f1fa8c;
  background-color: #44475a; }

.ram-data-text {
  color: #f1fa8c;
  margin-right: 6px;
  font-size: 16px; }

.gpu-util-progress {
  color: #8be9fd;
  background-color: #44475a; }

.gpu-data-text {
  color: #8be9fd;
  margin-right: 6px;
  font-size: 16px; }

.cpu-util-progress {
  color: #50fa7b;
  background-color: #44475a;
  font-size: 16px; }

.cpu-data-text {
  color: #50fa7b;
  margin-right: 6px;
  font-size: 16px; }

.battery-util-progress {
  color: #ff79c6;
  background-color: #44475a;
  font-size: 16px; }

.battery-data-text {
  color: #ff79c6;
  margin-right: 6px;
  font-size: 16px; }

.network-data-text {
  color: #50fa7b;
  margin-right: 6px;
  font-size: 16px; }

.network-up-under {
  color: #44475a; }

.network-up-low {
  color: #50fa7b; }

.network-up-mid-low {
  color: #f1fa8c; }

.network-up-mid-high {
  color: #ff79c6; }

.network-up-high {
  color: #bd93f9; }

.network-up-over {
  color: #ffb86c; }

.network-down-under {
  color: #44475a; }

.network-down-low {
  color: #50fa7b; }

.network-down-mid-low {
  color: #f1fa8c; }

.network-down-mid-high {
  color: #ff79c6; }

.network-down-high {
  color: #bd93f9; }

.network-down-over {
  color: #ffb86c; }

.ws-dead {
  color: #44475a;
  font-size: 16px; }

.ws-inactive {
  color: #6272a4;
  font-size: 16px; }

.ws-visible {
  color: #8be9fd;
  font-size: 16px; }

.ws-current {
  color: #f1fa8c;
  font-size: 16px; }

.ws-active {
  color: #50fa7b;
  font-size: 16px; }

@keyframes connectanim {
  from {
    background-image: radial-gradient(circle farthest-side at center, #1793D1 0%, transparent 0%, transparent 100%); }
  to {
    background-image: radial-gradient(circle farthest-side at center, #1793D1 0%, #1793D1 100%, transparent 100%); } }

@keyframes disconnectanim {
  from {
    background-image: radial-gradient(circle farthest-side at center, transparent 0%, #1793D1 0%, #1793D1 100%); }
  to {
    background-image: radial-gradient(circle farthest-side at center, transparent 0%, transparent 100%, #1793D1 100%); } }

@keyframes scanonanim {
  from {
    color: #f1fa8c; }
  to {
    color: #50fa7b; } }

@keyframes scanoffanim {
  from {
    color: #50fa7b; }
  to {
    color: #f1fa8c; } }

.bt-bg {
  background-color: #282a36;
  border-radius: 16px; }

.bt-header-box {
  margin-top: 4px;
  margin-right: 8px;
  margin-left: 8px;
  font-size: 24px;
  color: #1793D1; }

.bt-body-box {
  margin-right: 8px;
  margin-left: 8px; }

.bt-button {
  border-radius: 16px;
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 4px;
  padding-bottom: 4px;
  margin-bottom: 4px;
  margin-top: 4px;
  font-size: 16px; }
  .bt-button.active {
    animation-name: connectanim;
    animation-duration: 50ms;
    animation-timing-function: linear;
    animation-fill-mode: forwards; }
  .bt-button.inactive {
    animation-name: disconnectanim;
    animation-duration: 50ms;
    animation-timing-function: linear;
    animation-fill-mode: forwards; }
  .bt-button.failed {
    color: #ffb86c; }

.bt-close {
  color: #ffb86c;
  background-color: #44475a;
  border-radius: 16px;
  padding: 0px 8px 0px 7px;
  margin: 0px 0px 0px 8px; }

.bt-scan {
  color: #f1fa8c;
  background-color: #44475a;
  border-radius: 16px;
  padding: 2px 11px 0px 7px;
  margin: 0px 0px 0px 10px;
  font-size: 18px; }
  .bt-scan.active {
    animation-name: scanonanim;
    animation-duration: 50ms;
    animation-timing-function: linear;
    animation-fill-mode: forwards; }
  .bt-scan.inactive {
    animation-name: scanoffanim;
    animation-duration: 50ms;
    animation-timing-function: linear;
    animation-fill-mode: forwards; }

Information about your system and gBar

• OS: Arch
• Desktop environment [e.g. Hyprland, Sway, ...]
• commit sha256 if possible [e.g. 16e7d8aa50ddebeffb2509d7c0428b38cad565f8]

[scorpion-26]

This is a known breaking change since 56c53c4, since I made a copy-paste mistake when initially creating the bar and forgot to give the lock a separate css class (and also forgot to put a .lock-button selector in the css). To fix this, a simply add e.g.

.lock-button {
    font-size: 28px;

    color: $darkblue;
}

to the scss file.