QDarkStyleSheet
1.下载
https://github.com/ColinDuquesnoy/QDarkStyleSheet/tree/master
2.代码
1 /* 2 3 See Qt documentation: 4 5 - https://doc.qt.io/qt-5/stylesheet.html 6 - https://doc.qt.io/qt-5/stylesheet-reference.html 7 - https://doc.qt.io/qt-5/stylesheet-examples.html 8 9 --------------------------------------------------------------------------- */ 10 11 12 13 /* Reset elements ------------------------------------------------------------ 14 15 Resetting everything helps to unify styles across different operating systems 16 17 --------------------------------------------------------------------------- */ 18 * { 19 padding: 0px; 20 margin: 0px; 21 border: 0px; 22 border-style: none; 23 border-image: none; 24 outline: 0; 25 } 26 27 /* specific reset for elements inside QToolBar */ 28 QToolBar * { 29 margin: 0px; 30 padding: 0px; 31 } 32 33 34 35 36 /* QWidget ---------------------------------------------------------------- 37 38 --------------------------------------------------------------------------- */ 39 QWidget { 40 background-color: $COLOR_BACKGROUND_1; 41 border: 0px solid $COLOR_BACKGROUND_4; 42 padding: 0px; 43 color: $COLOR_TEXT_1; 44 selection-background-color: $COLOR_ACCENT_2; 45 selection-color: $COLOR_TEXT_1; 46 47 &:disabled { 48 background-color: $COLOR_BACKGROUND_1; 49 color: $COLOR_DISABLED; 50 selection-background-color: $COLOR_ACCENT_1; 51 selection-color: $COLOR_DISABLED; 52 } 53 54 &::item { 55 56 &:selected { 57 background-color: $COLOR_ACCENT_2; 58 } 59 60 &:hover:!selected { 61 background-color: $COLOR_ACCENT_3; 62 } 63 } 64 } 65 66 /* QMainWindow ------------------------------------------------------------ 67 68 This adjusts the splitter in the dock widget, not qsplitter 69 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qmainwindow 70 71 --------------------------------------------------------------------------- */ 72 QMainWindow { 73 74 &::separator { 75 background-color: $COLOR_BACKGROUND_4; 76 border: 0px solid $COLOR_BACKGROUND_1; 77 spacing: 0px; 78 padding: 2px; 79 80 &:hover { 81 background-color: $COLOR_BACKGROUND_6; 82 border: 0px solid $COLOR_ACCENT_3; 83 } 84 85 &:horizontal { 86 width: 5px; 87 margin-top: 2px; 88 margin-bottom: 2px; 89 image: url($PATH_RESOURCES + '/' + $ID + '/rc/toolbar_separator_vertical.png'); 90 } 91 92 &:vertical { 93 height: 5px; 94 margin-left: 2px; 95 margin-right: 2px; 96 image: url($PATH_RESOURCES + '/' + $ID + '/rc/toolbar_separator_horizontal.png'); 97 } 98 } 99 } 100 101 /* QToolTip --------------------------------------------------------------- 102 103 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtooltip 104 105 --------------------------------------------------------------------------- */ 106 QToolTip { 107 background-color: $COLOR_ACCENT_2; 108 color: $COLOR_TEXT_1; 109 /* If you remove the border property, background stops working on Windows */ 110 border: none; 111 /* Remove padding, for fix combo box tooltip */ 112 padding: 0px; 113 114 /* Remove opacity, fix #174 - may need to use RGBA */ 115 } 116 117 /* QStatusBar ------------------------------------------------------------- 118 119 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qstatusbar 120 121 --------------------------------------------------------------------------- */ 122 QStatusBar { 123 border: $BORDER_2; 124 125 /* Fixes Spyder #9120, #9121 */ 126 background: $COLOR_BACKGROUND_4; 127 128 /* Fixes #205, white vertical borders separating items */ 129 &::item { 130 border: none; 131 } 132 133 QToolTip { 134 background-color: $COLOR_ACCENT_3; 135 border: $BORDER_1; 136 color: $COLOR_BACKGROUND_1; 137 138 /* Remove padding, for fix combo box tooltip */ 139 padding: 0px; 140 141 /* Reducing transparency to read better */ 142 opacity: $OPACITY_TOOLTIP; 143 } 144 145 QLabel { 146 /* Fixes Spyder #9120, #9121 */ 147 background: transparent; 148 } 149 } 150 151 /* QCheckBox -------------------------------------------------------------- 152 153 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qcheckbox 154 155 --------------------------------------------------------------------------- */ 156 QCheckBox { 157 background-color: $COLOR_BACKGROUND_1; 158 color: $COLOR_TEXT_1; 159 spacing: 4px; 160 outline: none; 161 padding-top: 4px; 162 padding-bottom: 4px; 163 164 &:focus { 165 border: none; 166 } 167 168 QWidget:disabled { 169 background-color: $COLOR_BACKGROUND_1; 170 color: $COLOR_DISABLED; 171 } 172 173 &::indicator { 174 margin-left: 2px; 175 height: 14px; 176 width: 14px; 177 178 &:unchecked { 179 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked.png'); 180 181 &:hover, 182 &:focus, 183 &:pressed { 184 border: none; 185 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked_focus.png'); 186 } 187 188 &:disabled { 189 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked_disabled.png'); 190 } 191 } 192 193 &:checked { 194 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked.png'); 195 196 &:hover, 197 &:focus, 198 &:pressed { 199 border: none; 200 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked_focus.png'); 201 } 202 203 &:disabled { 204 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked_disabled.png'); 205 } 206 } 207 208 &:indeterminate { 209 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate.png'); 210 211 &:disabled { 212 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate_disabled.png'); 213 } 214 215 &:focus, 216 &:hover, 217 &:pressed { 218 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate_focus.png'); 219 } 220 } 221 } 222 } 223 224 /* QGroupBox -------------------------------------------------------------- 225 226 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qgroupbox 227 228 --------------------------------------------------------------------------- */ 229 QGroupBox { 230 font-weight: bold; 231 border: $BORDER_2; 232 border-radius: $SIZE_BORDER_RADIUS; 233 padding: 2px; 234 margin-top: 6px; 235 margin-bottom: 4px; 236 237 &::title { 238 subcontrol-origin: margin; 239 subcontrol-position: top left; 240 left: 4px; 241 padding-left: 2px; 242 padding-right: 4px; 243 padding-top: -4px; 244 } 245 246 &::indicator { 247 margin-left: 2px; 248 margin-top: 2px; 249 padding: 0; 250 height: 14px; 251 width: 14px; 252 253 &:unchecked { 254 border: none; 255 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked.png'); 256 257 &:hover, 258 &:focus, 259 &:pressed { 260 border: none; 261 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked_focus.png'); 262 } 263 264 &:disabled { 265 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked_disabled.png'); 266 } 267 } 268 269 &:checked { 270 border: none; 271 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked.png'); 272 273 274 &:hover, 275 &:focus, 276 &:pressed { 277 border: none; 278 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked_focus.png'); 279 } 280 281 &:disabled { 282 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked_disabled.png'); 283 } 284 } 285 } 286 } 287 288 /* QRadioButton ----------------------------------------------------------- 289 290 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qradiobutton 291 292 --------------------------------------------------------------------------- */ 293 QRadioButton { 294 background-color: $COLOR_BACKGROUND_1; 295 color: $COLOR_TEXT_1; 296 spacing: 4px; 297 padding-top: 4px; 298 padding-bottom: 4px; 299 border: none; 300 outline: none; 301 302 &:focus { 303 border: none; 304 } 305 306 &:disabled { 307 background-color: $COLOR_BACKGROUND_1; 308 color: $COLOR_DISABLED; 309 border: none; 310 outline: none; 311 } 312 313 QWidget { 314 background-color: $COLOR_BACKGROUND_1; 315 color: $COLOR_TEXT_1; 316 spacing: 0px; 317 padding: 0px; 318 outline: none; 319 border: none; 320 } 321 322 &::indicator { 323 border: none; 324 outline: none; 325 margin-left: 2px; 326 height: 14px; 327 width: 14px; 328 329 &:unchecked { 330 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_unchecked.png'); 331 332 &:hover, 333 &:focus, 334 &:pressed { 335 border: none; 336 outline: none; 337 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_unchecked_focus.png'); 338 } 339 340 &:disabled { 341 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_unchecked_disabled.png'); 342 } 343 } 344 345 &:checked { 346 border: none; 347 outline: none; 348 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_checked.png'); 349 350 &:hover, 351 &:focus, 352 &:pressed { 353 border: none; 354 outline: none; 355 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_checked_focus.png'); 356 } 357 358 &:disabled { 359 outline: none; 360 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_checked_disabled.png'); 361 } 362 } 363 } 364 } 365 366 /* QMenuBar --------------------------------------------------------------- 367 368 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qmenubar 369 370 --------------------------------------------------------------------------- */ 371 QMenuBar { 372 background-color: $COLOR_BACKGROUND_4; 373 padding: 2px; 374 border: $BORDER_1; 375 color: $COLOR_TEXT_1; 376 selection-background-color: $COLOR_ACCENT_3; 377 &:focus { 378 border: $BORDER_SELECTION_2; 379 } 380 381 &::item { 382 background: transparent; 383 padding: 4px; 384 385 &:selected { 386 padding: 4px; 387 background: transparent; 388 border: 0px solid $COLOR_BACKGROUND_4; 389 background-color: $COLOR_ACCENT_3; 390 } 391 392 &:pressed { 393 padding: 4px; 394 border: 0px solid $COLOR_BACKGROUND_4; 395 background-color: $COLOR_ACCENT_3; 396 color: $COLOR_TEXT_1; 397 margin-bottom: 0px; 398 padding-bottom: 0px; 399 } 400 } 401 } 402 403 /* QMenu ------------------------------------------------------------------ 404 405 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qmenu 406 407 --------------------------------------------------------------------------- */ 408 QMenu { 409 border: 0px solid $COLOR_BACKGROUND_4; 410 color: $COLOR_TEXT_1; 411 margin: 0px; 412 background-color: $COLOR_BACKGROUND_3; 413 selection-background-color: $COLOR_ACCENT_3; 414 415 &::separator { 416 height: 1px; 417 background-color: $COLOR_BACKGROUND_6; 418 color: $COLOR_TEXT_1; 419 } 420 421 &::item { 422 background-color: $COLOR_BACKGROUND_3; 423 padding: 4px 24px 4px 28px; 424 /* Reserve space for selection border */ 425 border: 1px transparent $COLOR_BACKGROUND_4; 426 427 &:selected { 428 color: $COLOR_TEXT_1; 429 background-color: $COLOR_ACCENT_3; 430 } 431 &:pressed { 432 background-color: $COLOR_ACCENT_3; 433 } 434 } 435 436 &::icon { 437 padding-left: 10px; 438 width: 14px; 439 height: 14px; 440 } 441 442 &::indicator { 443 padding-left: 8px; 444 width: 12px; 445 height: 12px; 446 447 /* non-exclusive indicator = check box style indicator (see QActionGroup::setExclusive) */ 448 &:non-exclusive { 449 450 &:unchecked { 451 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked.png'); 452 453 &:hover, 454 &:focus, 455 &:pressed { 456 border: none; 457 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked_focus.png'); 458 } 459 460 &:disabled { 461 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked_disabled.png'); 462 } 463 } 464 465 &:checked { 466 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked.png'); 467 468 &:hover, 469 &:focus, 470 &:pressed { 471 border: none; 472 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked_focus.png'); 473 } 474 475 &:disabled { 476 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked_disabled.png'); 477 } 478 } 479 480 &:indeterminate { 481 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate.png'); 482 483 &:disabled { 484 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate_disabled.png'); 485 } 486 487 &:focus, 488 &:hover, 489 &:pressed { 490 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate_focus.png'); 491 } 492 } 493 } 494 495 /* exclusive indicator = radio button style indicator (see QActionGroup::setExclusive) */ 496 &:exclusive { 497 498 &:unchecked { 499 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_unchecked.png'); 500 501 &:hover, 502 &:focus, 503 &:pressed { 504 border: none; 505 outline: none; 506 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_unchecked_focus.png'); 507 } 508 509 &:disabled { 510 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_unchecked_disabled.png'); 511 } 512 } 513 514 &:checked { 515 border: none; 516 outline: none; 517 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_checked.png'); 518 519 &:hover, 520 &:focus, 521 &:pressed { 522 border: none; 523 outline: none; 524 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_checked_focus.png'); 525 } 526 527 &:disabled { 528 outline: none; 529 image: url($PATH_RESOURCES + '/' + $ID + '/rc/radio_checked_disabled.png'); 530 } 531 } 532 } 533 } 534 535 &::right-arrow { 536 margin: 5px; 537 padding-left:12px; 538 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_right.png'); 539 height: 12px; 540 width: 12px; 541 } 542 } 543 544 /* QAbstractItemView ------------------------------------------------------ 545 546 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qcombobox 547 548 --------------------------------------------------------------------------- */ 549 QAbstractItemView { 550 alternate-background-color: $COLOR_BACKGROUND_1; 551 color: $COLOR_TEXT_1; 552 border: $BORDER_2; 553 border-radius: $SIZE_BORDER_RADIUS; 554 555 QLineEdit { 556 padding: 2px; 557 } 558 } 559 560 /* QAbstractScrollArea ---------------------------------------------------- 561 562 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qabstractscrollarea 563 564 --------------------------------------------------------------------------- */ 565 QAbstractScrollArea { 566 background-color: $COLOR_BACKGROUND_1; 567 border: $BORDER_2; 568 border-radius: $SIZE_BORDER_RADIUS; 569 /* fix #159 */ 570 padding: 2px; 571 /* remove min-height to fix #244 */ 572 color: $COLOR_TEXT_1; 573 574 &:disabled { 575 color: $COLOR_DISABLED; 576 } 577 } 578 579 /* QScrollArea ------------------------------------------------------------ 580 581 --------------------------------------------------------------------------- */ 582 QScrollArea QWidget QWidget:disabled { 583 background-color: $COLOR_BACKGROUND_1; 584 } 585 586 /* QScrollBar ------------------------------------------------------------- 587 588 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qscrollbar 589 590 --------------------------------------------------------------------------- */ 591 QScrollBar { 592 593 &:horizontal { 594 height: 16px; 595 margin: 2px 16px 2px 16px; 596 border: $BORDER_2; 597 border-radius: $SIZE_BORDER_RADIUS; 598 background-color: $COLOR_BACKGROUND_1; 599 } 600 601 &:vertical { 602 background-color: $COLOR_BACKGROUND_1; 603 width: 16px; 604 margin: 16px 2px 16px 2px; 605 border: $BORDER_2; 606 border-radius: $SIZE_BORDER_RADIUS; 607 } 608 609 &::handle { 610 611 &:horizontal { 612 background-color: $COLOR_BACKGROUND_6; 613 border: $BORDER_2; 614 border-radius: $SIZE_BORDER_RADIUS; 615 min-width: 8px; 616 617 &:hover { 618 background-color: $COLOR_ACCENT_2; 619 border: $COLOR_ACCENT_2; 620 border-radius: $SIZE_BORDER_RADIUS; 621 min-width: 8px; 622 } 623 624 &:focus { 625 border: $BORDER_SELECTION_3; 626 } 627 } 628 629 &:vertical { 630 background-color: $COLOR_BACKGROUND_6; 631 border: $BORDER_2; 632 min-height: 8px; 633 border-radius: $SIZE_BORDER_RADIUS; 634 635 &:hover { 636 background-color: $COLOR_ACCENT_2; 637 border: $COLOR_ACCENT_2; 638 border-radius: $SIZE_BORDER_RADIUS; 639 min-height: 8px; 640 } 641 642 &:focus { 643 border: $BORDER_SELECTION_3; 644 } 645 } 646 } 647 648 &::add-line { 649 650 &:horizontal { 651 margin: 0px 0px 0px 0px; 652 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_right_disabled.png'); 653 height: 12px; 654 width: 12px; 655 subcontrol-position: right; 656 subcontrol-origin: margin; 657 658 &:hover, 659 &:on { 660 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_right.png'); 661 height: 12px; 662 width: 12px; 663 subcontrol-position: right; 664 subcontrol-origin: margin; 665 } 666 } 667 668 &:vertical { 669 margin: 3px 0px 3px 0px; 670 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down_disabled.png'); 671 height: 12px; 672 width: 12px; 673 subcontrol-position: bottom; 674 subcontrol-origin: margin; 675 676 &:hover, 677 &:on { 678 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down.png'); 679 height: 12px; 680 width: 12px; 681 subcontrol-position: bottom; 682 subcontrol-origin: margin; 683 } 684 } 685 } 686 687 &::sub-line { 688 &:horizontal { 689 margin: 0px 3px 0px 3px; 690 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_left_disabled.png'); 691 height: 12px; 692 width: 12px; 693 subcontrol-position: left; 694 subcontrol-origin: margin; 695 696 &:hover, 697 &:on { 698 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_left.png'); 699 height: 12px; 700 width: 12px; 701 subcontrol-position: left; 702 subcontrol-origin: margin; 703 } 704 } 705 706 &:vertical { 707 margin: 3px 0px 3px 0px; 708 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_up_disabled.png'); 709 height: 12px; 710 width: 12px; 711 subcontrol-position: top; 712 subcontrol-origin: margin; 713 714 &:hover, 715 &:on { 716 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_up.png'); 717 height: 12px; 718 width: 12px; 719 subcontrol-position: top; 720 subcontrol-origin: margin; 721 } 722 } 723 } 724 725 &::up-arrow:horizontal, 726 &::down-arrow:horizontal { 727 background: none; 728 } 729 730 &::up-arrow:vertical, 731 &::down-arrow:vertical { 732 background: none; 733 } 734 735 &::add-page:horizontal, 736 &::sub-page:horizontal { 737 background: none; 738 } 739 740 &::add-page:vertical, 741 &::sub-page:vertical { 742 background: none; 743 } 744 } 745 746 /* QTextEdit -------------------------------------------------------------- 747 748 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-specific-widgets 749 750 --------------------------------------------------------------------------- */ 751 QTextEdit { 752 background-color: $COLOR_BACKGROUND_1; 753 color: $COLOR_TEXT_1; 754 border-radius: $SIZE_BORDER_RADIUS; 755 border: $BORDER_2; 756 757 &:focus { 758 border: $BORDER_SELECTION_3; 759 } 760 761 &:selected { 762 background: $COLOR_ACCENT_2; 763 color: $COLOR_BACKGROUND_4; 764 } 765 } 766 767 /* QPlainTextEdit --------------------------------------------------------- 768 769 --------------------------------------------------------------------------- */ 770 QPlainTextEdit { 771 background-color: $COLOR_BACKGROUND_1; 772 color: $COLOR_TEXT_1; 773 border-radius: $SIZE_BORDER_RADIUS; 774 border: $BORDER_2; 775 776 &:focus { 777 border: $BORDER_SELECTION_3; 778 } 779 780 &:selected { 781 background: $COLOR_ACCENT_2; 782 color: $COLOR_BACKGROUND_4; 783 } 784 } 785 786 /* QSizeGrip -------------------------------------------------------------- 787 788 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qsizegrip 789 790 --------------------------------------------------------------------------- */ 791 QSizeGrip { 792 background: transparent; 793 width: 12px; 794 height: 12px; 795 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_grip.png'); 796 } 797 798 /* QStackedWidget --------------------------------------------------------- 799 800 --------------------------------------------------------------------------- */ 801 QStackedWidget { 802 padding: 2px; 803 border: $BORDER_2; 804 border: $BORDER_1; 805 } 806 807 /* QToolBar --------------------------------------------------------------- 808 809 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtoolbar 810 811 --------------------------------------------------------------------------- */ 812 QToolBar { 813 background-color: $COLOR_BACKGROUND_4; 814 border-bottom: $BORDER_1; 815 padding: 1px; 816 font-weight: bold; 817 spacing: 2px; 818 819 &:disabled{ 820 /* Fixes #272 */ 821 background-color: $COLOR_BACKGROUND_4; 822 } 823 824 &::handle { 825 826 &:horizontal { 827 width: 16px; 828 image: url($PATH_RESOURCES + '/' + $ID + '/rc/toolbar_move_horizontal.png'); 829 } 830 831 &:vertical { 832 height: 16px; 833 image: url($PATH_RESOURCES + '/' + $ID + '/rc/toolbar_move_vertical.png'); 834 } 835 } 836 837 &::separator { 838 839 &:horizontal { 840 width: 16px; 841 image: url($PATH_RESOURCES + '/' + $ID + '/rc/toolbar_separator_horizontal.png'); 842 } 843 844 &:vertical { 845 height: 16px; 846 image: url($PATH_RESOURCES + '/' + $ID + '/rc/toolbar_separator_vertical.png'); 847 } 848 } 849 } 850 851 QToolButton#qt_toolbar_ext_button { 852 background: $COLOR_BACKGROUND_4; 853 border: 0px; 854 color: $COLOR_TEXT_1; 855 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_right.png'); 856 } 857 858 /* QAbstractSpinBox ------------------------------------------------------- 859 860 --------------------------------------------------------------------------- */ 861 QAbstractSpinBox { 862 background-color: $COLOR_BACKGROUND_1; 863 border: $BORDER_2; 864 color: $COLOR_TEXT_1; 865 866 /* This fixes 103, 111 */ 867 padding-top: 2px; 868 869 /* This fixes 103, 111 */ 870 padding-bottom: 2px; 871 padding-left: 4px; 872 padding-right: 4px; 873 border-radius: $SIZE_BORDER_RADIUS; 874 /* min-width: 5px; removed to fix 109 */ 875 876 &:up-button { 877 background-color: transparent $COLOR_BACKGROUND_1; 878 subcontrol-origin: border; 879 subcontrol-position: top right; 880 border-left: $BORDER_2; 881 border-bottom: $BORDER_2; 882 border-top-left-radius: 0; 883 border-bottom-left-radius: 0; 884 margin: 1px; 885 width: 12px; 886 margin-bottom: -1px; 887 } 888 889 &::up-arrow, 890 &::up-arrow:disabled, 891 &::up-arrow:off { 892 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_up_disabled.png'); 893 height: 8px; 894 width: 8px; 895 } 896 897 &::up-arrow:hover { 898 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_up.png'); 899 } 900 901 &:down-button { 902 background-color: transparent $COLOR_BACKGROUND_1; 903 subcontrol-origin: border; 904 subcontrol-position: bottom right; 905 border-left: $BORDER_2; 906 border-top: $BORDER_2; 907 border-top-left-radius: 0; 908 border-bottom-left-radius: 0; 909 margin: 1px; 910 width: 12px; 911 margin-top: -1px; 912 } 913 914 &::down-arrow, 915 &::down-arrow:disabled, 916 &::down-arrow:off { 917 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down_disabled.png'); 918 height: 8px; 919 width: 8px; 920 } 921 922 &::down-arrow:hover { 923 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down.png'); 924 } 925 926 &:hover { 927 border: $BORDER_SELECTION_2; 928 color: $COLOR_TEXT_1; 929 } 930 931 &:focus { 932 border: $BORDER_SELECTION_3; 933 } 934 935 &:selected { 936 background: $COLOR_ACCENT_2; 937 color: $COLOR_BACKGROUND_4; 938 } 939 } 940 941 /* ------------------------------------------------------------------------ */ 942 /* DISPLAYS --------------------------------------------------------------- */ 943 /* ------------------------------------------------------------------------ */ 944 945 /* QLabel ----------------------------------------------------------------- 946 947 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qframe 948 949 --------------------------------------------------------------------------- */ 950 QLabel { 951 background-color: $COLOR_BACKGROUND_1; 952 border: 0px solid $COLOR_BACKGROUND_4; 953 padding: 2px; 954 margin: 0px; 955 color: $COLOR_TEXT_1; 956 957 &:disabled { 958 background-color: $COLOR_BACKGROUND_1; 959 border: 0px solid $COLOR_BACKGROUND_4; 960 color: $COLOR_DISABLED; 961 } 962 } 963 964 /* QTextBrowser ----------------------------------------------------------- 965 966 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qabstractscrollarea 967 968 --------------------------------------------------------------------------- */ 969 QTextBrowser { 970 background-color: $COLOR_BACKGROUND_1; 971 border: $BORDER_2; 972 color: $COLOR_TEXT_1; 973 border-radius: $SIZE_BORDER_RADIUS; 974 975 &:disabled { 976 background-color: $COLOR_BACKGROUND_1; 977 border: $BORDER_2; 978 color: $COLOR_DISABLED; 979 border-radius: $SIZE_BORDER_RADIUS; 980 } 981 982 &:hover, 983 &:!hover, 984 &:selected, 985 &:pressed { 986 border: $BORDER_2; 987 } 988 } 989 990 /* QGraphicsView ---------------------------------------------------------- 991 992 --------------------------------------------------------------------------- */ 993 QGraphicsView { 994 background-color: $COLOR_BACKGROUND_1; 995 border: $BORDER_2; 996 color: $COLOR_TEXT_1; 997 border-radius: $SIZE_BORDER_RADIUS; 998 999 &:disabled { 1000 background-color: $COLOR_BACKGROUND_1; 1001 border: $BORDER_2; 1002 color: $COLOR_DISABLED; 1003 border-radius: $SIZE_BORDER_RADIUS; 1004 } 1005 1006 &:hover, 1007 &:!hover, 1008 &:selected, 1009 &:pressed { 1010 border: $BORDER_2; 1011 } 1012 } 1013 1014 /* QCalendarWidget -------------------------------------------------------- 1015 1016 --------------------------------------------------------------------------- */ 1017 QCalendarWidget { 1018 border: $BORDER_2; 1019 border-radius: $SIZE_BORDER_RADIUS; 1020 1021 &:disabled { 1022 background-color: $COLOR_BACKGROUND_1; 1023 color: $COLOR_DISABLED; 1024 } 1025 } 1026 1027 /* QLCDNumber ------------------------------------------------------------- 1028 1029 --------------------------------------------------------------------------- */ 1030 QLCDNumber { 1031 background-color: $COLOR_BACKGROUND_1; 1032 color: $COLOR_TEXT_1; 1033 1034 &:disabled { 1035 background-color: $COLOR_BACKGROUND_1; 1036 color: $COLOR_DISABLED; 1037 } 1038 } 1039 1040 /* QProgressBar ----------------------------------------------------------- 1041 1042 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qprogressbar 1043 1044 --------------------------------------------------------------------------- */ 1045 QProgressBar { 1046 background-color: $COLOR_BACKGROUND_1; 1047 border: $BORDER_2; 1048 color: $COLOR_TEXT_1; 1049 border-radius: $SIZE_BORDER_RADIUS; 1050 text-align: center; 1051 1052 &:disabled { 1053 background-color: $COLOR_BACKGROUND_1; 1054 border: $BORDER_2; 1055 color: $COLOR_DISABLED; 1056 border-radius: $SIZE_BORDER_RADIUS; 1057 text-align: center; 1058 } 1059 1060 &::chunk { 1061 background-color: $COLOR_ACCENT_2; 1062 color: $COLOR_BACKGROUND_1; 1063 border-radius: $SIZE_BORDER_RADIUS; 1064 1065 &:disabled { 1066 background-color: $COLOR_ACCENT_1; 1067 color: $COLOR_DISABLED; 1068 border-radius: $SIZE_BORDER_RADIUS; 1069 } 1070 } 1071 } 1072 1073 /* ------------------------------------------------------------------------ */ 1074 /* BUTTONS ---------------------------------------------------------------- */ 1075 /* ------------------------------------------------------------------------ */ 1076 1077 /* QPushButton ------------------------------------------------------------ 1078 1079 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qpushbutton 1080 1081 --------------------------------------------------------------------------- */ 1082 QPushButton { 1083 background-color: $COLOR_BACKGROUND_4; 1084 color: $COLOR_TEXT_1; 1085 border-radius: $SIZE_BORDER_RADIUS; 1086 padding: 2px; 1087 outline: none; 1088 border: none; 1089 1090 &:disabled { 1091 background-color: $COLOR_BACKGROUND_4; 1092 color: $COLOR_DISABLED; 1093 border-radius: $SIZE_BORDER_RADIUS; 1094 padding: 2px; 1095 } 1096 1097 &:checked { 1098 background-color: $COLOR_BACKGROUND_6; 1099 border-radius: $SIZE_BORDER_RADIUS; 1100 padding: 2px; 1101 outline: none; 1102 1103 &:disabled { 1104 background-color: $COLOR_BACKGROUND_6; 1105 color: $COLOR_DISABLED; 1106 border-radius: $SIZE_BORDER_RADIUS; 1107 padding: 2px; 1108 outline: none; 1109 } 1110 1111 &:selected { 1112 background: $COLOR_BACKGROUND_6; 1113 } 1114 1115 } 1116 1117 &:hover { 1118 background-color: $COLOR_BACKGROUND_5; 1119 color: $COLOR_TEXT_1; 1120 } 1121 1122 &:pressed { 1123 background-color: $COLOR_BACKGROUND_6; 1124 } 1125 1126 &:selected { 1127 background: $COLOR_BACKGROUND_6; 1128 color: $COLOR_TEXT_1; 1129 } 1130 1131 &::menu-indicator { 1132 subcontrol-origin: padding; 1133 subcontrol-position: bottom right; 1134 bottom: 4px; 1135 } 1136 1137 } 1138 1139 QDialogButtonBox QPushButton { 1140 /* Issue #194 #248 - Special case of QPushButton inside dialogs, for better UI */ 1141 min-width: 80px; 1142 } 1143 /* QToolButton ------------------------------------------------------------ 1144 1145 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtoolbutton 1146 1147 --------------------------------------------------------------------------- */ 1148 QToolButton { 1149 background-color: $COLOR_BACKGROUND_4; 1150 color: $COLOR_TEXT_1; 1151 border-radius: $SIZE_BORDER_RADIUS; 1152 padding: 2px; 1153 outline: none; 1154 border: none; 1155 1156 &:disabled { 1157 background-color: $COLOR_BACKGROUND_4; 1158 color: $COLOR_DISABLED; 1159 border-radius: $SIZE_BORDER_RADIUS; 1160 padding: 2px; 1161 } 1162 1163 &:checked { 1164 background-color: $COLOR_BACKGROUND_6; 1165 border-radius: $SIZE_BORDER_RADIUS; 1166 padding: 2px; 1167 outline: none; 1168 1169 &:disabled { 1170 background-color: $COLOR_BACKGROUND_6; 1171 color: $COLOR_DISABLED; 1172 border-radius: $SIZE_BORDER_RADIUS; 1173 padding: 2px; 1174 outline: none; 1175 } 1176 1177 &:hover { 1178 background-color: $COLOR_BACKGROUND_5; 1179 color: $COLOR_TEXT_1; 1180 } 1181 1182 &:pressed { 1183 background-color: $COLOR_BACKGROUND_6; 1184 } 1185 1186 &:selected { 1187 background: $COLOR_BACKGROUND_6; 1188 color: $COLOR_TEXT_1; 1189 } 1190 1191 } 1192 1193 &:hover { 1194 background-color: $COLOR_BACKGROUND_5; 1195 color: $COLOR_TEXT_1; 1196 } 1197 1198 &:pressed { 1199 background-color: $COLOR_BACKGROUND_6; 1200 } 1201 1202 &:selected { 1203 background: $COLOR_BACKGROUND_6; 1204 color: $COLOR_TEXT_1; 1205 } 1206 1207 /* The subcontrols below are used only in the DelayedPopup mode */ 1208 &[popupMode="0"] { 1209 /* Only for DelayedPopup */ 1210 padding-right: 2px; 1211 } 1212 1213 /* The subcontrols below are used only in the MenuButtonPopup mode */ 1214 &[popupMode="1"] { 1215 /* Only for MenuButtonPopup */ 1216 padding-right: 20px; 1217 1218 &::menu-button { 1219 border: none; 1220 1221 &:hover { 1222 border: none; 1223 border-left: 1px solid $COLOR_BACKGROUND_4; 1224 border-radius: 0; 1225 } 1226 } 1227 } 1228 1229 /* The subcontrol below is used only in the InstantPopup or DelayedPopup mode */ 1230 &[popupMode="2"] { 1231 /* Only for InstantPopup */ 1232 padding-right: 2px; 1233 } 1234 1235 &::menu-button { 1236 padding: 2px; 1237 border-radius: $SIZE_BORDER_RADIUS; 1238 width: 12px; 1239 border: none; 1240 outline: none; 1241 1242 &:hover { 1243 border: $BORDER_SELECTION_2; 1244 } 1245 1246 &:checked { 1247 &:hover { 1248 border: $BORDER_SELECTION_2; 1249 } 1250 } 1251 } 1252 1253 &::menu-indicator { 1254 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down.png'); 1255 height: 8px; 1256 width: 8px; 1257 top: 0; 1258 /* Exclude a shift for better image */ 1259 left: -2px; 1260 /* Shift it a bit */ 1261 } 1262 1263 &::menu-arrow { 1264 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down.png'); 1265 height: 8px; 1266 width: 8px; 1267 1268 &:hover { 1269 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down_focus.png'); 1270 } 1271 } 1272 } 1273 1274 /* QCommandLinkButton ----------------------------------------------------- 1275 1276 --------------------------------------------------------------------------- */ 1277 QCommandLinkButton { 1278 background-color: transparent; 1279 border: $BORDER_2; 1280 color: $COLOR_TEXT_1; 1281 border-radius: $SIZE_BORDER_RADIUS; 1282 padding: 0px; 1283 margin: 0px; 1284 1285 &:disabled { 1286 background-color: transparent; 1287 color: $COLOR_DISABLED; 1288 } 1289 } 1290 1291 /* ------------------------------------------------------------------------ */ 1292 /* INPUTS - NO FIELDS ----------------------------------------------------- */ 1293 /* ------------------------------------------------------------------------ */ 1294 1295 /* QComboBox -------------------------------------------------------------- 1296 1297 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qcombobox 1298 1299 --------------------------------------------------------------------------- */ 1300 QComboBox { 1301 border: $BORDER_2; 1302 border-radius: $SIZE_BORDER_RADIUS; 1303 selection-background-color: $COLOR_ACCENT_2; 1304 padding-left: 4px; 1305 padding-right: 4px; 1306 /* padding-right = 36; 4 + 16*2 See scrollbar size */ 1307 /* changed to 4px to fix #239 */ 1308 1309 /* Fixes #103, #111 */ 1310 min-height: 1.5em; 1311 1312 /* padding-top: 2px; removed to fix #132 */ 1313 /* padding-bottom: 2px; removed to fix #132 */ 1314 /* min-width: 75px; removed to fix #109 */ 1315 1316 QAbstractItemView { 1317 border: $BORDER_2; 1318 border-radius: 0; 1319 background-color: $COLOR_BACKGROUND_1; 1320 selection-background-color: $COLOR_ACCENT_2; 1321 1322 &:hover { 1323 background-color: $COLOR_BACKGROUND_1; 1324 color: $COLOR_TEXT_1; 1325 } 1326 1327 &:selected { 1328 background: $COLOR_ACCENT_2; 1329 color: $COLOR_BACKGROUND_4; 1330 } 1331 1332 &:alternate { 1333 background: $COLOR_BACKGROUND_1; 1334 } 1335 1336 } 1337 1338 &:disabled { 1339 background-color: $COLOR_BACKGROUND_1; 1340 color: $COLOR_DISABLED; 1341 } 1342 1343 &:hover { 1344 border: $BORDER_SELECTION_2; 1345 } 1346 1347 &:focus { 1348 border: $BORDER_SELECTION_3; 1349 } 1350 1351 &:on { 1352 selection-background-color: $COLOR_ACCENT_2; 1353 } 1354 1355 /* Needed to remove indicator - fix #132 */ 1356 &::indicator { 1357 border: none; 1358 border-radius: 0; 1359 background-color: transparent; 1360 selection-background-color: transparent; 1361 color: transparent; 1362 selection-color: transparent; 1363 1364 /* Needed to remove indicator - fix #132 */ 1365 &:alternate { 1366 background: $COLOR_BACKGROUND_1; 1367 } 1368 } 1369 1370 &::item { 1371 1372 &:alternate { 1373 background: $COLOR_BACKGROUND_1; 1374 } 1375 /* Remove to fix #282, #285 and MR #288*/ 1376 /*&:checked { 1377 font-weight: bold; 1378 } 1379 1380 &:selected { 1381 border: 0px solid transparent; 1382 } 1383 */ 1384 } 1385 1386 &::drop-down { 1387 subcontrol-origin: padding; 1388 subcontrol-position: top right; 1389 width: 12px; 1390 border-left: 1px solid $COLOR_BACKGROUND_4; 1391 } 1392 1393 &::down-arrow { 1394 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down_disabled.png'); 1395 height: 8px; 1396 width: 8px; 1397 1398 &:on, 1399 &:hover, 1400 &:focus { 1401 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down.png'); 1402 } 1403 } 1404 } 1405 1406 /* QSlider ---------------------------------------------------------------- 1407 1408 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qslider 1409 1410 --------------------------------------------------------------------------- */ 1411 QSlider { 1412 1413 &:disabled { 1414 background: $COLOR_BACKGROUND_1; 1415 } 1416 1417 &:focus { 1418 border: none; 1419 } 1420 1421 &::groove { 1422 &:horizontal { 1423 background: $COLOR_BACKGROUND_4; 1424 border: $BORDER_2; 1425 height: 4px; 1426 margin: 0px; 1427 border-radius: $SIZE_BORDER_RADIUS; 1428 } 1429 1430 &:vertical { 1431 background: $COLOR_BACKGROUND_4; 1432 border: $BORDER_2; 1433 width: 4px; 1434 margin: 0px; 1435 border-radius: $SIZE_BORDER_RADIUS; 1436 } 1437 } 1438 1439 &::add-page { 1440 1441 &:vertical { 1442 background: $COLOR_ACCENT_2; 1443 border: $BORDER_2; 1444 width: 4px; 1445 margin: 0px; 1446 border-radius: $SIZE_BORDER_RADIUS; 1447 1448 :disabled { 1449 background: $COLOR_ACCENT_1; 1450 } 1451 } 1452 } 1453 1454 &::sub-page { 1455 1456 &:horizontal { 1457 background: $COLOR_ACCENT_2; 1458 border: $BORDER_2; 1459 height: 4px; 1460 margin: 0px; 1461 border-radius: $SIZE_BORDER_RADIUS; 1462 1463 &:disabled { 1464 background: $COLOR_ACCENT_1; 1465 } 1466 } 1467 } 1468 1469 &::handle { 1470 1471 &:horizontal { 1472 background: $COLOR_TEXT_4; 1473 border: $BORDER_2; 1474 width: 8px; 1475 height: 8px; 1476 margin: -8px 0px; 1477 border-radius: $SIZE_BORDER_RADIUS; 1478 1479 &:hover { 1480 background: $COLOR_ACCENT_2; 1481 border: $BORDER_SELECTION_2; 1482 } 1483 1484 &:focus { 1485 border: $BORDER_SELECTION_3; 1486 } 1487 } 1488 1489 &:vertical { 1490 background: $COLOR_TEXT_4; 1491 border: $BORDER_2; 1492 width: 8px; 1493 height: 8px; 1494 margin: 0 -8px; 1495 border-radius: $SIZE_BORDER_RADIUS; 1496 1497 &:hover { 1498 background: $COLOR_ACCENT_2; 1499 border: $BORDER_SELECTION_2; 1500 } 1501 1502 &:focus { 1503 border: $BORDER_SELECTION_3; 1504 } 1505 } 1506 } 1507 } 1508 1509 /* QLineEdit -------------------------------------------------------------- 1510 1511 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qlineedit 1512 1513 --------------------------------------------------------------------------- */ 1514 QLineEdit { 1515 background-color: $COLOR_BACKGROUND_1; 1516 padding-top: 2px; 1517 /* This QLineEdit fix 103, 111 */ 1518 padding-bottom: 2px; 1519 /* This QLineEdit fix 103, 111 */ 1520 padding-left: 4px; 1521 padding-right: 4px; 1522 border-style: solid; 1523 border: $BORDER_2; 1524 border-radius: $SIZE_BORDER_RADIUS; 1525 color: $COLOR_TEXT_1; 1526 1527 &:disabled { 1528 background-color: $COLOR_BACKGROUND_1; 1529 color: $COLOR_DISABLED; 1530 } 1531 1532 &:hover { 1533 border: $BORDER_SELECTION_2; 1534 color: $COLOR_TEXT_1; 1535 } 1536 1537 &:focus { 1538 border: $BORDER_SELECTION_3; 1539 } 1540 1541 &:selected { 1542 background-color: $COLOR_ACCENT_2; 1543 color: $COLOR_BACKGROUND_4; 1544 } 1545 } 1546 1547 /* QTabWiget -------------------------------------------------------------- 1548 1549 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtabwidget-and-qtabbar 1550 1551 --------------------------------------------------------------------------- */ 1552 QTabWidget { 1553 padding: 2px; 1554 selection-background-color: $COLOR_BACKGROUND_4; 1555 1556 QWidget { 1557 /* Fixes #189 */ 1558 border-radius: $SIZE_BORDER_RADIUS; 1559 } 1560 1561 &::pane { 1562 border: $BORDER_2; 1563 border-radius: $SIZE_BORDER_RADIUS; 1564 margin: 0px; 1565 /* Fixes double border inside pane with pyqt5 */ 1566 padding: 0px; 1567 1568 &:selected { 1569 background-color: $COLOR_BACKGROUND_4; 1570 border: 1px solid $COLOR_ACCENT_2; 1571 } 1572 } 1573 } 1574 1575 /* QTabBar ---------------------------------------------------------------- 1576 1577 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtabwidget-and-qtabbar 1578 1579 --------------------------------------------------------------------------- */ 1580 QTabBar, QDockWidget QTabBar { 1581 qproperty-drawBase: 0; 1582 border-radius: $SIZE_BORDER_RADIUS; 1583 margin: 0px; 1584 padding: 2px; 1585 border: 0; 1586 /* left: 5px; move to the right by 5px - removed for fix */ 1587 1588 &::close-button { 1589 border: 0; 1590 margin: 0; 1591 padding: 4px; 1592 1593 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_close.png'); 1594 1595 &:hover { 1596 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_close_focus.png'); 1597 } 1598 1599 &:pressed { 1600 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_close_pressed.png'); 1601 } 1602 } 1603 1604 &::tab { 1605 1606 &:top:selected:disabled { 1607 border-bottom: 3px solid $COLOR_ACCENT_1; 1608 color: $COLOR_DISABLED; 1609 background-color: $COLOR_BACKGROUND_4; 1610 } 1611 1612 &:bottom:selected:disabled { 1613 border-top: 3px solid $COLOR_ACCENT_1; 1614 color: $COLOR_DISABLED; 1615 background-color: $COLOR_BACKGROUND_4; 1616 } 1617 1618 &:left:selected:disabled { 1619 border-right: 3px solid $COLOR_ACCENT_1; 1620 color: $COLOR_DISABLED; 1621 background-color: $COLOR_BACKGROUND_4; 1622 } 1623 1624 &:right:selected:disabled { 1625 border-left: 3px solid $COLOR_ACCENT_1; 1626 color: $COLOR_DISABLED; 1627 background-color: $COLOR_BACKGROUND_4; 1628 } 1629 1630 /* !selected and disabled ----------------------------------------- */ 1631 &:top:!selected:disabled { 1632 border-bottom: 3px solid $COLOR_BACKGROUND_1; 1633 color: $COLOR_DISABLED; 1634 background-color: $COLOR_BACKGROUND_1; 1635 } 1636 1637 &:bottom:!selected:disabled { 1638 border-top: 3px solid $COLOR_BACKGROUND_1; 1639 color: $COLOR_DISABLED; 1640 background-color: $COLOR_BACKGROUND_1; 1641 } 1642 1643 &:left:!selected:disabled { 1644 border-right: 3px solid $COLOR_BACKGROUND_1; 1645 color: $COLOR_DISABLED; 1646 background-color: $COLOR_BACKGROUND_1; 1647 } 1648 1649 &:right:!selected:disabled { 1650 border-left: 3px solid $COLOR_BACKGROUND_1; 1651 color: $COLOR_DISABLED; 1652 background-color: $COLOR_BACKGROUND_1; 1653 } 1654 1655 /* selected ------------------------------------------------------- */ 1656 &:top:!selected { 1657 border-bottom: 2px solid $COLOR_BACKGROUND_1; 1658 margin-top: 2px; 1659 } 1660 1661 &:bottom:!selected { 1662 border-top: 2px solid $COLOR_BACKGROUND_1; 1663 margin-bottom: 2px; 1664 } 1665 1666 &:left:!selected { 1667 border-left: 2px solid $COLOR_BACKGROUND_1; 1668 margin-right: 2px; 1669 } 1670 1671 &:right:!selected { 1672 border-right: 2px solid $COLOR_BACKGROUND_1; 1673 margin-left: 2px; 1674 } 1675 1676 &:top { 1677 background-color: $COLOR_BACKGROUND_4; 1678 margin-left: 2px; 1679 padding-left: 4px; 1680 padding-right: 4px; 1681 padding-top: 2px; 1682 padding-bottom: 2px; 1683 min-width: 5px; 1684 border-bottom: 3px solid $COLOR_BACKGROUND_4; 1685 border-top-left-radius: $SIZE_BORDER_RADIUS; 1686 border-top-right-radius: $SIZE_BORDER_RADIUS; 1687 1688 &:selected { 1689 background-color: $COLOR_BACKGROUND_5; 1690 border-bottom: 3px solid $COLOR_ACCENT_4; 1691 border-top-left-radius: $SIZE_BORDER_RADIUS; 1692 border-top-right-radius: $SIZE_BORDER_RADIUS; 1693 } 1694 1695 &:!selected:hover { 1696 border: $BORDER_SELECTION_3; 1697 border-bottom: 3px solid $COLOR_ACCENT_3; 1698 /* Fixes spyder-ide/spyder#9766 and #243 */ 1699 padding-left: 3px; 1700 padding-right: 3px; 1701 } 1702 } 1703 1704 &:bottom { 1705 border-top: 3px solid $COLOR_BACKGROUND_4; 1706 background-color: $COLOR_BACKGROUND_4; 1707 margin-left: 2px; 1708 padding-left: 4px; 1709 padding-right: 4px; 1710 padding-top: 2px; 1711 padding-bottom: 2px; 1712 border-bottom-left-radius: $SIZE_BORDER_RADIUS; 1713 border-bottom-right-radius: $SIZE_BORDER_RADIUS; 1714 min-width: 5px; 1715 1716 &:selected { 1717 background-color: $COLOR_BACKGROUND_5; 1718 border-top: 3px solid $COLOR_ACCENT_4; 1719 border-bottom-left-radius: $SIZE_BORDER_RADIUS; 1720 border-bottom-right-radius: $SIZE_BORDER_RADIUS; 1721 } 1722 1723 &:!selected:hover { 1724 border: $BORDER_SELECTION_3; 1725 border-top: 3px solid $COLOR_ACCENT_3; 1726 /* Fixes spyder-ide/spyder#9766 and #243 */ 1727 padding-left: 3px; 1728 padding-right: 3px; 1729 } 1730 1731 } 1732 1733 &:left { 1734 background-color: $COLOR_BACKGROUND_4; 1735 margin-top: 2px; 1736 padding-left: 2px; 1737 padding-right: 2px; 1738 padding-top: 4px; 1739 padding-bottom: 4px; 1740 border-top-left-radius: $SIZE_BORDER_RADIUS; 1741 border-bottom-left-radius: $SIZE_BORDER_RADIUS; 1742 min-height: 5px; 1743 1744 &:selected { 1745 background-color: $COLOR_BACKGROUND_5; 1746 border-right: 3px solid $COLOR_ACCENT_4; 1747 } 1748 1749 &:!selected:hover { 1750 border: $BORDER_SELECTION_3; 1751 border-right: 3px solid $COLOR_ACCENT_3; 1752 /* Fixes different behavior #271 */ 1753 margin-right: 0px; 1754 padding-right: -1px; 1755 } 1756 } 1757 1758 &:right { 1759 background-color: $COLOR_BACKGROUND_4; 1760 margin-top: 2px; 1761 padding-left: 2px; 1762 padding-right: 2px; 1763 padding-top: 4px; 1764 padding-bottom: 4px; 1765 border-top-right-radius: $SIZE_BORDER_RADIUS; 1766 border-bottom-right-radius: $SIZE_BORDER_RADIUS; 1767 min-height: 5px; 1768 1769 &:selected { 1770 background-color: $COLOR_BACKGROUND_5; 1771 border-left: 3px solid $COLOR_ACCENT_4; 1772 1773 } 1774 1775 &:!selected:hover { 1776 border: $BORDER_SELECTION_3; 1777 border-left: 3px solid $COLOR_ACCENT_3; 1778 /* Fixes different behavior #271 */ 1779 margin-left: 0px; 1780 padding-left: 0px; 1781 } 1782 } 1783 } 1784 1785 QToolButton { 1786 /* Fixes #136 */ 1787 background-color: $COLOR_BACKGROUND_4; 1788 height: 12px; 1789 width: 12px; 1790 1791 &:pressed { 1792 background-color: $COLOR_BACKGROUND_4; 1793 1794 &:hover { 1795 border: $BORDER_SELECTION_2; 1796 } 1797 } 1798 1799 &::left-arrow { 1800 &:enabled { 1801 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_left.png'); 1802 } 1803 1804 &:disabled { 1805 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_left_disabled.png'); 1806 } 1807 } 1808 1809 &::right-arrow { 1810 &:enabled { 1811 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_right.png'); 1812 } 1813 1814 &:disabled { 1815 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_right_disabled.png'); 1816 } 1817 } 1818 } 1819 } 1820 1821 /* QDockWiget ------------------------------------------------------------- 1822 1823 --------------------------------------------------------------------------- */ 1824 QDockWidget { 1825 outline: $BORDER_2; 1826 background-color: $COLOR_BACKGROUND_1; 1827 border: $BORDER_2; 1828 border-radius: $SIZE_BORDER_RADIUS; 1829 // See discussion here: https://stackoverflow.com/questions/32145080/qdockwidget-float-close-button-hover-images 1830 titlebar-close-icon: url($PATH_RESOURCES + '/' + $ID + '/rc/transparent.png'); 1831 titlebar-normal-icon: url($PATH_RESOURCES + '/' + $ID + '/rc/transparent.png'); 1832 1833 &::title { 1834 /* Better size for title bar */ 1835 padding: 3px; 1836 spacing: 4px; 1837 border: none; 1838 background-color: $COLOR_BACKGROUND_4; 1839 } 1840 1841 &::close-button { 1842 icon-size: 12px; 1843 border: none; 1844 background: transparent; 1845 background-image: transparent; 1846 border: 0; 1847 margin: 0; 1848 padding: 0; 1849 1850 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_close.png'); 1851 1852 &:hover { 1853 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_close_focus.png'); 1854 } 1855 1856 &:pressed { 1857 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_close_pressed.png'); 1858 } 1859 } 1860 1861 &::float-button { 1862 icon-size: 12px; 1863 border: none; 1864 background: transparent; 1865 background-image: transparent; 1866 // float button has an issue that if you change any of those 1867 // parameters below there will be a duplication in the icon 1868 // actually it seems that they are always there (duplication) 1869 border: 0; 1870 margin: 0; 1871 padding: 0; 1872 1873 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_undock.png'); 1874 1875 &:hover { 1876 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_undock_focus.png'); 1877 } 1878 1879 &:pressed { 1880 image: url($PATH_RESOURCES + '/' + $ID + '/rc/window_undock_pressed.png'); 1881 } 1882 } 1883 } 1884 1885 /* QTreeView QListView QTableView ----------------------------------------- 1886 1887 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtreeview 1888 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qlistview 1889 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtableview 1890 1891 --------------------------------------------------------------------------- */ 1892 QTreeView { 1893 1894 &:branch { 1895 1896 &:selected, 1897 &:hover { 1898 background: url($PATH_RESOURCES + '/' + $ID + '/rc/transparent.png'); 1899 } 1900 1901 &:has-siblings:!adjoins-item { 1902 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/branch_line.png') 0; 1903 } 1904 1905 &:has-siblings:adjoins-item { 1906 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/branch_more.png') 0; 1907 } 1908 1909 &:!has-children:!has-siblings:adjoins-item { 1910 border-image: url($PATH_RESOURCES + '/' + $ID + '/rc/branch_end.png') 0; 1911 } 1912 1913 &:has-children:!has-siblings:closed, 1914 &:closed:has-children:has-siblings { 1915 border-image: none; 1916 image: url($PATH_RESOURCES + '/' + $ID + '/rc/branch_closed.png'); 1917 } 1918 1919 &:open:has-children:!has-siblings, 1920 &:open:has-children:has-siblings { 1921 border-image: none; 1922 image: url($PATH_RESOURCES + '/' + $ID + '/rc/branch_open.png'); 1923 } 1924 1925 &:has-children:!has-siblings:closed:hover, 1926 &:closed:has-children:has-siblings:hover { 1927 image: url($PATH_RESOURCES + '/' + $ID + '/rc/branch_closed_focus.png'); 1928 } 1929 1930 &:open:has-children:!has-siblings:hover, 1931 &:open:has-children:has-siblings:hover { 1932 image: url($PATH_RESOURCES + '/' + $ID + '/rc/branch_open_focus.png'); 1933 } 1934 } 1935 } 1936 1937 QTreeView, 1938 QListView, 1939 QTableView, 1940 QColumnView { 1941 1942 &::indicator { 1943 1944 &:checked { 1945 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked.png'); 1946 1947 &:hover, 1948 &:focus, 1949 &:pressed { 1950 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_checked_focus.png'); 1951 } 1952 } 1953 1954 &:unchecked { 1955 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked.png'); 1956 1957 &:hover, 1958 &:focus, 1959 &:pressed { 1960 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_unchecked_focus.png'); 1961 } 1962 } 1963 1964 &:indeterminate { 1965 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate.png'); 1966 1967 &:hover, 1968 &:focus, 1969 &:pressed { 1970 image: url($PATH_RESOURCES + '/' + $ID + '/rc/checkbox_indeterminate_focus.png'); 1971 } 1972 } 1973 } 1974 } 1975 1976 QTreeView, 1977 QListView, 1978 QTableView, 1979 QColumnView { 1980 background-color: $COLOR_BACKGROUND_1; 1981 border: $BORDER_2; 1982 color: $COLOR_TEXT_1; 1983 gridline-color: $COLOR_BACKGROUND_4; 1984 border-radius: $SIZE_BORDER_RADIUS; 1985 1986 &:disabled { 1987 background-color: $COLOR_BACKGROUND_1; 1988 color: $COLOR_DISABLED; 1989 } 1990 1991 &:selected { 1992 background-color: $COLOR_ACCENT_2; 1993 color: $COLOR_BACKGROUND_4; 1994 } 1995 1996 &:focus { 1997 border: $BORDER_SELECTION_3; 1998 } 1999 2000 &::item { 2001 2002 &:pressed { 2003 background-color: $COLOR_ACCENT_2; 2004 } 2005 2006 &:selected { 2007 2008 &:active { 2009 background-color: $COLOR_ACCENT_2; 2010 } 2011 2012 &:!active { 2013 color: $COLOR_TEXT_1; 2014 background-color: $COLOR_BACKGROUND_3; 2015 } 2016 } 2017 2018 &:!selected { 2019 2020 &:hover { 2021 outline: 0; 2022 color: $COLOR_TEXT_1; 2023 background-color: $COLOR_BACKGROUND_3; 2024 } 2025 } 2026 } 2027 } 2028 2029 QTableCornerButton { 2030 &::section { 2031 background-color: $COLOR_BACKGROUND_1; 2032 border: 1px transparent $COLOR_BACKGROUND_4; 2033 border-radius: 0px; 2034 } 2035 } 2036 2037 /* QHeaderView ------------------------------------------------------------ 2038 2039 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qheaderview 2040 2041 --------------------------------------------------------------------------- */ 2042 QHeaderView { 2043 background-color: $COLOR_BACKGROUND_4; 2044 border: 0px transparent $COLOR_BACKGROUND_4; 2045 padding: 0; 2046 margin: 0; 2047 border-radius: 0; 2048 2049 &:disabled { 2050 background-color: $COLOR_BACKGROUND_4; 2051 border: 1px transparent $COLOR_BACKGROUND_4; 2052 } 2053 2054 &::section { 2055 background-color: $COLOR_BACKGROUND_4; 2056 color: $COLOR_TEXT_1; 2057 border-radius: 0; 2058 text-align: left; 2059 font-size: 13px; 2060 2061 &::horizontal { 2062 padding-top: 0; 2063 padding-bottom: 0; 2064 padding-left: 4px; 2065 padding-right: 4px; 2066 border-left: $BORDER_1; 2067 2068 &::first, 2069 &::only-one { 2070 border-left: $BORDER_2; 2071 } 2072 2073 &:disabled { 2074 color: $COLOR_DISABLED; 2075 } 2076 } 2077 2078 &::vertical { 2079 padding-top: 0; 2080 padding-bottom: 0; 2081 padding-left: 4px; 2082 padding-right: 4px; 2083 border-top: $BORDER_1; 2084 2085 &::first, 2086 &::only-one { 2087 border-top: $BORDER_2; 2088 } 2089 2090 &:disabled { 2091 color: $COLOR_DISABLED; 2092 } 2093 } 2094 } 2095 2096 &::down-arrow { 2097 /* Those settings (border/width/height/background-color) solve bug */ 2098 /* transparent arrow background and size */ 2099 background-color: $COLOR_BACKGROUND_4; 2100 border: none; 2101 height: 12px; 2102 width: 12px; 2103 padding-left: 2px; 2104 padding-right: 2px; 2105 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down.png'); 2106 } 2107 2108 &::up-arrow { 2109 background-color: $COLOR_BACKGROUND_4; 2110 border: none; 2111 height: 12px; 2112 width: 12px; 2113 padding-left: 2px; 2114 padding-right: 2px; 2115 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_up.png'); 2116 } 2117 } 2118 2119 /* QToolBox -------------------------------------------------------------- 2120 2121 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qtoolbox 2122 2123 --------------------------------------------------------------------------- */ 2124 QToolBox { 2125 padding: 0px; 2126 border: 0px; 2127 border: $BORDER_2; 2128 2129 &:selected { 2130 padding: 0px; 2131 border: 2px solid $COLOR_ACCENT_2; 2132 } 2133 2134 &::tab { 2135 background-color: $COLOR_BACKGROUND_1; 2136 border: $BORDER_2; 2137 color: $COLOR_TEXT_1; 2138 border-top-left-radius: $SIZE_BORDER_RADIUS; 2139 border-top-right-radius: $SIZE_BORDER_RADIUS; 2140 2141 &:disabled { 2142 color: $COLOR_DISABLED; 2143 } 2144 2145 &:selected { 2146 background-color: $COLOR_BACKGROUND_6; 2147 border-bottom: 2px solid $COLOR_ACCENT_2; 2148 2149 &:disabled { 2150 background-color: $COLOR_BACKGROUND_4; 2151 border-bottom: 2px solid $COLOR_ACCENT_1; 2152 } 2153 } 2154 2155 &:!selected { 2156 background-color: $COLOR_BACKGROUND_4; 2157 border-bottom: 2px solid $COLOR_BACKGROUND_4; 2158 2159 &:disabled { 2160 background-color: $COLOR_BACKGROUND_1; 2161 } 2162 2163 } 2164 2165 &:hover { 2166 border-color: $COLOR_ACCENT_3; 2167 border-bottom: 2px solid $COLOR_ACCENT_3; 2168 } 2169 } 2170 2171 QScrollArea { 2172 padding: 0px; 2173 border: 0px; 2174 background-color: $COLOR_BACKGROUND_1; 2175 } 2176 } 2177 2178 /* QFrame ----------------------------------------------------------------- 2179 2180 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qframe 2181 https://doc.qt.io/qt-5/qframe.html#-prop 2182 https://doc.qt.io/qt-5/qframe.html#details 2183 https://stackoverflow.com/questions/14581498/qt-stylesheet-for-hline-vline-color 2184 2185 --------------------------------------------------------------------------- */ 2186 2187 /* (dot) .QFrame fix #141, #126, #123 */ 2188 2189 .QFrame { 2190 border-radius: $SIZE_BORDER_RADIUS; 2191 border: $BORDER_2; 2192 2193 /* No frame */ 2194 &[frameShape="0"] { 2195 border-radius: $SIZE_BORDER_RADIUS; 2196 border: 1px transparent $COLOR_BACKGROUND_4; 2197 } 2198 2199 /* HLine */ 2200 &[frameShape="4"] { 2201 max-height: 2px; 2202 border: none; 2203 background-color: $COLOR_BACKGROUND_4; 2204 } 2205 2206 /* HLine */ 2207 &[frameShape="5"] { 2208 max-width: 2px; 2209 border: none; 2210 background-color: $COLOR_BACKGROUND_4; 2211 } 2212 2213 } 2214 2215 /* QSplitter -------------------------------------------------------------- 2216 2217 https://doc.qt.io/qt-5/stylesheet-examples.html#customizing-qsplitter 2218 2219 --------------------------------------------------------------------------- */ 2220 QSplitter { 2221 background-color: $COLOR_BACKGROUND_4; 2222 spacing: 0px; 2223 padding: 0px; 2224 margin: 0px; 2225 2226 &::handle { 2227 background-color: $COLOR_BACKGROUND_4; 2228 border: 0px solid $COLOR_BACKGROUND_1; 2229 spacing: 0px; 2230 padding: 1px; 2231 margin: 0px; 2232 2233 &:hover { 2234 background-color: $COLOR_TEXT_4; 2235 } 2236 2237 &:horizontal { 2238 width: 5px; 2239 image: url($PATH_RESOURCES + '/' + $ID + '/rc/line_vertical.png'); 2240 } 2241 2242 &:vertical { 2243 height: 5px; 2244 image: url($PATH_RESOURCES + '/' + $ID + '/rc/line_horizontal.png'); 2245 } 2246 } 2247 } 2248 2249 /* QDateEdit, QDateTimeEdit ----------------------------------------------- 2250 2251 --------------------------------------------------------------------------- */ 2252 QDateEdit, QDateTimeEdit { 2253 selection-background-color: $COLOR_ACCENT_2; 2254 border-style: solid; 2255 border: $BORDER_2; 2256 border-radius: $SIZE_BORDER_RADIUS; 2257 2258 /* This fixes 103, 111 */ 2259 padding-top: 2px; 2260 2261 /* This fixes 103, 111 */ 2262 padding-bottom: 2px; 2263 padding-left: 4px; 2264 padding-right: 4px; 2265 min-width: 10px; 2266 2267 &:on { 2268 selection-background-color: $COLOR_ACCENT_2; 2269 } 2270 2271 &::drop-down { 2272 subcontrol-origin: padding; 2273 subcontrol-position: top right; 2274 width: 12px; 2275 border-left: 1px solid $COLOR_BACKGROUND_4; 2276 } 2277 2278 &::down-arrow { 2279 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down_disabled.png'); 2280 height: 8px; 2281 width: 8px; 2282 2283 &:on, 2284 &:hover, 2285 &:focus { 2286 image: url($PATH_RESOURCES + '/' + $ID + '/rc/arrow_down.png'); 2287 } 2288 2289 } 2290 2291 QAbstractItemView { 2292 background-color: $COLOR_BACKGROUND_1; 2293 border-radius: $SIZE_BORDER_RADIUS; 2294 border: $BORDER_2; 2295 selection-background-color: $COLOR_ACCENT_2; 2296 } 2297 } 2298 2299 2300 /* QAbstractView ---------------------------------------------------------- 2301 2302 --------------------------------------------------------------------------- */ 2303 QAbstractView { 2304 2305 &:hover { 2306 border: $BORDER_SELECTION_2; 2307 color: $COLOR_TEXT_1; 2308 } 2309 2310 &:selected { 2311 background: $COLOR_ACCENT_2; 2312 color: $COLOR_BACKGROUND_4; 2313 } 2314 } 2315 2316 2317 /* PlotWidget ------------------------------------------------------------- 2318 2319 --------------------------------------------------------------------------- */ 2320 PlotWidget { 2321 /* Fix cut labels in plots #134 */ 2322 padding: 0px; 2323 }
3.dark、light
1 $ID: 'dark'; 2 $COLOR_BACKGROUND_6: #60798B; 3 $COLOR_BACKGROUND_5: #54687A; 4 $COLOR_BACKGROUND_4: #455364; 5 $COLOR_BACKGROUND_2: #293544; 6 $COLOR_BACKGROUND_3: #37414F; 7 $COLOR_BACKGROUND_1: #19232D; 8 $COLOR_TEXT_1: #DFE1E2; 9 $COLOR_TEXT_2: #C0C4C8; 10 $COLOR_TEXT_3: #ACB1B6; 11 $COLOR_TEXT_4: #9DA9B5; 12 $COLOR_ACCENT_1: #26486B; 13 $COLOR_ACCENT_2: #346792; 14 $COLOR_ACCENT_3: #1A72BB; 15 $COLOR_ACCENT_4: #259AE9; 16 $COLOR_DISABLED: #788D9C; 17 $OPACITY_TOOLTIP: 230; 18 $SIZE_BORDER_RADIUS: 4px; 19 $BORDER_1: 1px solid $COLOR_BACKGROUND_1; 20 $BORDER_2: 1px solid $COLOR_BACKGROUND_4; 21 $BORDER_3: 1px solid $COLOR_BACKGROUND_6; 22 $BORDER_SELECTION_3: 1px solid $COLOR_ACCENT_3; 23 $BORDER_SELECTION_2: 1px solid $COLOR_ACCENT_2; 24 $BORDER_SELECTION_1: 1px solid $COLOR_ACCENT_1; 25 $PATH_RESOURCES: ':/qss_icons';
1 $ID: 'light'; 2 $COLOR_BACKGROUND_6: #ACB1B6; 3 $COLOR_BACKGROUND_5: #B4B8BC; 4 $COLOR_BACKGROUND_4: #C0C4C8; 5 $COLOR_BACKGROUND_2: #DFE1E2; 6 $COLOR_BACKGROUND_3: #D2D5D8; 7 $COLOR_BACKGROUND_1: #FAFAFA; 8 $COLOR_TEXT_1: #19232D; 9 $COLOR_TEXT_2: #293544; 10 $COLOR_TEXT_3: #54687A; 11 $COLOR_TEXT_4: #788D9C; 12 $COLOR_ACCENT_1: #DAEDFF; 13 $COLOR_ACCENT_2: #9FCBFF; 14 $COLOR_ACCENT_3: #73C7FF; 15 $COLOR_ACCENT_4: #37AEFE; 16 $COLOR_DISABLED: #9DA9B5; 17 $OPACITY_TOOLTIP: 230; 18 $SIZE_BORDER_RADIUS: 4px; 19 $BORDER_1: 1px solid $COLOR_BACKGROUND_1; 20 $BORDER_2: 1px solid $COLOR_BACKGROUND_4; 21 $BORDER_3: 1px solid $COLOR_BACKGROUND_6; 22 $BORDER_SELECTION_3: 1px solid $COLOR_ACCENT_3; 23 $BORDER_SELECTION_2: 1px solid $COLOR_ACCENT_2; 24 $BORDER_SELECTION_1: 1px solid $COLOR_ACCENT_1; 25 $PATH_RESOURCES: ':/qss_icons';
4.颜色
Gray
System Name | Value | Sample |
---|---|---|
B0 | #000000 |
|
B10 | #19232D |
|
B20 | #262E38 |
|
B30 | #37414F |
|
B40 | #455364 |
|
B50 | #54687A |
|
B60 | #60798B |
|
B70 | #788D9C |
|
B80 | #9DA9B5 |
|
B90 | #CBCACA |
|
B100 | #D9D8D8 |
|
B110 | #E1E1E1 |
|
B120 | #EEEEEE |
|
B130 | #F5F5F5 |
|
B140 | #FAFAFA |
|
B150 | #FFFFFF |
Blue
System Name | Value | Sample |
---|---|---|
B0 | #000000 |
|
B10 | #062647 |
|
B20 | #26486B |
|
B30 | #375A7F |
|
B40 | #346792 |
|
B50 | #1A72BB |
|
B60 | #057DCE |
|
B70 | #259AE9 |
|
B80 | #37AEFE |
|
B90 | #73C7FF |
|
B100 | #9FD9FF |
|
B110 | #C2E3FA |
|
B120 | #CEEBFF |
|
B130 | #DAF0FF |
|
B140 | #F5FBFF |
|
B150 | #FFFFFF |
天道酬勤 循序渐进 技压群雄