Xfce Forum

Sub domains
 

You are not logged in.

#1 2017-05-17 14:18:16

Machredsch
Member
Registered: 2017-05-17
Posts: 2

Porting of my xfce desktop style settings to gtk3

Hello,

with the new xfdesktop ported to gtk3, I need to port my gtk2 desktop settings to gtk3 too.
Can anyone tell me, how to setup the correct css style expressions for my gtk2 settings?
I had transparent labels for my desktop icons and tried to port all of my settings to css.
Because the lack of my css knowledge, I got it worked only partly.

The former gtk2rc file there was:

style "xfdesktop-icon-view" 
{ 
	font_name = "DejaVu Sans Book"
	XfdesktopIconView::label-alpha = 0 
    	XfdesktopIconView::selected-label-alpha = 140 
    	XfdesktopIconView::ellipsize-icon-labels = 0

    	XfdesktopIconView::shadow-x-offset = 1 
    	XfdesktopIconView::shadow-y-offset = 1  
    	XfdesktopIconView::selected-shadow-x-offset = 1 
    	XfdesktopIconView::selected-shadow-y-offset = 1
	
	XfdesktopIconView::shadow-color = "#000000" 
    	XfdesktopIconView::selected-shadow-color = "#999999" 

    	XfdesktopIconView::cell-spacing = 5
	XfdesktopIconView::cell-padding = 0
   	XfdesktopIconView::cell-text-width-proportion = 2.8 

   	base[NORMAL] = "#cccccc" 
    	base[SELECTED] = "#cccccc" 
    	base[ACTIVE] = "#cccccc" 

    	fg[NORMAL] = "#cccccc" 
    	fg[SELECTED] = "#000000" 
    	fg[ACTIVE] = "#000000" 
} 
widget_class "*XfdesktopIconView*" style "xfdesktop-icon-view"
widget "*XfdesktopIconView*" style "xfdesktop-icon-view"
class "*XfdesktopIconView*" style "xfdesktop-icon-view"

My new gtk.css contains the following, I figured out already:

* {
   -gtk-icon-style: regular;
}

XfdesktopIconView {
	font: "DejaVu Sans Book";
	background-color: rgba(240, 240, 240, 0.0);
	color:#cccccc;
        text-shadow: 2px 2px #000000;

        margin: 0;
	padding: 0;
}

Transparency is working, but I don't know howto do the "active / selected - thing" and so on with this style class or whats the working css selector for this related behaviour.

Last edited by Machredsch (2017-05-17 14:19:59)

Offline

#2 2017-05-17 17:34:13

sixsixfive
Member
From: behind you
Registered: 2012-04-08
Posts: 578
Website

Re: Porting of my xfce desktop style settings to gtk3

just use the gtk3 inspector on xfdesktop

pkill xfdesktop
GTK_DEBUG=interactive xfdesktop

Offline

#3 2017-05-17 17:46:34

ToZ
Moderator
From: Canada
Registered: 2011-06-02
Posts: 4,832

Re: Porting of my xfce desktop style settings to gtk3

Hello and welcome.

Here are my current xfdesktop GTK3 configs:

/* xfdesktop icon theming */
XfdesktopIconView.view {
	background-color: rgba(0,0,0,0.0);
}

XfdesktopIconView.view:active {
	background-color: rgba(0,0,0,0.3);
	color: #3D7BC7;
	border-radius: 1px;
}

XfdesktopIconView.rubberband {
	background-color: rgba(0,0,0,0.3);
}

XfdesktopIconView.label:active {
	background-color: rgba(0,0,0,0.3);
	color: white;
}

You can tweak as necessary.

And as @sixsixfive says, you can use the inspector, but some items, like the rubberband entity, I can't get to show up in the inspector.

Offline

#4 2017-05-18 09:15:28

Machredsch
Member
Registered: 2017-05-17
Posts: 2

Re: Porting of my xfce desktop style settings to gtk3

Thank you, you 2 have helped me a lot.
I didn't know about that GTKInspector.

Offline

#5 2018-12-04 20:49:13

dc_coder_84
Member
Registered: 2015-05-31
Posts: 5

Re: Porting of my xfce desktop style settings to gtk3

Can anybody help me with the overlay color of the desktop icons when they are active? What is the CSS selector? Many thanks in advance smile

Offline

#6 2018-12-04 23:54:52

ToZ
Moderator
From: Canada
Registered: 2011-06-02
Posts: 4,832

Re: Porting of my xfce desktop style settings to gtk3

dc_coder_84 wrote:

Can anybody help me with the overlay color of the desktop icons when they are active? What is the CSS selector? Many thanks in advance smile

Hello and welcome.

Consider this block:

