Weather Plugin Font Padding Mismatched to Other Fonts

jakfish · 2023-06-23 17:46:10

Using a PinePhone/Manjaro Phosh/xfce desktop, the weather plugin's font hangs lower than the other outputs:

I'm thinking it's /gtk-3.0/gtk.css padding issue but I don't know where to start.

Also, this is a bastard mixture of ARM phosh underpinning, xfce on top, and a buggy phone to boot, so it may not be fixable. I run Manjaro xfce x86 on other machines and I don't have this issue with those setups.

At any rate, I'd be curious if anyone had an approach.

Thanks.

ToZ · 2023-06-23 19:26:23

Try:

#weather-15>button>box>box {padding-bottom: 5px}

...where "weather-15" is the id of the plugin (you can get this by hovering over the plugin in Panel Properties > Items tab) and "5px" is the padding you want to introduce to the bottom. You'll need to restart the plugin / panel to see the effect.

jakfish · 2023-06-23 21:59:20

Many thanks, ToZ, for another fast, helpful reply.

My id is 5, but no matter what figure I use for *px, there's no change.

Any other handle to jiggle? (I seem to remember a similar issue with your workaround script back when the official weather plugin wasn't working; you fixed that in your own script)

ToZ · 2023-06-23 22:33:32

What version of the weather plugin are you using?

As a sanity check, can you post the contents of your gtk.css file?

The script I'm using now is based on wttr.in. You can find it here. Note that wttr.in seems to be having issues with over use and running out of licenses (not working at time of this writing). I'm looking at creating another script using openweather with a custom (free) key that won't run into this issue.

jakfish · 2023-06-23 23:22:02

Here's the gtk.css. Weather ver. = 0.11.1 Thanks again.

/* Custom styles */

/* select-on */
@define-color selected_bg_color #92b372;
@define-color selected_fg_color #ffffff;
@define-color theme_selected_bg_color @selected_bg_color;
@define-color theme_selected_fg_color @selected_fg_color;
/* select-on */

/* panel-on */
@define-color panel_bg_color #cccccc;
@define-color panel_fg_color #333333;

PanelWidget,
PanelApplet,
PanelToplevel,
PanelSeparator,
PanelApplet > GtkMenuBar.menubar,
PanelApplet > GtkMenuBar.menubar.menuitem,
PanelMenuBar.menubar,
PanelMenuBar.menubar.menuitem,
PanelAppletFrame,
UnityPanelWidget,
.gnome-panel-menu-bar,
.unity-panel {
	background-image: -gtk-gradient(linear,left top,left bottom,from(shade(@panel_bg_color,1.2)),to(shade(@panel_bg_color,0.8)));
	color: @panel_fg_color;
}

.unity-panel.menuitem,
.unity-panel .menuitem {
	color: @panel_fg_color;
}

.unity-panel.menubar.menuitem:hover,
.unity-panel.menubar .menuitem *:hover {
	border-color: shade(@panel_bg_color, 0.7);
	border-image: none;
	background-image: -gtk-gradient(linear,left top,left bottom,from(shade(@panel_bg_color, 0.97)),to(shade(@panel_bg_color, 0.82)));
	color: @panel_fg_color;
}

PanelApplet .button {
	border-color: transparent;
	border-image: none;
	background-image: -gtk-gradient(linear,left top,left bottom,from(shade(@panel_bg_color,1.2)),to(shade(@panel_bg_color,0.8)));
	color: @panel_fg_color;
	box-shadow: none;
	text-shadow: none;
	-unico-inner-stroke-width: 0;
}

PanelApplet .button:active {
	border-color: shade(@panel_bg_color,0.8);
	border-image: none;
	background-image: -gtk-gradient(linear,left top,left bottom,from(shade(shade(@panel_bg_color,1.02),0.9)),to(shade(shade(@panel_bg_color,1.02),0.95)));
	color: @panel_fg_color;
	box-shadow: none;
	text-shadow: none;
	-unico-inner-stroke-width: 0;
}

PanelApplet .button:prelight {
	border-color: transparent;
	border-image: none;
	background-image: -gtk-gradient(linear,left top,left bottom,from(shade(@panel_bg_color,1.2)),to(shade(@panel_bg_color,1.0)));
	color: @panel_fg_color;
	box-shadow: none;
	text-shadow: none;
	-unico-inner-stroke-width: 0;
}

PanelApplet .button:active:prelight {
	border-color: shade(@panel_bg_color,0.8);
	border-image: none;
	background-image: -gtk-gradient(linear,left top,left bottom,from(shade(shade(@panel_bg_color,1.02),1.0)),to(shade(shade(@panel_bg_color,1.02),1.05)));
	color: @panel_fg_color;
	box-shadow: none;
	text-shadow: none;
	-unico-inner-stroke-width: 0;
}

WnckPager,
WnckTasklist {
	background-color: @panel_bg_color;
}

/* panel-on */

/* menu-on */
@define-color menu_bg_color #eeeeee;
@define-color menu_fg_color #ffffff;

GtkTreeMenu.menu,
GtkMenuToolButton.menu,
GtkComboBox .menu {
	background-color: @menu_bg_color;
}

.primary-toolbar .button .menu,
.toolbar .menu,
.toolbar .primary-toolbar .menu,
.menu {
	border-style: none;
	background-image: none;
	background-color: @menu_bg_color;
	color: @menu_fg_color;
	box-shadow: none;
	text-shadow: none;
	-unico-inner-stroke-width: 0;
}

.menu.button:hover,
.menu.button:active,
.menu.button:active:insensitive,
.menu.button:insensitive,
.menu.button {
	background-color: @menu_bg_color;
	background-image: none;
}

GtkTreeMenu .menuitem * {
	color: @menu_fg_color;
}

.menuitem,
.menu .menuitem {
	background-color: transparent;
}

.menu .menuitem:active,
.menu .menuitem:hover {
	background-color: @theme_selected_bg_color;
}

.menuitem.check,
.menuitem.radio,
.menuitem.check:hover,
.menuitem.radio:hover,
.menuitem.check:active,
.menuitem.radio:active {
	background-color: transparent;
}

.menu .menuitem:insensitive,
.menu .menuitem *:insensitive {
	color: mix(@menu_fg_color,@menu_bg_color,0.5);
}

.menuitem.arrow {
	color: alpha(@menu_fg_color, 0.6);
}

.menuitem .entry {
	border-color: shade(@menu_bg_color,0.7);
	border-image: none;
	background-color: @menu_bg_color;
	background-image: none;
	color: @menu_fg_color;
}

.menuitem .accelerator {
	color: alpha(@menu_fg_color,0.6);
}

.menuitem .accelerator:insensitive {
	color: alpha(mix(@menu_fg_color,@menu_bg_color,0.5),0.6);
	text-shadow: none;
}

.menuitem.separator {
	background-color: transparent;
	color: shade(@menu_bg_color, 0.9);
}

.menuitem GtkCalendar,
.menuitem GtkCalendar.button,
.menuitem GtkCalendar.header,
.menuitem GtkCalendar.view {
	border-color: shade(@menu_bg_color,0.8);
	border-image: none;
	background-color: @menu_bg_color;
	background-image: none;
	color: @menu_fg_color;
}

.menuitem GtkCalendar:inconsistent {
	color: mix(@menu_fg_color,@menu_bg_color,0.5);
}

* {
   -XfceTasklist-minimized-icon-lucency: 100;
}

 
decoration {
    border: 2px solid #BDBDBD;
    background: #0759EB;
}

decoration:backdrop {
    border: 2px solid #8A0829;
    background: #8A0829;
}

tooltip { opacity: 0 }

#whiskermenu-window.background {
  background-image: url("whiskermenutheme/background.png");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  #background-color: #2b2c2c;
  background-color: #000000;
  border-radius: 3px;
}
#whiskermenu-window entry {
  min-height: 40px;
  transition: all 200ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
  border-image: none;
  background-color: transparent;
  color: #F3F3F5;}

