1/**
2** ______           _      _____       _            _             _
3** |  _  \         | |    /  ___|     | |          (_)           | |
4** | | | |__ _ _ __| | __ \ `--.  ___ | | __ _ _ __ _ _______  __| |
5** | | | / _` | '__| |/ /  `--. \/ _ \| |/ _` | '__| |_  / _ \/ _` |
6** | |/ / (_| | |  |   <  /\__/ / (_) | | (_| | |  | |/ /  __/ (_| |
7** |___/ \__,_|_|  |_|\_\ \____/ \___/|_|\__,_|_|  |_/___\___|\__,_|
8**
9**      Quassel Theme
10**
11** Author: Chris Holland (Zren on Freenode/GitHub)
12*/
13
14/**
15** Theme Notes:
16**  - This theme is designed to work on top of the Fusion or the Plastique client style.
17**    It will look weird on almost all the others (including the system default).
18**    (Settings > Configure Quassel (F7) > Interface > Client Style)
19*/
20
21/**
22** Helpful Links:
23**  - QT:
24**      http://qt-project.org/doc/qt-4.8/stylesheet-syntax.html
25**      http://doc.qt.nokia.com/4.7-snapshot/stylesheet-reference.html
26**      http://doc.qt.nokia.com/4.7-snapshot/stylesheet-examples.html
27**  - Plastique Client Style:
28**      https://qt.gitorious.org/qt/qt/source/src/gui/styles/qplastiquestyle.cpp
29**      https://github.com/mirror/qt/blob/4.8/src/gui/styles/qplastiquestyle.cpp
30**  - Quassel Stylesheet Gallery:
31**      http://bugs.quassel-irc.org/projects/1/wiki/Stylesheet_Gallery
32**      http://bugs.quassel-irc.org/projects/1/wiki/Stylesheet_Gallery#DarkMonokaiqss
33*/
34
35/**
36**  - QSS Notes:
37**      Quassel stylesheets also support Palette { role: color; } for setting the system
38**      palette. See the QPalette docs for available roles, and convert them into qss-style
39**      attributes, so ButtonText would become button-text or see qssparser.cpp In fact,
40**      qssparser.cpp is the authorative source for Quassel's qss syntax that contains all
41**      the extensions over standard Qt qss syntax.
42**      See:
43**          http://qt-project.org/doc/qt-4.8/qpalette.html#ColorRole-enum
44**          https://github.com/quassel/quassel/blob/master/src/uisupport/qssparser.cpp
45**
46*/
47
48Palette {
49    /* Window colors */
50    window: #2b2b2b;
51    background: #212121;
52    foreground: #dddddd;
53
54    base: #131313;
55    alternate-base: #42403B;
56
57    /* Just setting palette(tooltip-base) doesn't work as intended so we set it in
58    ** a QTooltip{} rule as well.
59    */
60    tooltip-base: #131313; // palette(base)
61    tooltip-text: white; // palette(text)
62
63    /* The following attributes should be done in a scale */
64    light: #444444; // Tab Borders, Scrollbar handle grips, Titled Panel border (Settings)
65    midlight: #333333; // ?
66    button: #292929; // Menu BG, Scrollbar and Button base.
67    mid: #252525; // Titled Panel border (Settings)
68    dark: #202020; // TreeView [-] and ... color (Also various borders in Windows Client Style)
69    shadow: #1d1d1d; // ?
70
71
72    /* Text colors */
73    text: white;
74    button-text: #B6B3AB;
75
76    highlight: #268bd2;
77    //highlight-text: #000000;
78
79    /* Link colors */
80    link: #539FA3;
81    link-visited: #845B90;
82
83    /* Color of the marker line in the chat view. BG Node that is overlayed on the first new ChatLine. */
84    // 0 -> 0.1 (sharp line)
85    marker-line: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #586e75, stop: 0.1 #586e75, stop: 0.1 transparent);
86}
87
88/*
89** Base Object Colors
90*/
91
92/* Tables */
93// QTreeView#settingsTree -> Tree in the Settings popup.
94
95QTreeView, QTableView {
96    alternate-background-color: rgba(0,0,0, 64);
97    // background-color: palette(shadow);
98    border: 0px;
99}
100
101QTreeView {
102  selection-background-color: transparent;
103}
104
105QTreeView::item {
106  border-left: 2px solid palette(base);
107}
108
109QTreeView::item:focus {
110  border-width: 0 0 0 2px;
111  outline: none;
112}
113
114QTreeView::item:selected {
115  border-width: 0 0 0 2px;
116  color: palette(button-text);
117}
118
119QTreeView::item:hover {
120  background: palette(dark);
121}
122
123
124QTreeView::item:selected:active{
125  color: palette(button-text);
126  background: palette(dark);
127  border-color: palette(highlight);
128}
129
130QTreeView::item:selected:!active {
131  color: palette(button-text);
132  background: palette(dark);
133  border-color: palette(highlight);
134}
135
136// QTreeView::item { color: #debc85; }
137// QTreeView::item:selected { color: #00004b; }
138// QTreeView#settingsTree { background: #131313; }
139
140
141/* Scrollbar */
142/* From Quassel Wiki: http://sprunge.us/iZGB */
143QScrollBar {
144    //background: transparent;
145    background: palette(base);
146    margin: 0;
147}
148QScrollBar:hover {
149    /* Optional: Subtle accent of scrolling area on hover */
150    background: #161616; /* base +2 */
151}
152QScrollBar:vertical {
153    width: 8px;
154}
155QScrollBar:horizontal {
156    height: 8px;
157}
158
159QScrollBar::handle {
160    padding: 0;
161    margin: 2px;
162    border-radius: 2px;
163    border: 2px solid palette(midlight);
164    background: palette(midlight);
165}
166
167QScrollBar::handle:vertical {
168    min-height: 20px;
169    min-width: 0px;
170}
171
172QScrollBar::handle:horizontal {
173    min-width: 20px;
174    min-height: 0px;
175}
176QScrollBar::handle:hover {
177    border-color: palette(light);
178    background: palette(light);
179}
180QScrollBar::handle:pressed {
181    background: palette(highlight);
182    border-color: palette(highlight);
183}
184
185QScrollBar::add-line , QScrollBar::sub-line {
186    height: 0px;
187    border: 0px;
188}
189QScrollBar::up-arrow, QScrollBar::down-arrow {
190    border: 0px;
191    width: 0px;
192    height: 0px;
193}
194
195QScrollBar::add-page, QScrollBar::sub-page {
196    background: none;
197}
198
199/* Input Box */
200MultiLineEdit {
201    //background: palette(base);
202    //color: palette(foreground);
203}
204
205/* Widgets */
206/* http://doc.qt.nokia.com/4.7-snapshot/qdockwidget.html */
207//QMainWindow,
208QMainWindow QAbstractScrollArea {
209    //border: 0; // Remove borders.
210    border: 1px solid palette(shadow);
211}
212
213QMainWindow {
214    //background: palette(mid); // Main window trim
215}
216
217/* Splitter */
218/* The splits between QDockWidgets and QMainWindow is a different element. */
219QSplitter::handle,
220QMainWindow::separator {
221	background: palette(dark);
222}
223QSplitter::handle:horizontal:hover,
224QMainWindow::separator:vertical:hover {
225    background: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 palette(window), stop: 0.5 palette(light), stop: 1 palette(window));
226}
227
228QSplitter::handle:vertical:hover,
229QMainWindow::separator:horizontal:hover {
230    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 palette(window), stop: 0.5 palette(light), stop: 1 palette(window));
231}
232
233/* Menu Bar / Context Menues */
234QMenu {
235    margin: 5px; // A bit of nice padding around menu items.
236}
237
238/* ToolTip */
239/* Note: You cannot create transparent sections in the popup box without a mask set. Thus the black edges outside the rounded borders. */
240QToolTip {
241    border: 2px solid #202020; // palette(dark)
242    border-radius: 2px;
243    background: #131313; // palette(base)
244    color: white; // palette(text)
245}
246
247/* Tabs */
248/*
249    The palette is designed for the selected one to be darker. So we need to change it. Decided to do a simple line.
250    tab:bottom and tab:top reverse y1 and y2 on the linear gradients.
251
252    Tab Shadow: #444444 (light)
253    Tab Hover: #666
254    Tab Selected: palette(highlight)
255*/
256
257//QTabWidget{}
258//QTabWidget::pane {}
259
260QTabWidget::tab-bar {
261    alignment: center;
262}
263
264QTabBar::tab {
265    min-width: 30px;
266    height: 20px;
267}
268
269QTabBar::tab:bottom:selected {
270    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 palette(highlight), stop: 0.2 palette(highlight), stop: 0.2 transparent);
271}
272
273QTabBar::tab:top:selected {
274    background: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0, stop: 0 palette(highlight), stop: 0.2 palette(highlight), stop: 0.2 transparent);
275}
276
277QTabBar::tab:!selected {
278    color: #888;
279}
280
281QTabBar::tab:bottom:!selected {
282    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 palette(light), stop: 0.2 palette(light), stop: 0.2 transparent);
283}
284
285QTabBar::tab:top:!selected {
286    background: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0, stop: 0 palette(light), stop: 0.2 palette(light), stop: 0.2 transparent);
287}
288
289QTabBar::tab:!selected:hover {
290    color: #aaa;
291}
292
293QTabBar::tab:bottom:!selected:hover {
294    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #666, stop: 0.2 #666, stop: 0.2 transparent);
295}
296
297QTabBar::tab:top:!selected:hover {
298    background: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0, stop: 0 #666, stop: 0.2 #666, stop: 0.2 transparent);
299}
300
301/*
302** Quassel CSS
303*/
304
305/* Main Chat Background Override */
306ChatView {
307    background: #00212A;
308}
309ChatView QScrollBar {
310    background: #00212A;
311}
312ChatView QScrollBar:hover {
313    background: #00212A;
314}
315
316ChatView QScrollBar::handle {
317    border-color: #073642;
318    background: #073642;
319}
320
321ChatView QScrollBar::handle:hover {
322    border-color: #073642;
323    background: #073642;
324}
325
326/**/
327QStatusBar {}
328QStatusBar::item {
329    border: none;
330}
331QStatusBar QLabel {
332    color: #888;
333}
334
335/* https://github.com/quassel/quassel/blob/master/src/qtui/ui/msgprocessorstatuswidget.ui */
336QStatusBar MsgProcessorStatusWidget {}
337QStatusBar MsgProcessorStatusWidget QLabel#label {}
338QStatusBar MsgProcessorStatusWidget QProgressBar#progressBar {}
339
340/* https://github.com/quassel/quassel/blob/master/src/qtui/ui/coreconnectionstatuswidget.ui */
341QStatusBar CoreConnectionStatusWidget {}
342QStatusBar CoreConnectionStatusWidget QLabel#messageLabel {}
343QStatusBar CoreConnectionStatusWidget QProgressBar#progressBar {}
344QStatusBar CoreConnectionStatusWidget QLabel#lagLabel {}
345QStatusBar CoreConnectionStatusWidget QLabel#sslLabel {
346    qproperty-pixmap: none; /* Hide the SSL status icon */
347}
348
349
350/* Font */
351// Will not override if selectors are doubled up eg: "ChatLine, MultiLineEdit {}"
352// These will override anything set in Quassel's Settings.
353/**
354 * Don't bold or style MultiLineEdit text in any way otherwise you will be
355 * prone to get weird behaviour in submitting from the Input box.
356 * It will randomly bold your input if you do.
357 */
358ChatLine {
359    //font-family: "MingLiU_HKSCS-ExtB", "Courier New", Courier, Monotype;
360
361    //font-size: 13pt;
362    //font-weight: bold;
363    }
364MultiLineEdit {
365    //font-family: "MingLiU_HKSCS-ExtB", "Courier New", Courier, Monotype;
366
367    //font-size: 20px;
368    //font-weight: normal;
369    }
370ChatLine#plain {
371    //font-weight: bold;
372    }
373
374/* Font: UI Global Font */
375QWidget {
376    //font-family: consolas;
377    }
378ChatListItem {
379    font-family: consolas;
380    }
381NickListItem {
382    font-family: consolas;
383    }
384StyledLabel#topicLabel {
385    font-family: consolas;
386    font-size: 14px;
387    }
388
389
390/* Topic Box */
391StyledLabel#topicLabel { background: palette(base);  font-family: consolas; }
392
393/* Buffer / Channel List */
394/**
395    state: inactive, channel-event, unread-message, highlighted
396    type: query, channel, network
397**/
398ChatListItem { foreground: #888888; }
399ChatListItem[state="inactive"] { foreground: #555555; }
400ChatListItem[state="channel-event"] { foreground: #888888; } /* palette(button-text) */
401ChatListItem[state="unread-message"] { foreground: #268bd2; }
402ChatListItem[state="highlighted"] { foreground: #FFAA00; }
403
404ChatListItem[type="network", state="unread-message"] { foreground: #999999; }
405ChatListItem[type="network", state="highlighted"] { foreground: #999999; }
406ChatListItem[type="query", state="unread-message"] { foreground: #FFAA00; }
407
408
409/* Nick List */
410/**
411    state: away
412    type: user, category
413**/
414NickListItem[type="category"] { foreground: #debc85; }
415NickListItem[type="user"] { foreground: #cccccc; }
416NickListItem[type="user", state="away"] { foreground: #666666; }
417
418
419
420/* Chatbox Line Formatting */
421ChatLine[label="highlight"] {
422    foreground: #93a1a1;
423    background: #073642;
424}
425
426/*
427** Option: Bold highlighted text, but not the timestamp.
428*/
429/*
430ChatLine[label="highlight"] { font-weight: bold; }
431ChatLine::timestamp[label="highlight"]{ font-weight: normal; }
432*/
433
434/* Slight accent on the first two columns */
435/*ChatLine::sender { background: #101010; }*/
436/*ChatLine::timestamp { background: #101010; }*/
437/*ChatLine::contents { background: #101010; }*/
438
439/*ChatLine::sender[label="highlight"] { foreground: #839496; background: #00212A; }*/
440/*ChatLine::timestamp[label="highlight"] { foreground: #586e75; }*/
441ChatLine::timestamp[label="highlight"] { foreground: #93a1a1; }
442
443ChatLine::timestamp {  }
444
445/* ::contents == Message */
446ChatLine::contents {
447    /* Can only set background */
448}
449
450ChatLine#plain { foreground: #839496; }
451ChatLine#notice { foreground: #93a1a1; }
452ChatLine#action { foreground: #93a1a1; font-style: italic; font-weight: bold; }
453ChatLine#nick { foreground: #586e75; }
454ChatLine#mode { foreground: #586e75; }
455ChatLine#join { foreground: #586e75; }
456ChatLine#part { foreground: #586e75; }
457ChatLine#quit { foreground: #586e75; }
458ChatLine#kick { foreground: #586e75; }
459ChatLine#kill { foreground: #586e75; }
460ChatLine#server { foreground: #93a1a1; }
461ChatLine#info { foreground: #93a1a1; }
462ChatLine#error { foreground: #dc322f; }
463ChatLine#daychange { foreground: #93a1a1; }
464ChatLine#topic { foreground: #b58900; }
465//ChatLine#netsplit { foreground: #586e75; } // Old
466ChatLine#netsplit-join { foreground: #586e75; }
467ChatLine#netsplit-quit { foreground: #586e75; }
468
469ChatLine::timestamp {
470    foreground: #586e75;
471    // Resets the timestemp font during #action and other possible formatting.
472    font-style: normal;
473    font-weight: normal;
474}
475
476ChatLine::url {
477    foreground: palette(link);
478    //font-style: underline; // Uncomment if you always want an underline on links.
479}
480
481/* Sender Colors */
482ChatLine::sender#plain[sender="self"] { foreground: #586e75; }
483
484
485/* Uncomment this is you want all senders the same color: */
486// ChatLine::sender#plain { foreground: #2828B9; }
487
488/**
489 * The following are the sixteen colours used for the senders.
490 * The names are calculated by taking the hash of the nickname.
491 * Then take the modulo (the remainder) when divided by 16.
492 * Preview: http://i.imgur.com/xeRKI4H.png
493 */
494ChatLine::sender#plain[sender="0"] { foreground: #B58900; }
495ChatLine::sender#plain[sender="1"] { foreground: #CB4B16; }
496ChatLine::sender#plain[sender="2"] { foreground: #DC322f; }
497ChatLine::sender#plain[sender="3"] { foreground: #D33682; }
498ChatLine::sender#plain[sender="4"] { foreground: #6C71C4; }
499ChatLine::sender#plain[sender="5"] { foreground: #268BD2; }
500ChatLine::sender#plain[sender="6"] { foreground: #2AA198; }
501ChatLine::sender#plain[sender="7"] { foreground: #859900; }
502
503/* -32 */
504/*ChatLine::sender#plain[sender="8"] { foreground: #956900; }*/
505/*ChatLine::sender#plain[sender="9"] { foreground: #AB2B06; }*/
506/*ChatLine::sender#plain[sender="a"] { foreground: #BC120f; }*/
507/*ChatLine::sender#plain[sender="b"] { foreground: #B31662; }*/
508/*ChatLine::sender#plain[sender="c"] { foreground: #4C51A4; }*/
509/*ChatLine::sender#plain[sender="d"] { foreground: #066BB2; }*/
510/*ChatLine::sender#plain[sender="e"] { foreground: #0A8178; }*/
511/*ChatLine::sender#plain[sender="f"] { foreground: #657900; }*/
512
513/* +32 */
514ChatLine::sender#plain[sender="8"] { foreground: #D5A920; }
515ChatLine::sender#plain[sender="9"] { foreground: #EB6B36; }
516ChatLine::sender#plain[sender="a"] { foreground: #FC524f; }
517ChatLine::sender#plain[sender="b"] { foreground: #F356A2; }
518ChatLine::sender#plain[sender="c"] { foreground: #8C91E4; }
519ChatLine::sender#plain[sender="d"] { foreground: #46ABF2; }
520ChatLine::sender#plain[sender="e"] { foreground: #4AC1B8; }
521ChatLine::sender#plain[sender="f"] { foreground: #A5B920; }
522
523
524
525
526
527/*
528** mIRC formats
529*/
530ChatLine[format="bold"] { font-weight: bold;}
531ChatLine[format="italic"] { font-style: italic; }
532ChatLine[format="underline"] { font-style: underline; }
533
534/* Blues are hard to read. */
535ChatLine[fg-color="2"] { foreground: #15a; }
536ChatLine[bg-color="2"] { background: #15a; }
537ChatLine[fg-color="c"] { foreground: #15f; }
538ChatLine[bg-color="c"] { background: #15f; }
539
540/* A list of all the colors for easy convienience */
541/*
542ChatLine[fg-color="0"] { foreground: white; }
543ChatLine[bg-color="0"] { background: white; }
544ChatLine[fg-color="1"] { foreground: black; }
545ChatLine[bg-color="1"] { background: black; }
546ChatLine[fg-color="2"] { foreground: navy; }
547ChatLine[bg-color="2"] { background: navy; }
548ChatLine[fg-color="3"] { foreground: green; }
549ChatLine[bg-color="3"] { background: green; }
550ChatLine[fg-color="4"] { foreground: red; }
551ChatLine[bg-color="4"] { background: red; }
552ChatLine[fg-color="5"] { foreground: darkred; }
553ChatLine[bg-color="5"] { background: darkred; }
554ChatLine[fg-color="6"] { foreground: purple; }
555ChatLine[bg-color="6"] { background: purple; }
556ChatLine[fg-color="7"] { foreground: orange; }
557ChatLine[bg-color="7"] { background: orange; }
558ChatLine[fg-color="8"] { foreground: yellow; }
559ChatLine[bg-color="8"] { background: yellow; }
560ChatLine[fg-color="9"] { foreground: lightgreen; }
561ChatLine[bg-color="9"] { background: lightgreen; }
562ChatLine[fg-color="a"] { foreground: teal; }
563ChatLine[bg-color="a"] { background: teal; }
564ChatLine[fg-color="b"] { foreground: lightcyan; }
565ChatLine[bg-color="b"] { background: lightcyan; }
566ChatLine[fg-color="c"] { foreground: blue; }
567ChatLine[bg-color="c"] { background: blue; }
568ChatLine[fg-color="d"] { foreground: pink; }
569ChatLine[bg-color="d"] { background: pink; }
570ChatLine[fg-color="e"] { foreground: gray; }
571ChatLine[bg-color="e"] { background: gray; }
572ChatLine[fg-color="f"] { foreground: lightgray; }
573ChatLine[bg-color="f"] { background: lightgray; }
574*/
575
576
577/*
578** Experimental
579*/
580BufferViewDock[active=true] {
581    /* The circle is hardcoded into the title. */
582    /* Color only changes on a refresh (F5) (so it's pointless). */
583    /* Also colors the border in Breeze. */
584    //color: palette(highlight);
585}
586
587/*
588** OS X: Workaround Pallete {} bug
589**  - https://stackoverflow.com/questions/19748752/qt-style-qpalettewindowtext-color-reverts-after-application-starts
590*/
591
592QWidget {
593    color: #dddddd;
594}
595
596