XfdesktopIconView.view {
  background: transparent;
  color: #fcfcfc;
  border-radius: 3px; }
  XfdesktopIconView.view:active {
    background: rgba(23, 104, 189, 0.5);
    text-shadow: 0 1px 1px black; }
  XfdesktopIconView.view .label {
    text-shadow: 1px 1px 2px black; }

The "XfdesktopIconView.view:active" block affects the actively selected icon. Is this what you are referring to when you say "overlay color"?

Offline

#7 2018-12-05 11:54:45

Jerry3904
Member
Registered: 2013-11-09
Posts: 639

Re: Porting of my xfce desktop style settings to gtk3

Good responses. Added GTK Inspector to my Tidbits.

Last edited by Jerry3904 (2018-12-05 11:55:08)


MX-17 (based on Debian Stable) with Xfce 4.12.
Little collection of Xfce Tidbits

Offline

#8 2018-12-05 20:00:04

dc_coder_84
Member
Registered: 2015-05-31
Posts: 5

Re: Porting of my xfce desktop style settings to gtk3

ToZ wrote:

Consider this block:

XfdesktopIconView.view {
  background: transparent;
  color: #fcfcfc;
  border-radius: 3px; }
  XfdesktopIconView.view:active {
    background: rgba(23, 104, 189, 0.5);
    text-shadow: 0 1px 1px black; }
  XfdesktopIconView.view .label {
    text-shadow: 1px 1px 2px black; }

The "XfdesktopIconView.view:active" block affects the actively selected icon. Is this what you are referring to when you say "overlay color"?

I tested your code but I don't think it is what I want. Let me give you an example. Let's say I have a browser bookmark (a desktop file) on my desktop. With my current theme I have stars as icons for bookmarks. If I select a bookmark the star gets darker because a semi transparent blue layer will be drawn over it. Now I want to change exactly this color.

Offline

#9 2018-12-06 02:21:05

MountainDewManiac
Member
From: Where Mr. Bankruptcy is Prez
Registered: 2013-03-24
Posts: 1,015

Re: Porting of my xfce desktop style settings to gtk3

The "highlight" color, then? What I see when I highlight text.
select text in order to copy it with CTRL C.

Regards,
MDM


Mountain Dew Maniac

How to Ask for Help <=== Click on this link

Offline

#10 2018-12-06 11:42:06

ToZ
Moderator
From: Canada
Registered: 2011-06-02
Posts: 4,832

Re: Porting of my xfce desktop style settings to gtk3

dc_coder_84 wrote:

. If I select a bookmark the star gets darker because a semi transparent blue layer will be drawn over it. Now I want to change exactly this color.

The code block below works for me by getting rid of the transparent layer (it also affects the text background). Which appearance theme are you using?

Offline

#11 2018-12-06 15:15:27

dc_coder_84
Member
Registered: 2015-05-31
Posts: 5

Re: Porting of my xfce desktop style settings to gtk3

MountainDewManiac wrote:

The "highlight" color, then? What I see when I highlight text.
select text in order to copy it with CTRL C.

Yes, the highlighting / selection color.

Offline

#12 2018-12-06 15:17:19

dc_coder_84
Member
Registered: 2015-05-31
Posts: 5

Re: Porting of my xfce desktop style settings to gtk3

ToZ wrote:

The code block below works for me by getting rid of the transparent layer (it also affects the text background). Which appearance theme are you using?

I am using the Numix theme under Xubuntu 18.10 64 bit. The highlighting color for desktop items is blue but should be red.

Offline

#13 2018-12-06 22:17:44

ToZ
Moderator
From: Canada
Registered: 2011-06-02
Posts: 4,832

Re: Porting of my xfce desktop style settings to gtk3

dc_coder_84 wrote:
ToZ wrote:

The code block below works for me by getting rid of the transparent layer (it also affects the text background). Which appearance theme are you using?

I am using the Numix theme under Xubuntu 18.10 64 bit. The highlighting color for desktop items is blue but should be red.

How about something like this:

XfdesktopIconView.view {
  background: transparent;
  color: #fcfcfc;
  border-radius: 3px; }
  XfdesktopIconView.view:active {
    background: rgba(23, 104, 189, 0.5);
    text-shadow: 0 1px 1px black; }
  XfdesktopIconView.view .label {
    text-shadow: 1px 1px 2px black; }

...make sure you restart xfdesktop to see the change.

Offline

#14 2018-12-07 16:29:57

dc_coder_84
Member
Registered: 2015-05-31
Posts: 5

Re: Porting of my xfce desktop style settings to gtk3

Many thanks ToZ. After some trial and error I now found this solution:

XfdesktopIconView.view {
	color: rgb(240, 84, 76);
}

XfdesktopIconView.label {
	color: white;
}

XfdesktopIconView.view:active {
	background: rgba(240, 84, 76, 0.8);
}

It's a bit confusing because in CSS the color attribute normally defines the text color. Anyway, it's working now smile

Offline

Board footer

Powered by FluxBB