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: #ffffff;
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: #00ff00;
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 #ff0000, stop: 0.1 #ff0000, 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:focus {
106  border: none;
107}
108
109QTreeView::item:selected {
110  border: none;
111  border-radius: 3px;
112  color: palette(button-text);
113}
114
115QTreeView::item:hover {
116  border-radius: 3px;
117  background: #000000; /* palette(dark); */
118}
119
120
121QTreeView::item:selected:active{
122  color: palette(button-text);
123  background: #040404; /* palette(dark); */
124}
125
126QTreeView::item:selected:!active {
127  color: palette(button-text);
128  background: #080808; /* palette(shadow); */
129}
130
131// QTreeView::item { color: #debc85; }
132// QTreeView::item:selected { color: #00004b; }
133// QTreeView#settingsTree { background: #131313; }
134
135
136/* Scrollbar */
137/* From Quassel Wiki: http://sprunge.us/iZGB */
138QScrollBar {
139    //background: transparent;
140    background: palette(base);
141    margin: 0;
142}
143QScrollBar:hover {
144    /* Optional: Subtle accent of scrolling area on hover */
145    background: #161616; /* base +2 */
146}
147QScrollBar:vertical {
148    width: 8px;
149}
150QScrollBar:horizontal {
151    height: 8px;
152}
153
154QScrollBar::handle {
155    padding: 0;
156    margin: 2px;
157    border-radius: 2px;
158    border: 2px solid palette(midlight);
159    background: palette(midlight);
160}
161
162QScrollBar::handle:vertical {
163    min-height: 20px;
164    min-width: 0px;
165}
166
167QScrollBar::handle:horizontal {
168    min-width: 20px;
169    min-height: 0px;
170}
171QScrollBar::handle:hover {
172    border-color: palette(light);
173    background: palette(light);
174}
175QScrollBar::handle:pressed {
176    background: palette(highlight);
177    border-color: palette(highlight);
178}
179
180QScrollBar::add-line , QScrollBar::sub-line {
181    height: 0px;
182    border: 0px;
183}
184QScrollBar::up-arrow, QScrollBar::down-arrow {
185    border: 0px;
186    width: 0px;
187    height: 0px;
188}
189
190QScrollBar::add-page, QScrollBar::sub-page {
191    background: none;
192}
193
194/* Input Box */
195MultiLineEdit {
196    //background: palette(base);
197    //color: palette(foreground);
198}
199
200/* Widgets */
201/* http://doc.qt.nokia.com/4.7-snapshot/qdockwidget.html */
202//QMainWindow,
203QMainWindow QAbstractScrollArea {
204    //border: 0; // Remove borders.
205    border: 1px solid palette(shadow);
206}
207
208QMainWindow {
209    //background: palette(mid); // Main window trim
210}
211
212/* Splitter */
213/* The splits between QDockWidgets and QMainWindow is a different element. */
214QSplitter::handle,
215QMainWindow::separator {
216	background: palette(dark);
217}
218QSplitter::handle:horizontal:hover,
219QMainWindow::separator:vertical:hover {
220    background: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 palette(window), stop: 0.5 palette(light), stop: 1 palette(window));
221}
222
223QSplitter::handle:vertical:hover,
224QMainWindow::separator:horizontal:hover {
225    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 palette(window), stop: 0.5 palette(light), stop: 1 palette(window));
226}
227
228/* Menu Bar / Context Menues */
229QMenu {
230    margin: 5px; // A bit of nice padding around menu items.
231}
232
233/* ToolTip */
234/* Note: You cannot create transparent sections in the popup box without a mask set. Thus the black edges outside the rounded borders. */
235QToolTip {
236    border: 2px solid #202020; // palette(dark)
237    border-radius: 2px;
238    background: #131313; // palette(base)
239    color: white; // palette(text)
240}
241
242/* Tabs */
243/*
244    The palette is designed for the selected one to be darker. So we need to change it. Decided to do a simple line.
245    tab:bottom and tab:top reverse y1 and y2 on the linear gradients.
246
247    Tab Shadow: #444444 (light)
248    Tab Hover: #666
249    Tab Selected: palette(highlight)
250*/
251
252//QTabWidget{}
253//QTabWidget::pane {}
254
255QTabWidget::tab-bar {
256    alignment: center;
257}
258
259QTabBar::tab {
260    min-width: 30px;
261    height: 20px;
262}
263
264QTabBar::tab:bottom:selected {
265    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 palette(highlight), stop: 0.2 palette(highlight), stop: 0.2 transparent);
266}
267
268QTabBar::tab:top:selected {
269    background: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0, stop: 0 palette(highlight), stop: 0.2 palette(highlight), stop: 0.2 transparent);
270}
271
272QTabBar::tab:!selected {
273    color: #888;
274}
275
276QTabBar::tab:bottom:!selected {
277    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 palette(light), stop: 0.2 palette(light), stop: 0.2 transparent);
278}
279
280QTabBar::tab:top:!selected {
281    background: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0, stop: 0 palette(light), stop: 0.2 palette(light), stop: 0.2 transparent);
282}
283
284QTabBar::tab:!selected:hover {
285    color: #aaa;
286}
287
288QTabBar::tab:bottom:!selected:hover {
289    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #666, stop: 0.2 #666, stop: 0.2 transparent);
290}
291
292QTabBar::tab:top:!selected:hover {
293    background: qlineargradient(x1: 0, y1: 1, x2: 0, y2: 0, stop: 0 #666, stop: 0.2 #666, stop: 0.2 transparent);
294}
295
296/*
297** Quassel CSS
298*/
299
300/* Main Chat Background Override */
301ChatView {
302    background: palette(base);
303}
304
305
306/* Font */
307// Will not override if selectors are doubled up eg: "ChatLine, MultiLineEdit {}"
308// These will override anything set in Quassel's Settings.
309/**
310 * Don't bold or style MultiLineEdit text in any way otherwise you will be
311 * prone to get weird behaviour in submitting from the Input box.
312 * It will randomly bold your input if you do.
313 */
314ChatLine {
315    //font-family: "MingLiU_HKSCS-ExtB", "Courier New", Courier, Monotype;
316
317    //font-size: 13pt;
318    //font-weight: bold;
319    }
320MultiLineEdit {
321    //font-family: "MingLiU_HKSCS-ExtB", "Courier New", Courier, Monotype;
322
323    //font-size: 20px;
324    //font-weight: normal;
325    }
326ChatLine#plain {
327    //font-weight: bold;
328    }
329
330/* Font: UI Global Font */
331QWidget {
332    //font-family: consolas;
333    }
334ChatListItem {
335    font-family: consolas;
336    }
337NickListItem {
338    font-family: consolas;
339    }
340StyledLabel#topicLabel {
341    font-family: consolas;
342    font-size: 14px;
343    }
344
345
346/* Topic Box */
347StyledLabel#topicLabel { background: palette(base);  font-family: consolas; }
348
349/* Buffer / Channel List */
350/**
351    state: inactive, channel-event, unread-message, highlighted
352    type: query, channel, network
353**/
354ChatListItem { foreground: #888888; }
355ChatListItem[state="inactive"] { foreground: #555555; }
356ChatListItem[state="channel-event"] { foreground: #888888; }
357ChatListItem[state="unread-message"] { foreground: #85A83F; }
358ChatListItem[state="highlighted"] { foreground: #FFAA00; }
359
360ChatListItem[type="network", state="unread-message"] {foreground: #999999; }
361ChatListItem[type="network", state="highlighted"] {foreground: #999999; }
362ChatListItem[type="query", state="unread-message"] { foreground: #FFAA00; }
363
364
365/* Nick List */
366/**
367    state: away
368    type: user, category
369**/
370NickListItem[type="category"] { foreground: #debc85; }
371NickListItem[type="user"] { foreground: #cccccc; }
372NickListItem[type="user", state="away"] { foreground: #666666; }
373
374
375
376/* Chatbox Line Formatting */
377
378ChatLine[label="highlight"] {
379    foreground: #8db7bd;
380    background: #192527; // 3a557b
381}
382
383/*
384** Option: Bold highlighted text, but not the timestamp.
385*/
386/*
387ChatLine[label="highlight"] { font-weight: bold; }
388ChatLine::timestamp[label="highlight"]{ font-weight: normal; }
389*/
390
391/* Slight accent on the first two columns */
392ChatLine::sender { background: #101010; }
393ChatLine::timestamp { background: #101010; }
394/*ChatLine::contents { background: #101010; }*/
395
396ChatLine::sender[label="highlight"] { foreground: #5e7c80; background: #162224; }
397ChatLine::timestamp[label="highlight"] { foreground: #5e7c80; background: #162224; }
398
399ChatLine::timestamp {  }
400
401/* ::contents == Message */
402ChatLine::contents {
403  /* Can only set background */
404}
405
406ChatLine#plain { foreground: #b8b8bb; }
407ChatLine#notice { foreground: #A6E22E; }
408ChatLine#action { foreground: #F92672; font-style: italic; }
409ChatLine#nick { foreground: #75715E; }
410ChatLine#mode { foreground: #75715E; font-weight: bold; }
411ChatLine#join { foreground: #75715E; }
412ChatLine#part { foreground: #75715E; }
413ChatLine#quit { foreground: #75715E; }
414ChatLine#kick { foreground: #75715E; }
415ChatLine#kill { foreground: #75715E; }
416ChatLine#server { foreground: #A6E22E; }
417ChatLine#info { foreground: #A6E22E; }
418ChatLine#error { foreground: #FD971F; }
419ChatLine#daychange { foreground: #A6E22E; }
420ChatLine#topic { foreground: #FD971F; }
421//ChatLine#netsplit { foreground: #996633; } // Old
422ChatLine#netsplit-join { foreground: #996633; }
423ChatLine#netsplit-quit { foreground: #996633; }
424
425ChatLine::timestamp {
426    foreground: #707C70;
427    // Resets the timestemp font during #action and other possible formatting.
428    font-style: normal;
429    font-weight: normal;
430}
431
432ChatLine::url {
433    foreground: palette(link);
434    //font-style: underline; // Uncomment if you always want an underline on links.
435}
436
437/* Sender Colors */
438ChatLine::sender#plain[sender="self"] { foreground: #779; }
439
440
441/* Uncomment this is you want all senders the same color: */
442// ChatLine::sender#plain { foreground: #2828B9; }
443
444/**
445 * The following are the sixteen colours used for the senders.
446 * The names are calculated by taking the hash of the nickname.
447 * Then take the modulo (the remainder) when divided by 16.
448 */
449ChatLine::sender#plain[sender="0"] { foreground: #e90d7f; }
450ChatLine::sender#plain[sender="1"] { foreground: #8e55e9; }
451ChatLine::sender#plain[sender="2"] { foreground: #b30e0e; }
452ChatLine::sender#plain[sender="3"] { foreground: #17b339; }
453ChatLine::sender#plain[sender="4"] { foreground: #58afb3; }
454ChatLine::sender#plain[sender="5"] { foreground: #9d54b3; }
455ChatLine::sender#plain[sender="6"] { foreground: #b39775; }
456ChatLine::sender#plain[sender="7"] { foreground: #3176b3; }
457ChatLine::sender#plain[sender="8"] { foreground: #e90d7f; }
458ChatLine::sender#plain[sender="9"] { foreground: #8e55e9; }
459ChatLine::sender#plain[sender="a"] { foreground: #b30e0e; }
460ChatLine::sender#plain[sender="b"] { foreground: #17b339; }
461ChatLine::sender#plain[sender="c"] { foreground: #58afb3; }
462ChatLine::sender#plain[sender="d"] { foreground: #9d54b3; }
463ChatLine::sender#plain[sender="e"] { foreground: #b39775; }
464ChatLine::sender#plain[sender="f"] { foreground: #3176b3; }
465
466
467/*
468** mIRC formats
469*/
470ChatLine[format="bold"] { font-weight: bold;}
471ChatLine[format="italic"] { font-style: italic; }
472ChatLine[format="underline"] { font-style: underline; }
473
474/* Make black text appear lighter as our theme has a dark background. */
475ChatLine[fg-color="1"] { foreground: #444; }
476ChatLine[bg-color="1"] { background: #444; }
477
478/* Blues are hard to read as well. */
479ChatLine[fg-color="2"] { foreground: #15a; }
480ChatLine[bg-color="2"] { background: #15a; }
481ChatLine[fg-color="c"] { foreground: #15f; }
482ChatLine[bg-color="c"] { background: #15f; }
483
484/* A list of all the colors for easy convienience */
485/*
486ChatLine[fg-color="0"] { foreground: white; }
487ChatLine[bg-color="0"] { background: white; }
488ChatLine[fg-color="1"] { foreground: black; }
489ChatLine[bg-color="1"] { background: black; }
490ChatLine[fg-color="2"] { foreground: navy; }
491ChatLine[bg-color="2"] { background: navy; }
492ChatLine[fg-color="3"] { foreground: green; }
493ChatLine[bg-color="3"] { background: green; }
494ChatLine[fg-color="4"] { foreground: red; }
495ChatLine[bg-color="4"] { background: red; }
496ChatLine[fg-color="5"] { foreground: darkred; }
497ChatLine[bg-color="5"] { background: darkred; }
498ChatLine[fg-color="6"] { foreground: purple; }
499ChatLine[bg-color="6"] { background: purple; }
500ChatLine[fg-color="7"] { foreground: orange; }
501ChatLine[bg-color="7"] { background: orange; }
502ChatLine[fg-color="8"] { foreground: yellow; }
503ChatLine[bg-color="8"] { background: yellow; }
504ChatLine[fg-color="9"] { foreground: lightgreen; }
505ChatLine[bg-color="9"] { background: lightgreen; }
506ChatLine[fg-color="a"] { foreground: teal; }
507ChatLine[bg-color="a"] { background: teal; }
508ChatLine[fg-color="b"] { foreground: lightcyan; }
509ChatLine[bg-color="b"] { background: lightcyan; }
510ChatLine[fg-color="c"] { foreground: blue; }
511ChatLine[bg-color="c"] { background: blue; }
512ChatLine[fg-color="d"] { foreground: pink; }
513ChatLine[bg-color="d"] { background: pink; }
514ChatLine[fg-color="e"] { foreground: gray; }
515ChatLine[bg-color="e"] { background: gray; }
516ChatLine[fg-color="f"] { foreground: lightgray; }
517ChatLine[bg-color="f"] { background: lightgray; }
518*/
519
520
521/*
522** Experimental
523*/
524BufferViewDock[active=true] {
525    /* The circle is hardcoded into the title. */
526    /* Color only changes on a refresh (F5) (so it's pointless). */
527    /* Also colors the border in Breeze. */
528    //color: palette(highlight);
529}
530
531/*
532** OS X: Workaround Pallete {} bug
533**  - https://stackoverflow.com/questions/19748752/qt-style-qpalettewindowtext-color-reverts-after-application-starts
534*/
535
536QWidget {
537    color: white;
538}
539
540