style-dark.css 13.4 KB
Newer Older
1 2 3 4 5 6
/*
 This is the master style sheet as well as the dark style. This style sheet should contain both
 color and size/positioning information for all styled controls. This sheet is always loaded first
 Then the user specified style sheet is loaded after it to override and color settings.
*/

7 8 9
* {
    background-color: #222;
    color: #FFF;
10
    font-size: 12pt;
pixhawk's avatar
pixhawk committed
11 12
}

13 14 15 16 17
QWidget#viewModeWidget {
    border-radius: 12px;
    border: 3px solid #465158;
}

18 19
*::disabled {
    color: #777;
pixhawk's avatar
pixhawk committed
20 21
}

22
JoystickButton QLabel {
23 24 25
    border: 1px solid #AAA;
    border-radius: 4px;
    height: 16px;
26
    padding: 0 3px;
27 28
}

pixhawk's avatar
pixhawk committed
29
QCheckBox {
30
    color: #DDD;
pixhawk's avatar
pixhawk committed
31 32 33
}

QCheckBox::indicator {
34
    border: 1px solid #777;
pixhawk's avatar
pixhawk committed
35
    border-radius: 2px;
36 37
    width: 10px;
    height: 10px;
pixhawk's avatar
pixhawk committed
38 39
}

40 41 42 43 44 45 46 47 48
QCheckBox::indicator:hover {
    background-color: #CCC;
}

QCheckBox::indicator:pressed, QCheckBox::indicator:checked:pressed {
    background-color: #777;
}

QCheckBox::indicator:checked {
49
    background-color: #B8D3E6;
pixhawk's avatar
pixhawk committed
50 51
}

52 53 54 55 56 57 58 59
QCheckBox::indicator:disabled {
    border-color: #555;
}

QCheckBox::indicator:disabled:checked {
    background-color: #333;
}

60 61
QComboBox {
    border: 1px solid #777;
pixhawk's avatar
pixhawk committed
62 63 64
    border-radius: 2px;
}

65 66
QDialog {
    border: 1px solid #62676B;
pixhawk's avatar
pixhawk committed
67 68 69
    border-radius: 2px;
}

70
QDockWidget {
71
    border: 1px solid #666;
72
    border-radius: 1px;
73
}
pixhawk's avatar
pixhawk committed
74

Lorenz Meier's avatar
Lorenz Meier committed
75 76 77
QDockWidget::close-button, QDockWidget::float-button {
    background: none;
}
78

Lorenz Meier's avatar
Lorenz Meier committed
79
QDockWidget::close-button:hover, QDockWidget::float-button:hover {
80
    background: #B8D3E6;
Lorenz Meier's avatar
Lorenz Meier committed
81
}
82

Lorenz Meier's avatar
Lorenz Meier committed
83
QDockWidget::close-button:pressed, QDockWidget::float-button:pressed {
84
    padding: 1px -1px -1px 1px;
85
    background: #899FAD;
pixhawk's avatar
pixhawk committed
86 87 88 89
}

QDockWidget::title {
    text-align: left;
Lorenz Meier's avatar
Lorenz Meier committed
90 91 92
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #3F556A, stop: 1 #293645);
    color: #EDEDED;
    height: 14px;
Lorenz Meier's avatar
Lorenz Meier committed
93
    padding-left: 2.5em;
pixhawk's avatar
pixhawk committed
94 95
}

96 97 98 99 100
QGCMAVLinkLogPlayer {
    background: none;
}

QGCMAVLinkLogPlayer QLabel {
101
    color: #FFF;
102 103 104
}

QGCMAVLinkLogPlayer QLabel:disabled {
105
    color: #AAA;
106 107
}

108 109 110 111 112
QGCToolWidgetItem {
    border: 1px solid #666;
    border-radius: 3px;
    padding: 10px 0 0 0;
    margin-top: 1ex; /* leave space at the top for the title */
pixhawk's avatar
pixhawk committed
113 114
}

115 116 117 118
QGCUnconnectedInfoWidget QPushButton {
    border-radius: 18px;
}

119 120 121 122 123
QGroupBox {
    border: 1px solid #666;
    border-radius: 3px;
    padding: 10px 0 0 0;
    margin-top: 1ex; /* leave space at the top for the title */
pixhawk's avatar
pixhawk committed
124 125
}

126 127 128 129 130 131 132
QGroupBox::title {
    subcontrol-origin: margin;
    subcontrol-position: top center;
    margin: 0 3px 0 3px;
    padding: 0 3px 0 0;
    font: bold 8px;
    color: #DDD;
pixhawk's avatar
pixhawk committed
133 134
}

135 136 137 138 139 140 141
QHeaderView::section {
    border: none;
	border-right: 1px solid #969696;
	padding: 2px 0 2px 4px;
    background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #4B4B4B, stop: 0.3 #404040, stop: 0.34 #383838, stop:1 #181818);
}

