Xfce Wiki

Sub domains
 

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revisionPrevious revision
Next revisionBoth sides next revision
xfce:xfce4-panel:theming [2020/03/06 21:49] – [GTK3 Theme testing and debugging] emh_mark_ixfce:xfce4-panel:theming [2020/10/14 20:17] – emh_mark_i
Line 10: Line 10:
  
     .xfce4-panel     .xfce4-panel
 +    .panel
     .tasklist     .tasklist
  
 === ID's: === === ID's: ===
  
 +    #XfcePanelWindow
     #whiskermenu-button     #whiskermenu-button
     #xfce4-notification-plugin     #xfce4-notification-plugin
Line 46: Line 48:
     xfce4-panel -q     xfce4-panel -q
  
-Start the panel process with GtkInspector debugging enabled:+Start the panel process with GtkInspector debugging enabled (Note: This will load an inspector window for each individual panel plugin):
  
     GTK_DEBUG=interactive xfce4-panel     GTK_DEBUG=interactive xfce4-panel
Line 52: Line 54:
 ---- ----
  
-===== Plugin theming examples =====+===== Panelbar theming examples =====
  
 Panelbar background color. Panelbar background color.
  
-    .xfce4-panel.background {+    .xfce4-panel .background {
       background-color: rgba(36, 36, 36, 0.8); }       background-color: rgba(36, 36, 36, 0.8); }
 +
 +Panelbar vertical styling.
 +
 +    .xfce4-panel .vertical .background {
 +      background-color: rgba(219, 219, 219, 0.8); }
 +
 +Panelbar horizontal styling.
 +
 +    .xfce4-panel .horizontal .background {
 +      background-color: rgba(36, 36, 36, 0.8); }
 +
 +===== Plugin theming examples =====
  
 Tasklist toggle button background colour, text color, and border radius. Tasklist toggle button background colour, text color, and border radius.
  
-    .tasklist .toggle {+    .xfce4-panel .tasklist .toggle {
       background-color: lightblue;       background-color: lightblue;
       color: black;       color: black;