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