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 NameValueSample
B0 #000000 image1
B10 #19232D image2
B20 #262E38 image3
B30 #37414F image4
B40 #455364 image5
B50 #54687A image6
B60 #60798B image7
B70 #788D9C image8
B80 #9DA9B5 image9
B90 #CBCACA image10
B100 #D9D8D8 image11
B110 #E1E1E1 image12
B120 #EEEEEE image13
B130 #F5F5F5 image14
B140 #FAFAFA image15
B150 #FFFFFF image16

Blue

System NameValueSample
B0 #000000 image17
B10 #062647 image18
B20 #26486B image19
B30 #375A7F image20
B40 #346792 image21
B50 #1A72BB image22
B60 #057DCE image23
B70 #259AE9 image24
B80 #37AEFE image25
B90 #73C7FF image26
B100 #9FD9FF image27
B110 #C2E3FA image28
B120 #CEEBFF image29
B130 #DAF0FF image30
B140 #F5FBFF image31
B150 #FFFFFF image32
posted @ 2024-03-20 11:10  wuyuan2011woaini  阅读(32)  评论(0编辑  收藏  举报