#whiskermenu-window entry:focus {
    border-image: none;
    background-color: transparent;
    background-image: url("whiskermenutheme/transparency.png")}

#whiskermenu-window entry:disabled {
    border-image: none;
    background-color: transparent;
    color: #949597;
    background-image: url("whiskermenutheme/transparency.png"); }

#whiskermenu-window button:active{
    transition: all 0ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-duration: 0ms;
    color: #ffffff;
    background-image: url("whiskermenutheme/button-pressed.png");
    background-repeat: no-repeat;
    background-size: 85% 100%; }

#whiskermenu-window button:hover{
    transition: all 0ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-duration: 0ms;
    color: #ffffff;
    background-image: url("whiskermenutheme/button-pressed.png");
    background-repeat: no-repeat;
    background-size: 85% 100%; }

#whiskermenu-window button:checked {
    transition: all 0ms cubic-bezier(0.25, 0.46, 0.45, 0.94);
    transition-duration: 0ms;
    color: #ffffff;
    background-image: url("whiskermenutheme/button-pressed.png");
    background-repeat: no-repeat;
    background-size: 85% 100%; }

/*panel button*/
#whiskermenu-button{
	color: #bac3cf;
	font-weight: normal;
}
#whiskermenu-button:hover{
	color: #ffffff;
}

/*tree list*/
#whiskermenu-window treeview {
	background-color: transparent;
	color: #fff;
}
#whiskermenu-window treeview:hover {
	background-color: transparent;
	color: #f2f2f2;
}
#whiskermenu-window treeview:selected {
	background-color: transparent;
	color: #f2f2f2;
	outline-color: #3f4453;
}
/*panel button*/
#whiskermenu-button {
    background-color: transparent;
    background-image: url("whiskermenutheme/start-here.png");
    border-color: transparent;
    border-image: url("whiskermenutheme/transparency.png");
    padding: 1px 5px 1px 5px;
	color: #bac3cf;
	font-weight: normal;
}
#whiskermenu-button:hover{
    background-image: url("whiskermenutheme/start-here-hover.png");
    border-color: transparent;
    border-image: url("whiskermenutheme/transparency.png");
    padding: 1px 5px 1px 5px;
    background-color: transparent;
	color: #ffffff;
}
#whiskermenu-button:checked{
    background-image: url("whiskermenutheme/start-here-active.png");
    padding: 1px 5px 1px 5px;
    background-color: transparent;
    border-color: transparent;
    border-image: url("whiskermenutheme/transparency.png");
	color: #fff;
}