142 143
QLabel {
    background-color: transparent;
pixhawk's avatar
pixhawk committed
144
}
145

146
QLabel:disabled {
147 148
    color: #444;
    border-color: #444;
pixhawk's avatar
pixhawk committed
149 150
}

151 152 153 154
QLabel#noUas {
    font-size: 30pt;
}

155 156 157
QMessageBox {
    min-width: 400px;
    min-height: 300px;
158 159
}

Lorenz Meier's avatar
Lorenz Meier committed
160 161 162 163 164 165 166
QLabel#tabTitleLabel {
    font-size: 28pt;
    font-weight: lighter;
    margin-top: 16px;
    margin-bottom: 8px;
}

167 168 169 170 171
QLabel#instructionLabel {
    color: #FEC654;
    font-size: 26pt;
}

172 173
QLineEdit {
    border: 1px solid #777;
174
    border-radius: 2px;
pixhawk's avatar
pixhawk committed
175 176
}

177
QMainWindow::separator {
178 179 180
    background-color: #323235;
    width: 2px; /* when vertical */
    height: 2px; /* when horizontal */
181 182
}

183 184
QMainWindow::separator:hover {
    background-color: #FFF;
pixhawk's avatar
pixhawk committed
185 186
}

187
QMenu {
188
    border: 1px solid #B8D3E6;
pixhawk's avatar
pixhawk committed
189 190
}

Bryant's avatar
Bryant committed
191
QMenu::item:selected, QMenu::item:checked:selected {
192 193
    background-color: #CCC;
    color: #000;
194 195
}

196 197
QMenu::item:checked {
    background-color: #B8D3E6;
198
    color: #000;
199 200
}

201 202
QMenu::separator {
    height: 1px;
203
    background: #B8D3E6;
204
    margin: 8px 5px 4px 5px;
pixhawk's avatar
pixhawk committed
205 206
}

207 208 209 210 211 212 213 214
/*
 * Fix for bug in Qt5 where QMenuBar items are styled natively on Windows, ignoring inherited settings.
 * so we explicitly set their background color here (should match catch-all style background color).
 */
QMenuBar::item {
    background-color: #222;
}

215
QMenuBar::item:selected {
216 217
    background-color: #CCC;
    color: #000;
218
}
219

220
QMenuBar::item:disabled {
221 222
    border: none;
    background: none;
223
}
224

225 226 227 228 229
QPlainTextEdit {
    border: 1px solid #777;
    border-radius: 2px;
    font-family: "Monospace";
    font: large;
230
}
231

232 233 234 235 236 237
QProgressBar {
    border: 1px solid #4A4A4A;
    border-radius: 4px;
    text-align: center;
    padding: 2px;
    color: #DDD;
238
    background: #111;
239
    height: 10px;
240 241
}

242 243
QProgressBar::chunk {
    background-color: #3C7B9E;
Lorenz Meier's avatar
Lorenz Meier committed
244 245
}

246 247 248
QProgressBar::chunk#batteryBar {
    background-color: green;
}
249

250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265
QProgressBar::chunk#speedBar {
    background-color: yellow;
}

QProgressBar::chunk#thrustBar {
    background-color: orange;
}

QProgressBar:horizontal {
    height: 9px;
}

QProgressBar:vertical {
    width: 9px;
}

266
QPushButton, QToolButton {
267 268 269 270
    min-height: 20px;
    max-height: 20px;
    border: 1px solid #465158;
    margin: 1px;
271
    border-radius: 4px;
272 273
    padding-left: 8px;
    padding-right: 8px;
274
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #777, stop: 1 #333);
275 276
}

277
VehicleSetupButton, VehicleComponentButton {
278 279 280 281 282 283 284 285
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #333, stop: 1 #111);
    border-radius: 5px;
    min-height: 64px;
    max-height: 64px;
    min-width: 80px;
    border: 1px solid #000000;
}

Lorenz Meier's avatar
Lorenz Meier committed
286 287 288
QPushButton#planePushButton, QPushButton#flyingWingPushButton, QPushButton#quadXPushButton,
QPushButton#quadPlusPushButton, QPushButton#hexaXPushButton, QPushButton#hexaPlusPushButton,
QPushButton#octoXPushButton, QPushButton#octoPlusPushButton, QPushButton#hPushButton {
289
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #777, stop: 1 #333);
Lorenz Meier's avatar
Lorenz Meier committed
290
    border-radius: 5px;
Lorenz Meier's avatar
Lorenz Meier committed
291 292 293
    min-height: 140px;
    max-height: 240px;
    min-width: 140px;
Lorenz Meier's avatar
Lorenz Meier committed
294
    border: 1px solid #465158;
295 296
}

