Quassel IRC

h1. Stylesheets

{{toc}}

As of version 0.5rc1, Quassel supports custom stylesheets.

The syntax follows that of "Qt-Stylesheets":http://qt-project.org/doc/qt-5.0/qtwidgets/stylesheet.html but extends it with custom elements.

h2. Use a custom stylesheet

Click on Settings -> Configure Quassel... (Shortcut: F7) and enable your stylesheet there

!setup_custom_stylesheet.png!

h2. Gallery

User created stylesheets can be found in the [[Stylesheet Gallery]].
Feel free to add your own creations there.

h2. Default Stylesheet

The default stylesheet can be viewed on "GitHub":https://github.com/quassel/quassel/blob/master/data/stylesheets/default.qss.

h2. Example

Change the background colors for all of the sections

<pre><code class="css"> <pre>
ChatView { background: #303030; }
NickView { background: #303030; }
BufferView { background: #303030; }
QTextEdit { background: #303030; color: #E2E2E2; }
StyledLabel#topicLabel { background: #303030; }
TopicWidget { background: #303030; }
</code></pre> </pre>

*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.

The Qt Docs contains numerous examples for styling base Qt elements: https://qt-project.org/doc/qt-5.1/qtwidgets/stylesheet-examples.html