/*.xfce4-panel.panel.background {
    background-image: url("whiskermenutheme/azenis-black.png");
    background-size: 100% 100%;
    background-repeat: no-repeat;
}*/


/*  #zorinmenulite-button {
  background-image: url(".whiskermenutheme/zorinmenu-button.png");
  background-repeat: no-repeat;
  margin: -6px 0px -6px 0px;
}*/

#whiskermenu-window scrollbar.vertical button.down {
  -gtk-icon-source: none;
  background-image: url("whiskermenutheme/stepper-down.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 53% 95%;
  border-image: none; }
#whiskermenu-window scrollbar.vertical button.down:hover {
  -gtk-icon-source: none;
  background-image: url("whiskermenutheme/stepper-down-prelight.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 53% 95%;
  border-image: none;  }
#whiskermenu-window scrollbar.vertical button.down:active {
  -gtk-icon-source: none;
  background-image: url("whiskermenutheme/stepper-down-prelight.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 53% 95%;
  border-image: none;  }
#whiskermenu-window scrollbar.vertical button.up {
  -gtk-icon-source: none;
  background-image: url("whiskermenutheme/stepper-up.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 53% 95%;
  border-image: none;  }
#whiskermenu-window scrollbar.vertical button.up:hover {
  -gtk-icon-source: none;
  background-image: url("whiskermenutheme/stepper-up-prelight.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 53% 95%;
  border-image: none;  }
#whiskermenu-window scrollbar.vertical button.up:active {
  -gtk-icon-source: none;
  background-image: url("whiskermenutheme/stepper-up-prelight.png");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 53% 95%;
  border-image: none;  }
#weather-5>button>box>box {padding-bottom 10px}

/* menu-on */

ToZ · 2023-06-24 00:36:39

#weather-5>button>box>box {padding-bottom 10px}

You're missing a colon ":" after padding-bottom. It should be:

#weather-5>button>box>box {padding-bottom: 10px}

jakfish · 2023-06-24 00:42:24

My apologies; I had deleted the command, then to post my .css, I hastily put it back in. But I had tried it with the colon, and again now, but no change in the display.

ToZ · 2023-06-24 01:02:38

To rule out anything else in the file, can you create and use a gtk.css file that only has that one line in it to see if makes a difference?

jakfish · 2023-06-24 01:46:13

Thanks for sticking with this. No change and this is the barebones gtk.css I ran (hoping layout is correct):

/* Custom styles */
#weather-5>button>box>box {padding-bottom: 10px}

/* menu-on */

ToZ · 2023-06-24 02:31:29

Hmm. This is odd. Try this one instead:

#weather-5 .toggle {padding-bottom: 10px}

jakfish · 2023-06-24 02:41:09

No, no change. Could be my weird setup b/c as I said earlier, I run the same xfce/manjaro/gtk.css on several machines without said issue.

ToZ · 2023-06-24 04:07:16

jakfish wrote:

No, no change. Could be my weird setup b/c as I said earlier, I run the same xfce/manjaro/gtk.css on several machines without said issue.

It must be - especially since its working on other machines. I'm not sure what would be different with this one though.

jakfish · 2023-06-24 13:20:45

For testing, I used this gtk.css in another device and it moved up the weather plugin (icon and font). Hmm.

/* Custom styles */

#weather-1>button>box>box {padding-bottom: 30px}
/* menu-on */

KBar · 2023-06-25 07:06:34

It looks like a font issue to me. Try resetting it with the following command line:

xfconf-query --channel xfce4-panel --property "$(xfconf-query -c xfce4-panel -l /plugins | grep scrollbox/font)" --reset

…and restart the plugin:

pkill -f xfce4/panel/plugins/libweather.so

Xfce Forum

Sub domains

#1 2023-06-23 17:46:10

Weather Plugin Font Padding Mismatched to Other Fonts

#2 2023-06-23 19:26:23

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#3 2023-06-23 21:59:20

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#4 2023-06-23 22:33:32

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#5 2023-06-23 23:22:02

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#6 2023-06-24 00:36:39

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#7 2023-06-24 00:42:24

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#8 2023-06-24 01:02:38

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#9 2023-06-24 01:46:13

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#10 2023-06-24 02:31:29

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#11 2023-06-24 02:41:09

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#12 2023-06-24 04:07:16

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#13 2023-06-24 13:20:45

Re: Weather Plugin Font Padding Mismatched to Other Fonts

#14 2023-06-25 07:06:34

Re: Weather Plugin Font Padding Mismatched to Other Fonts

Board footer