Project

General

Profile

Stylesheets » History » Version 6

ChrisH, 07/29/2013 10:55 PM

1 1 seezer
h1. Stylesheets
2 1 seezer
3 1 seezer
{{toc}}
4 1 seezer
5 1 seezer
As of version 0.5rc1, Quassel supports custom stylesheets.
6 1 seezer
7 4 ChrisH
The syntax follows that of "Qt-Stylesheets":http://qt-project.org/doc/qt-5.0/qtwidgets/stylesheet.html but extends it with custom elements.
8 1 seezer
9 1 seezer
h2. Use a custom stylesheet
10 1 seezer
11 1 seezer
Click on Settings -> Configure Quassel... (Shortcut: F7) and enable your stylesheet there
12 1 seezer
13 1 seezer
!setup_custom_stylesheet.png!
14 1 seezer
15 1 seezer
16 1 seezer
h2. Gallery
17 1 seezer
18 1 seezer
User created stylesheets can be found in the [[Stylesheet Gallery]].
19 1 seezer
Feel free to add your own creations there.
20 2 GabydeWilde
21 5 ChrisH
h2. Default Stylesheet
22 5 ChrisH
23 5 ChrisH
The default stylesheet can be viewed on "GitHub":https://github.com/quassel/quassel/blob/master/data/stylesheets/default.qss.
24 5 ChrisH
25 2 GabydeWilde
h2. Example
26 2 GabydeWilde
27 2 GabydeWilde
Change the background colors for all of the sections
28 1 seezer
29 6 ChrisH
<pre><code class="css">
30 2 GabydeWilde
ChatView { background: #303030; }
31 2 GabydeWilde
NickView { background: #303030; }
32 2 GabydeWilde
BufferView { background: #303030; }
33 2 GabydeWilde
QTextEdit { background: #303030; color: #E2E2E2; }
34 2 GabydeWilde
StyledLabel#topicLabel { background: #303030; }
35 1 seezer
TopicWidget { background: #303030; }
36 6 ChrisH
</code></pre>
37 1 seezer
38 4 ChrisH
*Note:* Quassel stylesheets also support @Palette { role: color; }@ for setting the system palette. See the "QPalette docs":http://qt-project.org/doc/qt-5.1/qtgui/qpalette.html#ColorGroup-enum for available roles, and convert them into qss-style attributes, so ButtonText would become button-text or see "qssparser.cpp"https://github.com/quassel/quassel/blob/master/src/uisupport/qssparser.cpp in the source files. In fact, qssparser.cpp is the authorative source for Quassel's qss syntax that contains all the extensions over standard Qt qss syntax.
39 4 ChrisH
40 4 ChrisH
The Qt Docs contains numerous examples for styling base Qt elements: https://qt-project.org/doc/qt-5.1/qtwidgets/stylesheet-examples.html