297 298 299 300 301 302 303
QPushButton:checked#planePushButton, QPushButton:checked#flyingWingPushButton, QPushButton:checked#quadXPushButton,
QPushButton:checked#quadPlusPushButton, QPushButton:checked#hexaXPushButton, QPushButton:checked#hexaPlusPushButton,
QPushButton:checked#octoXPushButton, QPushButton:checked#octoPlusPushButton, QPushButton:checked#hPushButton {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #77F, stop: 1 #33A);
    border: 3px solid #4651A8;
}

304 305 306 307 308 309 310 311 312 313
QPushButton#viewModeGeneric, QPushButton#viewModePX4, QPushButton#viewModeAPM, QPushButton#viewModeAR {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #73D95D, stop: 1 #18A154);
    border-radius: 12px;
    min-height: 120px;
    max-height: 140px;
    min-width: 120px;
    max-width: 140px;
    border: 3px solid #465158;
}

Lorenz Meier's avatar
Lorenz Meier committed
314
QPushButton#magButton, QPushButton#gyroButton, QPushButton#accelButton {
315 316 317
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #757575, stop: 1 #333);
    border-radius: 5px;
    border: 1px solid #000000;
Lorenz Meier's avatar
Lorenz Meier committed
318 319
}

320 321 322 323 324 325
QWidget#containerWidget {
    background-color: qlineargradient(spread:pad, x1:0.527222, y1:0.961, x2:0.536946, y2:0.198864, stop:0.103448 rgba(65, 65, 65, 255), stop:1 rgba(119, 119, 119, 255));
    border-radius: 16px;
    border: 2px solid #CCCCCC;
}

326 327 328 329 330 331
QWidget#navBarWidget {
    background-color: qlineargradient(spread:pad, x1:0, y1:0, x2:1, y2:0, stop:0 #404040, stop:1 #727272);
    border-radius: 0px;
    border: 1px solid #222222;
}

332
QPushButton#connectButton, QPushButton#controlButton {
333
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #73D95D, stop: 1 #18A154);
334 335
}

336 337
QPushButton#controlButton {
    min-height: 25px;
pixhawk's avatar
pixhawk committed
338 339
}

340
QPushButton#deleteButton, QPushButton#killButton {
341
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #D9002F, stop: 1 #AC0025);
342 343
}

344
QPushButton:checked, QToolButton:checked {
345 346 347
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #09A2B2, stop: 1 #414B52);
}

348
QPushButton:checked#connectButton, QPushButton:checked#controlButton {
349
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #E38000, stop: 1 #945F00);
350 351 352
    color: #000;
}

353 354 355 356 357 358 359 360
QPushButton:checked:hover#connectButton, QPushButton:checked:hover#controlButton {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #FF9000, stop: 1 #B37300);
}

QPushButton:checked:pressed#connectButton, QPushButton:checked:pressed#controlButton {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #DB7C00, stop: 1 #825400);
}

361
QPushButton:disabled, QToolButton:disabled {
362 363 364
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #232228, stop: 1 #020208);
}

365
QPushButton:hover, QToolButton:hover {
366
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #59666F, stop: 1 #414B52);
367 368
}

369 370 371 372
QPushButton:hover#connectButton, QPushButton:hover#controlButton {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #87FF6D, stop: 1 #1FD16D);
}

373
QPushButton:hover#deleteButton, QPushButton#killButton {
374 375 376
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #F20034, stop: 1 #9E0022);
}

377
QPushButton:pressed, QToolButton:pressed {
378 379 380
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #bbbbbb, stop: 1 #b0b0b0);
}

381 382 383 384
QPushButton:pressed#connectButton, QPushButton:pressed#controlButton {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #62B84E, stop: 1 #148A47);
}

385
QPushButton:pressed#deleteButton, QPushButton#killButton {
386 387 388
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #C9002C, stop: 1 #9C0021);
}

389 390 391 392
QScrollBar {
    border: 1px solid #333;
}

393 394
QSeparator {
    color: #EEE;
pixhawk's avatar
pixhawk committed
395 396
}

397 398
QSlider {
    background-color: transparent;
pixhawk's avatar
pixhawk committed
399 400
}

401
QSlider::groove:horizontal {
402
    border: 1px solid #999;
403 404 405
    height: 4px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */
    background-color: #4A4A4A;
    margin: 2px 0;
pixhawk's avatar
pixhawk committed
406 407
}

408 409
QSlider::groove:horizontal:disabled {
    border: 1px solid #454545;
410
    background-color: #4A4A4A;
411 412 413 414 415
    height: 4px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */
    margin: 2px 0;
}
 
QSlider::groove:vertical {
416
    border: 1px solid #999;
417 418 419
    width: 4px; /* the groove expands to the size of the slider by default. by giving it a height, it has a fixed size */
    background-color: #4A4A4A;
    margin: 2px 0;
pixhawk's avatar
pixhawk committed
420 421
}

