FelixKratz / SketchyBar

A highly customizable macOS status bar replacement
https://felixkratz.github.io/SketchyBar/
GNU General Public License v3.0
6.68k stars 97 forks source link

[Feature Request] Top and Bottom padding or separators #330

Closed khaneliman closed 1 year ago

khaneliman commented 1 year ago

I'm trying to extend my apple menu to contain some more functionality and would like a visual way to separate items. I tried adding an item with a horizontal line to separate them but it has the line height too large. I can't seem to find a way to shrink the vertical space between items. There is no padding_top and padding_bottom and item.height / item.icon.height / item.icon.background.height dont seem to do anything. Y offset only shifts an item within the height drawn.

image image image
FelixKratz commented 1 year ago

I think the popup system needs a rework some time in the future, it will have to be coupled with the vertical bar update #240, where exactly these annoyances surface as well. I am still not really sure how to handle the vertical configuration properly though.

There is a sketchy way to achieve what you want however... I have implemented popups such that the cell height is controlled by popup.height of the parent item, BUT if the content of the item is larger (in height) than the configured cell height, it will use the items height as a cell height for that item instead... SO the trick here is to set the popup.height=0 and then change the item height by giving the members of the popup a transparent background with the desired height, i.e.:

background.color=0x00000000
background.height=30
background.drawing=on

now we can add a divider line and it will have smaller bounds, e.g.:

apple_divider=(
  icon.drawing=off
  label.drawing=off
  background.color=$WHITE
  background.height=1
  padding_left=7
  padding_right=7
  width=110
  background.drawing=on
)

This is the result:

Screenshot 2023-02-19 at 01 08 27

Full example config:

apple.sh ```bash #!/bin/bash POPUP_OFF="sketchybar --set apple.logo popup.drawing=off" POPUP_CLICK_SCRIPT="sketchybar --set \$NAME popup.drawing=toggle" apple_logo=( icon=$APPLE icon.font="$FONT:Black:16.0" icon.color=$GREEN padding_right=15 label.drawing=off click_script="$POPUP_CLICK_SCRIPT" popup.height=0 ) apple_prefs=( icon=$PREFERENCES label="Preferences" background.color=0x00000000 background.height=30 background.drawing=on click_script="open -a 'System Preferences'; $POPUP_OFF" ) apple_activity=( icon=$ACTIVITY label="Activity" background.color=0x00000000 background.height=30 background.drawing=on click_script="open -a 'Activity Monitor'; $POPUP_OFF" ) apple_divider=( icon.drawing=off label.drawing=off background.color=$WHITE background.height=1 padding_left=7 padding_right=7 width=110 background.drawing=on ) apple_lock=( icon=$LOCK label="Lock Screen" background.color=0x00000000 background.height=30 background.drawing=on click_script="pmset displaysleepnow; $POPUP_OFF" ) sketchybar --add item apple.logo left \ --set apple.logo "${apple_logo[@]}" \ \ --add item apple.prefs popup.apple.logo \ --set apple.prefs "${apple_prefs[@]}" \ \ --add item apple.activity popup.apple.logo \ --set apple.activity "${apple_activity[@]}" \ \ --add item apple.divider popup.apple.logo \ --set apple.divider "${apple_divider[@]}" \ \ --add item apple.lock popup.apple.logo \ --set apple.lock "${apple_lock[@]}" ```
khaneliman commented 1 year ago

Alright, sounds good. Thank you for the example of how to make it work for this case. I also like how clean it looks using the bash arrays for the item configs. Gonna have to update my code like that. Appreciate your work!

FelixKratz commented 1 year ago

I will close this for now but I have this on my list of things that should be included in the new popup system

khaneliman commented 1 year ago

This is what worked for me using your example.

image
apple.sh ### Item ```bash #!/usr/bin/env bash POPUP_OFF="sketchybar --set apple.logo popup.drawing=off" POPUP_CLICK_SCRIPT="sketchybar --set \$NAME popup.drawing=toggle" apple_logo=( icon="$APPLE" icon.font="$FONT:Black:16.0" icon.color="$BLUE" padding_right=15 label.drawing=off click_script="$POPUP_CLICK_SCRIPT" popup.height=0 ) apple_prefs=( icon="$PREFERENCES" label="Preferences" background.color=0x00000000 background.height=30 background.drawing=on click_script="open -a 'System Preferences'; $POPUP_OFF" ) apple_activity=( icon="$ACTIVITY" label="Activity" background.color=0x00000000 background.height=30 background.drawing=on click_script="kitty --single-instance -e btop; $POPUP_OFF" ) apple_divider=( icon.drawing=off label.drawing=off background.color="$BLUE" background.height=1 padding_left=7 padding_right=7 width=110 background.drawing=on ) apple_lock=( icon="$LOCK" label="Lock Screen" background.color=0x00000000 background.height=30 background.drawing=on click_script="osascript -e 'tell application \ \"System Events\" to keystroke \"q\" \ using {command down,control down}'; $POPUP_OFF" ) apple_logout=( icon="$LOGOUT" icon.padding_left=7 label="Logout" background.color=0x00000000 background.height=30 background.drawing=on click_script="osascript -e 'tell application \ \"System Events\" to keystroke \"q\" \ using {command down,shift down}'; $POPUP_OFF" ) apple_sleep=( icon="$SLEEP" icon.padding_left=5 background.color=0x00000000 background.height=30 background.drawing=on label="Sleep" click_script="osascript -e 'tell app \"System Events\" to sleep'; $POPUP_OFF" ) apple_reboot=( icon="$REBOOT" icon.padding_left=5 background.color=0x00000000 background.height=30 background.drawing=on label="Reboot" click_script="osascript -e 'tell app \"loginwindow\" to «event aevtrrst»'; $POPUP_OFF" ) apple_shutdown=( icon="$POWER" icon.padding_left=5 background.color=0x00000000 background.height=30 background.drawing=on label="Shutdown" click_script="osascript -e 'tell app \"loginwindow\" to «event aevtrsdn»'; $POPUP_OFF" ) sketchybar --add item apple.logo left \ --set apple.logo "${apple_logo[@]}" \ \ --add item apple.prefs popup.apple.logo \ --set apple.prefs "${apple_prefs[@]}" \ \ --add item apple.activity popup.apple.logo \ --set apple.activity "${apple_activity[@]}" \ \ --add item apple.divider popup.apple.logo \ --set apple.divider "${apple_divider[@]}" \ \ --add item apple.sleep popup.apple.logo \ --set apple.sleep "${apple_sleep[@]}" \ \ --add item apple.reboot popup.apple.logo \ --set apple.reboot "${apple_reboot[@]}" \ \ --add item apple.shutdown popup.apple.logo \ --set apple.shutdown "${apple_shutdown[@]}" \ \ --add item apple.divider2 popup.apple.logo \ --set apple.divider2 "${apple_divider[@]}" \ \ --add item apple.lock popup.apple.logo \ --set apple.lock "${apple_lock[@]}" \ \ --add item apple.logout popup.apple.logo \ --set apple.logout "${apple_logout[@]}" \ ```