Xfce Forum

Sub domains
 

You are not logged in.

#1 2021-10-03 23:53:33

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Panel Gradient

How would I create a gradient background for my panel in 4.16.2? I see some old posts, but I'm not sure where even to install the suggested ones in this version ... gtk2, 3 or 4?

Might be easiest just to create a png and use that ...

Offline

#2 2021-10-04 01:52:27

ToZ
Administrator
From: Canada
Registered: 2011-06-02
Posts: 10,948

Re: Panel Gradient

Or, you can theme it via css. Something like this in ~/.config/gtk-3.0/gtk.css:

.xfce4-panel, .xfce4-panel * { background-image: linear-gradient(to bottom, shade(#ff0000, 0.85), shade(#0000ff, 0.85)); border: transparent; }

Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki  |  Community | Contribute ---

Offline

#3 2021-10-04 02:35:19

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Re: Panel Gradient

Perfect!

Question 1: I thought xfce4 was now using gtk4, but it appears that it  gtk3. Good to know.

Question 2: Can I do the same on window title bars? I just tried naming the titlebar

.xfce4-titlebar, .title * {...

But that doesn't seem to work.

Offline

#4 2021-10-04 02:54:39

ToZ
Administrator
From: Canada
Registered: 2011-06-02
Posts: 10,948

Re: Panel Gradient

Mellowbob wrote:

Question 1: I thought xfce4 was now using gtk4, but it appears that it  gtk3. Good to know.

Yes, still based on GTK3.

Question 2: Can I do the same on window title bars?

Yes and no. For CSD windows, you can use the ".titlebar" designator:

.titlebar { background-image: linear-gradient(to bottom, shade(#ff0000, 0.85), shade(#0000ff, 0.85)); border: transparent; }

For SSD windows (the old style titlebars), you need to theme the xfwm4 theme.


Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki  |  Community | Contribute ---

Offline

#5 2021-10-04 03:34:39

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Re: Panel Gradient

Thanks. I'll have to play with this later this week.

Offline

#6 2022-01-24 22:21:29

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Re: Panel Gradient

ToZ wrote:

Or, you can theme it via css. Something like this in ~/.config/gtk-3.0/gtk.css:

.xfce4-panel, .xfce4-panel * { background-image: linear-gradient(to bottom, shade(#ff0000, 0.85), shade(#0000ff, 0.85)); border: transparent; }

Trying to do this again using 4.16.3 and adding the above to my gtk-3.0 destroys the panel and I need to logout, delete the session, and login to get the session working again. I did modify the line to:

.xfce4-panel, .xfce4-panel * { background-image: linear-gradient(to bottom, shade(#537CAC, .2), shade(#CBE3EC, .6)); border: transparent;

This was cut/paste and changing to the original suggestion doesn't seem to work either smile

I have no idea what I'm doing wrong ...

Offline

#7 2022-01-24 23:47:00

ToZ
Administrator
From: Canada
Registered: 2011-06-02
Posts: 10,948

Re: Panel Gradient

Which GTK theme are you using? The above code mostly works with Adwaita - still needs some tweaking.

Can you post back the full content of your gtk.css file?


Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki  |  Community | Contribute ---

Offline

#8 2022-01-25 00:14:47

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Re: Panel Gradient

ToZ wrote:

Which GTK theme are you using? The above code mostly works with Adwaita - still needs some tweaking.

Can you post back the full content of your gtk.css file?

Sure. I've changed my panel to use an image and that really might be the best route to go since it "just works". But, here is the file:

~/.config/gtk-3.0] bob$ cat gtk.css
.scrollbar {
  -GtkScrollbar-has-backward-stepper: true;
  -GtkScrollbar-has-forward-stepper: true;
  -GtkRange-slider-width: 25;
  -GtkRange-stepper-size: 8;
}

@import 'colors.css';

/*.xfce4-panel, .xfce4-panel * { background-image: linear-gradient(to bottom, shade(#537CAC, .2), shade(#CBE3EC, .6)); border: transparent; }  */

/* .xfce4-titlebar, .title * { background-image: linear-gradient(to bottom, shade(#537CAC, 2), shade(#CBE3EC, .6)); border: transparent; } */

wnck-pager { background-color: #4096BF; }
wnck-pager:selected { background-color: #eeeeff }
wnck-pager:hover { background-color: #11ffff; }
de]

The command I used to restart the panel was "xfce4-panel --restart" which I think should be right?

Theme: clearlooks-phenix

Last edited by Mellowbob (2022-01-25 00:16:02)

Offline

#9 2022-01-25 02:29:23

ToZ
Administrator
From: Canada
Registered: 2011-06-02
Posts: 10,948

Re: Panel Gradient

You have the statement commented out (inside of /* ... */).

Try this (as your complete gtk.css file) - it includes some tweaks:

.scrollbar {
  -GtkScrollbar-has-backward-stepper: true;
  -GtkScrollbar-has-forward-stepper: true;
  -GtkRange-slider-width: 25;
  -GtkRange-stepper-size: 8;
}

@import 'colors.css';

.xfce4-panel, .xfce4-panel button { background-image: linear-gradient(to bottom, shade(#537CAC, .2), shade(#CBE3EC, .6)); border: transparent; border-radius: 0; }  
#systray-6 box { background-image: linear-gradient(to bottom, shade(#537CAC, .2), shade(#CBE3EC, .6)); border: transparent; border-radius: 0;}

/* .xfce4-titlebar, .title * { background-image: linear-gradient(to bottom, shade(#537CAC, 2), shade(#CBE3EC, .6)); border: transparent; } */

wnck-pager { background-color: #4096BF; }
wnck-pager:selected { background-color: #eeeeff }
wnck-pager:hover { background-color: #11ffff; }

You will need to change the "6" in "systray-6" to be the actual systray widget number on your system. You can get this by hovering over the Status Tray Plugin Item in Panel Preferences > Items tab.

And of course, you might want to change the colors to match your system colors.


Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki  |  Community | Contribute ---

Offline

#10 2022-01-25 17:14:33

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Re: Panel Gradient

Before I continue to make changes to my gtk.css file I have to figure out why more than one "xfce4-panel --restart" basically borks my session. I get a popup  saying (I hope this is correct since I can't copy/paste the message):

   GDBus:Error.org.freedesktop.DBus.Error.ServiceUnknown: The name org.xfce.Panel was not provided by any service files.

One way I can generate this is:
    Out comment the three wnck-pager setting lines
    restart ... all works
    re-enable the wnck settings
    restart ... oh no, no panel to restart

At this point I need to log out of the session, remove the session files in a VT, log back in and all is well.

Offline

#11 2022-01-25 23:24:18

ToZ
Administrator
From: Canada
Registered: 2011-06-02
Posts: 10,948

Re: Panel Gradient

Are you running the command as root? It will only work if you run it as your user account.

You might also try running it like this:

xfce4-panel -q
xfce4-panel

...to see if it makes a difference.


Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki  |  Community | Contribute ---

Offline

#12 2022-01-26 00:51:59

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Re: Panel Gradient

Okay, deleting the panel with -q and restarting with no args works perfectly. I'm still not figuring why -r causes a crash? I've discovered that even when I make no changes at all to the gtk file it still crashes intermittently.

Your updated .css file works perfectly as well. Thanks!

BTW, I'm not running a root. Running as user. However, I find that if I do the -r command in alt-F2 window it works better than from a terminal. Odd?

Last edited by Mellowbob (2022-01-26 00:53:08)

Offline

#13 2022-01-26 01:00:06

ToZ
Administrator
From: Canada
Registered: 2011-06-02
Posts: 10,948

Re: Panel Gradient

Mellowbob wrote:

BTW, I'm not running a root. Running as user. However, I find that if I do the -r command in alt-F2 window it works better than from a terminal. Odd?

Yes it is odd. Something is looking for the panel before the panel is up and running. That shouldn't be happening. Would be interesting to see if you can replicate this error in a new, fresh user account.


Please remember to mark your thread [SOLVED] to make it easier for others to find
--- How To Ask For Help | FAQ | Developer Wiki  |  Community | Contribute ---

Offline

#14 2022-01-26 22:00:48

Mellowbob
Member
Registered: 2011-10-16
Posts: 286

Re: Panel Gradient

ToZ wrote:
Mellowbob wrote:

BTW, I'm not running a root. Running as user. However, I find that if I do the -r command in alt-F2 window it works better than from a terminal. Odd?

Yes it is odd. Something is looking for the panel before the panel is up and running. That shouldn't be happening. Would be interesting to see if you can replicate this error in a new, fresh user account.

It is the theme. I switched from Clearlooks-Phenix to Greybird and it works just fine. I'm not in love with the first choice, really just a test, but I wonder if it would nice and/or possible to have list list of themes which work? smile

Offline

Board footer

Powered by FluxBB