1
0

Dark.qss 24 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044
  1. /******************************************************************************/
  2. /* Copyright (C) 2014-2015 by Philippe Groarke <[email protected]> */
  3. /* */
  4. /* */
  5. /* This program is free software: you can redistribute it and/or modify */
  6. /* it under the terms of the GNU General Public License as published by */
  7. /* the Free Software Foundation, either version 2 of the License, or */
  8. /* (at your option) any later version. */
  9. /* */
  10. /* This program is distributed in the hope that it will be useful, */
  11. /* but WITHOUT ANY WARRANTY; without even the implied warranty of */
  12. /* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the */
  13. /* GNU General Public License for more details. */
  14. /* */
  15. /* */
  16. /* You should have received a copy of the GNU General Public License */
  17. /* along with this program. If not, see <http://www.gnu.org/licenses/>. */
  18. /******************************************************************************/
  19. /* Colors */
  20. /* rgb(225,224,225); /* veryLight */
  21. /* rgb(200,199,200); /* lighter */
  22. /* rgb(122,121,122); /* light */
  23. /* rgb(88,87,88); /* kindaDark */
  24. /* rgb(58,57,58); /* dark */
  25. /* rgb(31,30,31); /* veryDark */
  26. /* rgb(11,10,11); /* veryVeryDark */
  27. /* rgb(42,130,218); /* blue */
  28. OBSThemeMeta {
  29. dark: 'true';
  30. author: 'Warchamp7';
  31. }
  32. /* Custom theme information. This will set the application's QPalette, as
  33. * well as pass to QML via the OBSTheme object.
  34. * Can also use OBSTheme::disabled, OBSTheme::active, and OBSTheme::inactive.
  35. * Using it without will set all three (making 'active' a bit redundant) */
  36. OBSTheme {
  37. window: rgb(58,57,58); /* dark */
  38. windowText: rgb(225,224,225); /* veryLight */
  39. base: rgb(31,30,31); /* veryDark */
  40. alternateBase: rgb(11,10,11); /* veryVeryDark */
  41. text: rgb(225,224,225); /* veryLight */
  42. button: rgb(88,87,88); /* kindaDark */
  43. buttonText: rgb(225,224,225); /* veryLight */
  44. brightText: rgb(200,199,200); /* lighter */
  45. light: rgb(88,87,88); /* kindaDark */
  46. mid: rgb(58,57,58); /* dark */
  47. dark: rgb(31,30,31); /* veryDark */
  48. shadow: rgb(11,10,11); /* veryVeryDark */
  49. highlight: rgb(42,130,218); /* blue */
  50. highlightedText: rgb(0,0,0);
  51. link: rgb(114,162,255); /* OBS blue */
  52. linkVisited: rgb(114,162,255); /* OBS blue */
  53. }
  54. OBSTheme::disabled {
  55. text: rgb(122,121,122); /* light */
  56. buttonText: rgb(122,121,122); /* light */
  57. brightText: rgb(122,121,122); /* light */
  58. }
  59. OBSTheme::inactive {
  60. highlight: rgb(48,47,48);
  61. highlightedText: rgb(255,255,255);
  62. }
  63. /* General style, we override only what is needed. */
  64. QWidget {
  65. background-color: palette(window);
  66. alternate-background-color: palette(base);
  67. color: palette(window-text);
  68. selection-background-color: palette(highlight);
  69. selection-color: palette(highlighted-text);
  70. }
  71. * [frameShape="1"], * [frameShape="2"], * [frameShape="3"], * [frameShape="4"], * [frameShape="5"], * [frameShape="6"] {
  72. border: 1px solid palette(base);
  73. }
  74. /* Misc */
  75. QWidget::disabled {
  76. color: 2px solid palette(bright-text);
  77. }
  78. QAbstractItemView, QStackedWidget#stackedMixerArea QWidget {
  79. background-color: palette(base);
  80. }
  81. QToolTip {
  82. background-color: palette(base);
  83. color: rgb(205,205,205);
  84. border: none;
  85. }
  86. QMenuBar::item {
  87. background-color: palette(window);
  88. }
  89. QListView::item:selected:!active,
  90. SourceTree::item:selected:!active {
  91. color: rgb(255,255,255);
  92. background-color: rgb(48,47,48);
  93. }
  94. QListView QLineEdit,
  95. SourceTree QLineEdit {
  96. padding-top: 0px;
  97. padding-bottom: 0px;
  98. padding-right: 0;
  99. padding-left: 2px;
  100. border: none;
  101. border-radius: none;
  102. }
  103. /* Dock Widget */
  104. QDockWidget {
  105. titlebar-close-icon: url('./Dark/close.svg');
  106. titlebar-normal-icon: url('./Dark/popout.svg');
  107. }
  108. QDockWidget::title {
  109. text-align: center;
  110. background-color: rgb(70,69,70);
  111. }
  112. QDockWidget::close-button, QDockWidget::float-button {
  113. border: 1px solid transparent;
  114. background: transparent;
  115. padding: 0px;
  116. }
  117. QDockWidget::close-button:hover, QDockWidget::float-button:hover {
  118. background: transparent;
  119. }
  120. QDockWidget::close-button:pressed, QDockWidget::float-button:pressed {
  121. padding: 1px -1px -1px 1px;
  122. }
  123. /* Group Box */
  124. QGroupBox {
  125. border: 1px solid palette(base);
  126. border-radius: 5px;
  127. padding-top: 24px;
  128. font-weight: bold;
  129. }
  130. QGroupBox::title {
  131. subcontrol-origin: margin;
  132. left: 4px;
  133. top: 4px;
  134. }
  135. /* ScrollBars */
  136. ::corner {
  137. background-color: palette(window);
  138. border: none;
  139. }
  140. QScrollBar:vertical {
  141. background-color: palette(window);
  142. width: 14px;
  143. margin: 0px;
  144. }
  145. QScrollBar::handle:vertical {
  146. background-color: rgb(76,76,76);
  147. min-height: 20px;
  148. margin: 2px;
  149. border-radius: 5px;
  150. border-width: 1px;
  151. border: 1px solid rgb(76,76,76);
  152. }
  153. QScrollBar::add-line:vertical, QScrollBar::sub-line:vertical {
  154. border: none;
  155. background: none;
  156. height: 0px;
  157. }
  158. QScrollBar::up-arrow:vertical, QScrollBar::down-arrow:vertical, QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
  159. border: none;
  160. background: none;
  161. color: none;
  162. }
  163. QScrollBar:horizontal {
  164. background-color: palette(window);
  165. height: 14px;
  166. margin: 0px;
  167. }
  168. QScrollBar::handle:horizontal {
  169. background-color: rgb(76,76,76);
  170. min-width: 20px;
  171. margin: 2px;
  172. border-radius: 5px;
  173. border-width: 1px;
  174. border: 1px solid rgb(76,76,76);
  175. }
  176. QScrollBar::add-line:horizontal, QScrollBar::sub-line:horizontal {
  177. border: none;
  178. background: none;
  179. width: 0px;
  180. }
  181. QScrollBar::left-arrow:horizontal, QScrollBar::right-arrow:horizontal, QScrollBar::add-page:horizontal, QScrollBar::sub-page:horizontal {
  182. border: none;
  183. background: none;
  184. color: none;
  185. }
  186. /* Source Context */
  187. #contextContainer QPushButton[themeID2=contextBarButton] {
  188. padding: 3px;
  189. margin: 0px;
  190. }
  191. #contextContainer QPushButton#sourcePropertiesButton {
  192. qproperty-icon: url(./Dark/settings/general.svg);
  193. }
  194. #contextContainer QPushButton#sourceFiltersButton {
  195. qproperty-icon: url(./Dark/filter.svg);
  196. }
  197. #contextContainer QPushButton#sourceInteractButton {
  198. qproperty-icon: url(./Dark/interact.svg);
  199. }
  200. /* Scenes and Sources toolbar */
  201. QToolBar {
  202. background-color: palette(window);
  203. border: none;
  204. }
  205. QPushButton[toolButton="true"],
  206. QToolButton {
  207. background: transparent;
  208. border: none;
  209. padding: 1px;
  210. margin: 1px;
  211. }
  212. QPushButton[toolButton="true"]:last-child,
  213. QToolButton:last-child {
  214. margin-right: 0px;
  215. }
  216. QPushButton[toolButton="true"]:hover,
  217. QToolButton:hover {
  218. background-color: rgb(122,121,122); /* light */
  219. border-radius: none;
  220. }
  221. QPushButton[toolButton="true"]:pressed,
  222. QToolButton:pressed {
  223. background-color: palette(base);
  224. border-radius: none;
  225. }
  226. * [themeID="addIconSmall"] {
  227. qproperty-icon: url(./Dark/plus.svg);
  228. }
  229. * [themeID="removeIconSmall"] {
  230. qproperty-icon: url(./Dark/minus.svg);
  231. }
  232. * [themeID="propertiesIconSmall"] {
  233. qproperty-icon: url(./Dark/settings/general.svg);
  234. }
  235. * [themeID="configIconSmall"] {
  236. qproperty-icon: url(./Dark/settings/general.svg);
  237. }
  238. * [themeID="refreshIconSmall"] {
  239. qproperty-icon: url(./Dark/refresh.svg);
  240. }
  241. * [themeID="upArrowIconSmall"] {
  242. qproperty-icon: url(./Dark/up.svg);
  243. }
  244. * [themeID="downArrowIconSmall"] {
  245. qproperty-icon: url(./Dark/down.svg);
  246. }
  247. * [themeID="pauseIconSmall"] {
  248. qproperty-icon: url(./Dark/media-pause.svg);
  249. }
  250. * [themeID="menuIconSmall"] {
  251. qproperty-icon: url(./Dark/dots-vert.svg);
  252. }
  253. * [themeID="cogsIcon"] {
  254. qproperty-icon: url(./Dark/cogs.svg);
  255. }
  256. /* Tab Widget */
  257. QTabWidget::pane { /* The tab widget frame */
  258. border-top: 1px solid palette(base); /* veryDark */
  259. }
  260. QTabWidget::tab-bar {
  261. alignment: left;
  262. }
  263. QTabBar::tab {
  264. background-color: rgb(76,76,76);
  265. border: none;
  266. padding: 5px;
  267. min-width: 50px;
  268. margin: 1px;
  269. }
  270. QTabBar::tab:top {
  271. border-bottom: 1px transparent;
  272. border-top-left-radius: 3px;
  273. border-top-right-radius: 3px;
  274. }
  275. QTabBar::tab:bottom {
  276. padding-top: 1px;
  277. margin-bottom: 4px;
  278. border-bottom-left-radius: 3px;
  279. border-bottom-right-radius: 3px;
  280. height: 14px;
  281. }
  282. QTabBar::tab:selected {
  283. background-color: palette(base);
  284. }
  285. QTabBar::tab:hover {
  286. background-color: rgb(122,121,122); /* light */
  287. }
  288. QTabBar::tab:pressed {
  289. background-color: palette(base);
  290. }
  291. /* ComboBox */
  292. QDateTimeEdit,
  293. QComboBox {
  294. background-color: rgb(76,76,76);
  295. border-style: solid;
  296. border: 1px;
  297. border-radius: 3px;
  298. border-color: rgb(76,76,76); /* veryDark */
  299. padding: 2px;
  300. padding-left: 10px;
  301. }
  302. QDateTimeEdit:hover,
  303. QComboBox:hover {
  304. background-color: palette(button);
  305. }
  306. QDateTimeEdit::drop-down,
  307. QComboBox::drop-down {
  308. border:none;
  309. border-left: 1px solid rgba(31,30,31,155); /* veryDark */
  310. width: 20px;
  311. }
  312. QDateTimeEdit::down-arrow,
  313. QComboBox::down-arrow {
  314. qproperty-alignment: AlignTop;
  315. image: url(./Dark/updown.svg);
  316. width: 100%;
  317. }
  318. QDateTimeEdit:on,
  319. QComboBox:on {
  320. background-color: palette(base);
  321. }
  322. QDateTimeEdit:editable,
  323. QComboBox:editable {
  324. border-top-left-radius: 0px;
  325. border-bottom-left-radius: 0px;
  326. }
  327. QDateTimeEdit::drop-down:editable,
  328. QComboBox::drop-down:editable {
  329. border-top-right-radius: 3px;
  330. border-bottom-right-radius: 3px;
  331. }
  332. QDateTimeEdit::down-arrow:editable,
  333. QComboBox::down-arrow:editable {
  334. qproperty-alignment: AlignTop;
  335. image: url(./Dark/down.svg);
  336. width: 8%;
  337. }
  338. /* Textedits etc */
  339. QLineEdit, QTextEdit, QPlainTextEdit {
  340. background-color: palette(base);
  341. border: none;
  342. border-radius: 3px;
  343. padding: 2px 2px 3px 7px;
  344. }
  345. /* Spinbox and doubleSpinbox */
  346. QSpinBox, QDoubleSpinBox {
  347. background-color: palette(base);
  348. border: none;
  349. border-radius: 3px;
  350. margin: 0px 3px 0px 0px;
  351. padding: 2px 2px 3px 7px;
  352. }
  353. QSpinBox::up-button, QDoubleSpinBox::up-button {
  354. subcontrol-origin: margin;
  355. subcontrol-position: top right; /* position at the top right corner */
  356. background-color: rgb(76,76,76);
  357. border: 1px solid palette(base);
  358. border-radius: 3px;
  359. border-width: 0;
  360. border-bottom-left-radius: 0;
  361. border-bottom-right-radius: 0;
  362. border-bottom-width: 0;
  363. }
  364. QSpinBox::down-button, QDoubleSpinBox::down-button {
  365. subcontrol-origin: margin;
  366. subcontrol-position: bottom right; /* position at the top right corner */
  367. background-color: rgb(76,76,76);
  368. border: 1px solid palette(base);
  369. border-radius: 3px;
  370. border-width: 0;
  371. border-top-left-radius: 0;
  372. border-top-right-radius: 0;
  373. border-top-width: 0;
  374. }
  375. QSpinBox::up-button:hover, QSpinBox::down-button:hover, QDoubleSpinBox::up-button:hover, QDoubleSpinBox::down-button:hover {
  376. background-color: rgb(122,121,122); /* light */
  377. }
  378. QSpinBox::up-button:pressed, QSpinBox::down-button:pressed, QDoubleSpinBox::up-button:pressed, QDoubleSpinBox::down-button:pressed {
  379. background-color: palette(window);
  380. }
  381. QSpinBox::up-button:disabled, QSpinBox::up-button:off, QSpinBox::down-button:disabled, QSpinBox::down-button:off {
  382. background-color: palette(window);
  383. }
  384. QDoubleSpinBox::up-button:disabled, QDoubleSpinBox::up-button:off, QDoubleSpinBox::down-button:disabled, QDoubleSpinBox::down-button:off {
  385. background-color: palette(window);
  386. }
  387. QSpinBox::up-arrow, QDoubleSpinBox::up-arrow {
  388. image: url(./Dark/up.svg);
  389. width: 100%;
  390. }
  391. QSpinBox::down-arrow, QDoubleSpinBox::down-arrow {
  392. image: url(./Dark/down.svg);
  393. width: 100%;
  394. }
  395. /* Buttons */
  396. QPushButton {
  397. color: palette(window-text);
  398. background-color: rgb(76,76,76);
  399. border: none;
  400. border-radius: 3px;
  401. padding: 4px;
  402. padding-left: 20px;
  403. padding-right: 20px;
  404. }
  405. QPushButton::flat {
  406. background-color: palette(window);
  407. }
  408. QPushButton:checked {
  409. background-color: palette(base);
  410. }
  411. QPushButton:hover {
  412. background-color: rgb(122,121,122); /* light */
  413. }
  414. QPushButton:pressed {
  415. background-color: palette(base);
  416. }
  417. QPushButton:disabled {
  418. background-color: rgb(46,45,46);
  419. }
  420. QPushButton::menu-indicator {
  421. image: url(./Dark/down.svg);
  422. subcontrol-position: right;
  423. subcontrol-origin: padding;
  424. width: 25px;
  425. }
  426. /* Sliders */
  427. QSlider::groove:horizontal {
  428. background-color: rgb(76,76,76);
  429. height: 4px;
  430. border: none;
  431. border-radius: 2px;
  432. }
  433. QSlider::handle:horizontal {
  434. background-color: rgb(210,210,210);
  435. border: 1px solid palette(window);
  436. border-radius: 3px;
  437. height: 10px;
  438. width: 18px;
  439. margin: -3px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
  440. }
  441. QSlider::handle:horizontal:pressed {
  442. background-color: rgb(210,210,210);
  443. }
  444. QSlider::sub-page:horizontal {
  445. background-color: palette(highlight);
  446. border-radius: 2px;
  447. }
  448. QSlider::sub-page:horizontal:disabled {
  449. background-color: rgb(50,49,50); /* dark */
  450. border-radius: 2px;
  451. }
  452. QSlider::groove:vertical {
  453. background-color: rgb(76,76,76);
  454. width: 4px;
  455. border: none;
  456. border-radius: 2px;
  457. }
  458. QSlider::handle:vertical {
  459. background-color: rgb(210,210,210);
  460. border: 1px solid palette(window);
  461. border-radius: 3px;
  462. width: 10px;
  463. height: 18px;
  464. margin: 0 -3px; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
  465. }
  466. QSlider::handle:vertical:pressed {
  467. background-color: rgb(210,210,210);
  468. }
  469. QSlider::add-page:vertical {
  470. background-color: palette(highlight);
  471. border-radius: 2px;
  472. }
  473. QSlider::add-page:vertical:disabled {
  474. background-color: rgb(50,49,50); /* dark */
  475. border-radius: 2px;
  476. }
  477. QSlider::handle:hover {
  478. background-color: palette(bright-text);
  479. }
  480. QSlider::handle:disabled {
  481. background-color: rgb(122,121,122); /* light */
  482. }
  483. /* Volume Control */
  484. VolumeMeter {
  485. qproperty-backgroundNominalColor: rgb(38,127,38);
  486. qproperty-backgroundWarningColor: rgb(127,127,38);
  487. qproperty-backgroundErrorColor: rgb(127,38,38);
  488. qproperty-foregroundNominalColor: rgb(76,255,76);
  489. qproperty-foregroundWarningColor: rgb(255,255,76);
  490. qproperty-foregroundErrorColor: rgb(255,76,76);
  491. qproperty-magnitudeColor: rgb(0,0,0);
  492. qproperty-majorTickColor: palette(window-text);
  493. qproperty-minorTickColor: rgb(122,121,122); /* light */
  494. qproperty-meterThickness: 3;
  495. /* The meter scale numbers normally use your QWidget font, with size */
  496. /* multiplied by meterFontScaling to get a proportionally smaller font. */
  497. /* To use a unique font for the numbers, specify font-family and/or */
  498. /* font-size here, and set meterFontScaling to 1.0. */
  499. qproperty-meterFontScaling: 0.7;
  500. }
  501. /* Status Bar */
  502. QStatusBar::item {
  503. border: none;
  504. }
  505. /* Table View */
  506. QTableView {
  507. gridline-color: palette(light);
  508. }
  509. QHeaderView::section {
  510. background-color: palette(window);
  511. color: palette(window-text);
  512. border: 1px solid palette(base);
  513. border-radius: 5px;
  514. }
  515. /* Mute CheckBox */
  516. MuteCheckBox {
  517. outline: none;
  518. }
  519. MuteCheckBox::indicator:checked {
  520. image: url(./Dark/mute.svg);
  521. }
  522. MuteCheckBox::indicator:unchecked {
  523. image: url(./Dark/settings/audio.svg);
  524. }
  525. OBSHotkeyLabel[hotkeyPairHover=true] {
  526. color: red;
  527. }
  528. /* Pause */
  529. PauseCheckBox {
  530. outline: none;
  531. }
  532. PauseCheckBox::indicator:checked {
  533. image: url(:/res/images/media-pause.svg);
  534. }
  535. PauseCheckBox::indicator:unchecked {
  536. image: url(:/res/images/media-play.svg);
  537. }
  538. /* Group Collapse Checkbox */
  539. SourceTreeSubItemCheckBox {
  540. background: transparent;
  541. outline: none;
  542. }
  543. SourceTreeSubItemCheckBox::indicator {
  544. width: 10px;
  545. height: 10px;
  546. }
  547. SourceTreeSubItemCheckBox::indicator:checked {
  548. image: url(./Dark/expand.svg);
  549. }
  550. SourceTreeSubItemCheckBox::indicator:unchecked {
  551. image: url(./Dark/down.svg);
  552. }
  553. /* Label warning/error */
  554. QLabel#warningLabel {
  555. color: rgb(192,128,0);
  556. font-weight: bold;
  557. }
  558. QLabel#errorLabel {
  559. color: rgb(192,0,0);
  560. font-weight: bold;
  561. }
  562. * [themeID="warning"] {
  563. color: rgb(192,128,0);
  564. font-weight: bold;
  565. }
  566. * [themeID="error"] {
  567. color: rgb(192,0,0);
  568. font-weight: bold;
  569. }
  570. * [themeID="good"] {
  571. color: rgb(0,192,0);
  572. font-weight: bold;
  573. }
  574. /* About dialog */
  575. * [themeID="aboutName"] {
  576. font-size: 36px;
  577. font-weight: bold;
  578. }
  579. * [themeID="aboutVersion"] {
  580. font-size: 16px;
  581. margin-bottom: 20px;
  582. }
  583. * [themeID="aboutInfo"] {
  584. margin-bottom: 20px;
  585. }
  586. * [themeID="aboutHLayout"] {
  587. background-color: palette(base);
  588. }
  589. /* Preview background color */
  590. OBSQTDisplay {
  591. qproperty-displayBackgroundColor: rgb(76,76,76);
  592. }
  593. /* Preview/Program labels */
  594. * [themeID="previewProgramLabels"] {
  595. font-size: 18px;
  596. font-weight: bold;
  597. color: rgb(122,121,122);
  598. }
  599. /* Settings Icons */
  600. OBSBasicSettings {
  601. qproperty-generalIcon: url(./Dark/settings/general.svg);
  602. qproperty-streamIcon: url(./Dark/settings/stream.svg);
  603. qproperty-outputIcon: url(./Dark/settings/output.svg);
  604. qproperty-audioIcon: url(./Dark/settings/audio.svg);
  605. qproperty-videoIcon: url(./Dark/settings/video.svg);
  606. qproperty-hotkeysIcon: url(./Dark/settings/hotkeys.svg);
  607. qproperty-accessibilityIcon: url(./Dark/settings/accessibility.svg);
  608. qproperty-advancedIcon: url(./Dark/settings/advanced.svg);
  609. }
  610. OBSBasicSettings QListView::item {
  611. padding-top: 5px;
  612. padding-bottom: 5px;
  613. }
  614. /* Locked CheckBox */
  615. LockedCheckBox {
  616. outline: none;
  617. background: transparent;
  618. }
  619. LockedCheckBox::indicator:checked {
  620. image: url(./Dark/locked.svg);
  621. }
  622. LockedCheckBox::indicator:unchecked {
  623. image: url(:res/images/unlocked.svg);
  624. }
  625. /* Visibility CheckBox */
  626. VisibilityCheckBox {
  627. outline: none;
  628. background: transparent;
  629. }
  630. VisibilityCheckBox::indicator:checked {
  631. image: url(./Dark/visible.svg);
  632. }
  633. VisibilityCheckBox::indicator:unchecked {
  634. image: url(:res/images/invisible.svg);
  635. }
  636. * [themeID="trashIcon"] {
  637. qproperty-icon: url(./Dark/trash.svg);
  638. }
  639. * [themeID="revertIcon"] {
  640. qproperty-icon: url(./Dark/revert.svg);
  641. }
  642. QPushButton#extraPanelDelete {
  643. background-color: palette(base);
  644. }
  645. QPushButton#extraPanelDelete:hover {
  646. background-color: rgb(122,121,122);
  647. }
  648. QPushButton#extraPanelDelete:pressed {
  649. background-color: palette(base);
  650. }
  651. OBSMissingFiles {
  652. qproperty-warningIcon: url(./Dark/alert.svg);
  653. }
  654. /* Source Icons */
  655. OBSBasic {
  656. qproperty-imageIcon: url(./Dark/sources/image.svg);
  657. qproperty-colorIcon: url(./Dark/sources/brush.svg);
  658. qproperty-slideshowIcon: url(./Dark/sources/slideshow.svg);
  659. qproperty-audioInputIcon: url(./Dark/sources/microphone.svg);
  660. qproperty-audioOutputIcon: url(./Dark/settings/audio.svg);
  661. qproperty-desktopCapIcon: url(./Dark/settings/video.svg);
  662. qproperty-windowCapIcon: url(./Dark/sources/window.svg);
  663. qproperty-gameCapIcon: url(./Dark/sources/gamepad.svg);
  664. qproperty-cameraIcon: url(./Dark/sources/camera.svg);
  665. qproperty-textIcon: url(./Dark/sources/text.svg);
  666. qproperty-mediaIcon: url(./Dark/sources/media.svg);
  667. qproperty-browserIcon: url(./Dark/sources/globe.svg);
  668. qproperty-groupIcon: url(./Dark/sources/group.svg);
  669. qproperty-sceneIcon: url(./Dark/sources/scene.svg);
  670. qproperty-defaultIcon: url(./Dark/sources/default.svg);
  671. qproperty-audioProcessOutputIcon: url(./Dark/sources/windowaudio.svg);
  672. }
  673. /* Scene Tree */
  674. SceneTree {
  675. qproperty-gridItemWidth: 150;
  676. qproperty-gridItemHeight: 27;
  677. }
  678. *[gridMode="true"] SceneTree::item {
  679. color: palette(window-text);
  680. background-color: rgb(76,76,76);
  681. border: none;
  682. border-radius: 3px;
  683. padding: 4px;
  684. padding-left: 10px;
  685. padding-right: 10px;
  686. margin: 1px;
  687. }
  688. *[gridMode="true"] SceneTree::item:selected {
  689. background-color: rgb(122,121,122); /* light */
  690. }
  691. *[gridMode="true"] SceneTree::item:hover {
  692. background-color: rgb(122,121,122); /* light */
  693. }
  694. *[gridMode="true"] SceneTree::item:pressed {
  695. background-color: palette(base);
  696. }
  697. *[gridMode="true"] SceneTree::item:checked {
  698. background-color: rgb(122,121,122); /* light */
  699. }
  700. /* Save icon */
  701. * [themeID="replayIconSmall"] {
  702. qproperty-icon: url(./Dark/save.svg);
  703. }
  704. /* Studio Mode T-Bar */
  705. QSlider[themeID="tBarSlider"] {
  706. height: 24px;
  707. }
  708. QSlider::groove:horizontal[themeID="tBarSlider"] {
  709. border: 1px solid rgb(76,76,76);
  710. height: 5px;
  711. background: palette(base);
  712. }
  713. QSlider::sub-page:horizontal[themeID="tBarSlider"] {
  714. background: palette(base);;
  715. border: 1px solid rgb(76,76,76);
  716. }
  717. QSlider::handle:horizontal[themeID="tBarSlider"] {
  718. background-color: rgb(210,210,210);
  719. width: 12px;
  720. height: 24px;
  721. margin: -24px 0px;
  722. }
  723. /* Media icons */
  724. * [themeID="playIcon"] {
  725. qproperty-icon: url(./Dark/media/media_play.svg);
  726. }
  727. * [themeID="pauseIcon"] {
  728. qproperty-icon: url(./Dark/media/media_pause.svg);
  729. }
  730. * [themeID="restartIcon"] {
  731. qproperty-icon: url(./Dark/media/media_restart.svg);
  732. }
  733. * [themeID="stopIcon"] {
  734. qproperty-icon: url(./Dark/media/media_stop.svg);
  735. }
  736. * [themeID="nextIcon"] {
  737. qproperty-icon: url(./Dark/media/media_next.svg);
  738. }
  739. * [themeID="previousIcon"] {
  740. qproperty-icon: url(./Dark/media/media_previous.svg);
  741. }
  742. /* YouTube Integration */
  743. OBSYoutubeActions {
  744. qproperty-thumbPlaceholder: url(./Dark/sources/image.svg);
  745. }
  746. #ytEventList QLabel {
  747. color: rgb(225,224,225); /* veryLight */
  748. background-color: rgb(76,76,76);
  749. border: none;
  750. border-radius: 3px;
  751. padding: 4px 20px;
  752. }
  753. #ytEventList QLabel:hover {
  754. background: rgb(122,121,122);
  755. }
  756. #ytEventList QLabel[isSelectedEvent=true] {
  757. background: rgb(31,30,31);
  758. border: none;
  759. }
  760. /* Calendar Widget */
  761. QDateTimeEdit::down-arrow {
  762. qproperty-alignment: AlignTop;
  763. image: url(./Dark/down.svg);
  764. width: 100%;
  765. }
  766. QDateTimeEdit:on {
  767. background-color: rgb(31,30,31); /* veryDark */
  768. }
  769. /* Calendar Top Bar */
  770. QCalendarWidget QWidget#qt_calendar_navigationbar {
  771. background-color: rgb(58,57,58);
  772. padding: 4px 8px;
  773. }
  774. /* Calendar Top Bar Buttons */
  775. QCalendarWidget QToolButton {
  776. background-color: rgb(76,76,76);
  777. padding: 2px 16px;
  778. border-radius: 3px;
  779. margin: 2px;
  780. }
  781. #qt_calendar_monthbutton::menu-indicator {
  782. image: url(./Dark/down.svg);
  783. subcontrol-position: right;
  784. padding-top: 2px;
  785. padding-right: 6px;
  786. height: 10px;
  787. width: 10px;
  788. }
  789. QCalendarWidget #qt_calendar_prevmonth {
  790. padding: 2px;
  791. qproperty-icon: url(./Dark/left.svg);
  792. icon-size: 16px, 16px;
  793. }
  794. QCalendarWidget #qt_calendar_nextmonth {
  795. padding: 2px;
  796. qproperty-icon: url(./Dark/expand.svg);
  797. icon-size: 16px, 16px;
  798. }
  799. QCalendarWidget QToolButton:hover {
  800. background-color: rgb(122,121,122);
  801. border-radius: 3px;
  802. }
  803. QCalendarWidget QToolButton:pressed {
  804. background-color: rgb(31,30,31); /* veryDark */
  805. }
  806. /* Month Dropdown Menu */
  807. QCalendarWidget QMenu {
  808. }
  809. /* Year spinbox */
  810. QCalendarWidget QSpinBox {
  811. background-color: rgb(31,30,31); /* veryDark */
  812. border: none;
  813. border-radius: 3px;
  814. margin: 0px 3px 0px 0px;
  815. padding: 4px 16px;
  816. }
  817. QCalendarWidget QSpinBox::up-button { subcontrol-origin: border; subcontrol-position: top right; width: 16px; }
  818. QCalendarWidget QSpinBox::down-button {subcontrol-origin: border; subcontrol-position: bottom right; width: 16px;}
  819. QCalendarWidget QSpinBox::up-arrow { width: 10px; height: 10px; }
  820. QCalendarWidget QSpinBox::down-arrow { width: 10px; height: 10px; }
  821. /* Days of the Week Bar */
  822. QCalendarWidget QWidget { alternate-background-color: rgb(70,69,70); }
  823. QCalendarWidget QAbstractItemView:enabled {
  824. background-color: rgb(31,30,31);
  825. color: rgb(225,224,225);
  826. selection-background-color: rgb(25,51,75);
  827. selection-color: rgb(225,224,225);
  828. }
  829. QCalendarWidget QAbstractItemView:disabled {
  830. color: rgb(122,121,122);
  831. }