Differences
This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
xfce:xfce4-panel:theming [2021/02/08 09:09] – update icon kevinbowen | xfce:xfce4-panel:theming [2024/03/14 07:38] (current) – [CSS Selectors] Update css ids gael | ||
---|---|---|---|
Line 3: | Line 3: | ||
====== xfce4-panel - Panelbar Theming ====== | ====== xfce4-panel - Panelbar Theming ====== | ||
+ | * **[[#CSS Selectors|CSS Selectors]]** | ||
+ | * **[[#GTK3 Theme testing and debugging|GTK3 Theme testing and debugging]]** | ||
+ | * **[[# | ||
* **[[#Plugin theming examples|Plugin theming examples]]** | * **[[#Plugin theming examples|Plugin theming examples]]** | ||
+ | |||
+ | ---- | ||
===== CSS Selectors ===== | ===== CSS Selectors ===== | ||
Line 16: | Line 21: | ||
# | # | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | |||
+ | /* internal plugins */ | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | #sn-button | ||
+ | # | ||
+ | # | ||
+ | # | ||
+ | |||
+ | /* some external plugins */ | ||
# | # | ||
# | # | ||
# | # | ||
# | # | ||
- | # | ||
- | # | ||
- | #sn-button | ||
- | # | ||
- | | ||
=== Elements === | === Elements === | ||
Line 52: | Line 71: | ||
GTK_DEBUG=interactive xfce4-panel | GTK_DEBUG=interactive xfce4-panel | ||
+ | [[|Back To Top]] | ||
---- | ---- | ||
Line 70: | Line 90: | ||
.xfce4-panel .horizontal .background { | .xfce4-panel .horizontal .background { | ||
background-color: | background-color: | ||
+ | |||
+ | Make autohide panelbar transparent. | ||
+ | |||
+ | .xfce4-panel# | ||
+ | background: rgba(0, | ||
+ | |||
+ | [[|Back To Top]] | ||
+ | ---- | ||
+ | |||
===== Plugin theming examples ===== | ===== Plugin theming examples ===== | ||
Line 105: | Line 134: | ||
//The pulseaudio menu contains common GTK widgets such as a scale, trough, switch, and slider.// | //The pulseaudio menu contains common GTK widgets such as a scale, trough, switch, and slider.// | ||
- | Workspace switcher colours for selected and hover states. | + | Workspace switcher colours for selected and hover states |
wnck-pager: | wnck-pager: | ||
Line 113: | Line 142: | ||
<figure " | <figure " | ||
+ | |||
+ | Underline active Workspace switcher button (Appearance: | ||
+ | |||
+ | .xfce4-panel widget grid button.flat.toggle: | ||
+ | font-family: | ||
+ | font-size: 16px; | ||
+ | } | ||
+ | .xfce4-panel widget grid button.flat.toggle: | ||
+ | font-family: | ||
+ | font-size: 16px; | ||
+ | border-bottom: | ||
+ | padding: 10px; | ||
+ | } | ||
Clock colours and font style: | Clock colours and font style: |