422 423
QSlider::handle:horizontal {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #232228, stop: 1 #020208);
424
    border: 2px solid #B8D3E6;
425 426 427
    width: 18px;
    margin: -5px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
    border-radius: 3px;
pixhawk's avatar
pixhawk committed
428 429
}

430 431
QSlider::handle:horizontal:disabled {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #535258, stop: 1 #050508);
432
    border: 2px solid #444;
433 434 435
    width: 18px;
    margin: -5px 0; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
    border-radius: 3px;
pixhawk's avatar
pixhawk committed
436 437
}

438 439
QSlider::handle:vertical {
    background-color: qlineargradient(x1: 0, y1: 0, x2: 1, y2: 0, stop: 0 #232228, stop: 1 #020208);
440
    border: 2px solid #B8D3E6;
441 442 443
    height: 18px;
    margin: 0 -5px; /* handle is placed by default on the contents rect of the groove. Expand outside the groove */
    border-radius: 3px;
pixhawk's avatar
pixhawk committed
444 445
}

446 447
QSizeGrip {
    background: none;
pixhawk's avatar
pixhawk committed
448 449
}

450 451 452
QSpinBox, QDoubleSpinBox {
    min-height: 14px;
    max-height: 18px;
453
    border: 1px solid #777;
454
    border-radius: 5px;
pixhawk's avatar
pixhawk committed
455
}
456

457 458 459
QSpinBox::down-arrow, QDoubleSpinBox::down-arrow {
    image: url(:/files/images/actions/go-down.svg);
    width: 16px;
460 461
}

462 463
QSpinBox::down-button, QDoubleSpinBox::down-button {
    border: none;
464
}
465

466 467 468 469 470 471 472 473 474 475
QSpinBox::up-arrow, QDoubleSpinBox::up-arrow {
    image: url(:/files/images/actions/go-up.svg);
    width: 16px;
}

QSpinBox::up-button, QDoubleSpinBox::up-button {
    border: none;
}

QStatusBar {
476
    background-color: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #4B4B4B, stop: 0.3 #404040, stop:0.34 #383838, stop:1 #181818);
477
}
478

479
QTabBar::tab {
480
    border: 2px solid #62676B;
Lorenz Meier's avatar
Lorenz Meier committed
481 482 483
    border-radius: 4px;
    min-width: 8ex;
    padding: 2px;
484
}
485

486
QTabBar::tab:hover {
487
    border: 2px solid #B8D3E6;
488
}
489

490
QTabBar::tab:selected {
491
    border: 2px solid #B8D3E6;
492
    background: #555;
493 494
}

495 496 497
QTabWidget::tab-bar {
    alignment: center;
}
LM's avatar
LM committed
498

499 500 501 502 503
QTabWidget::pane {
    border: 1px solid #62676B;
    border-radius: 2px;
    position: absolute;
    top: -0.5em;
504 505
}

506 507 508
QTextEdit {
    border: 1px solid #777;
    border-radius: 2px;
LM's avatar
LM committed
509 510
}

511 512 513
QToolButton {
    padding-left: 3px;
    padding-right: 3px;
514 515
}

516 517
QToolTip {
    background-color: #3D5368;
518
    border:0 solid #B8D3E6;
519 520 521 522
    margin: 3px;
    border-radius: 3px;
    color: #DDD;
}
523

524 525 526 527
QTreeView::item:selected {
	color: #000;
}

528 529 530 531 532 533 534 535 536 537 538
UASQuickViewItem QLabel {
    padding: 0;
    margin: 0;
    min-height: 1em;
    font-weight: bold;
}

UASQuickViewItem QLabel#value {
    font-size: 20pt;
}

539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557
UASView {
    background: #444;
    border: 1px solid #AAA;
    border-radius: 12px;
}

UASView QLabel#heartBeatLabel, UASView QLabel#typeLabel {
    border: 1px solid #333;
    border-radius: 5px;
    padding: 2px;
}

QGCUnconnectedInfoWidget QPushButton#connectButton {
    min-height: 150px;
    max-height: 275px;
    margin: 15px;
    padding: 20px;
}

558
WaypointEditableView, WaypointViewOnlyView {
559 560 561 562 563
    border: 1px solid #777;
    border-radius: 5px;
    margin-bottom: 3px;
}

564 565 566 567 568 569 570 571
WaypointEditableView[RowColoring="odd"], WaypointViewOnlyView[RowColoring="odd"] {
    background-color: #333;
}

WaypointEditableView[RowColoring="even"], WaypointViewOnlyView[RowColoring="even"] {
    background-color: #555;
}

572
WaypointEditableView QCheckBox, WaypointEditableView .QWidget, WaypointViewOnlyView QCheckBox, WaypointViewOnlyView .QWidget {
573 574
    background: none;
}