_base-states.scss 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179
  1. /***************
  2. * Base States *
  3. ***************/
  4. .background {
  5. color: $fg_color;
  6. background-color: $bg_color;
  7. &:backdrop {
  8. color: $backdrop_fg_color;
  9. background-color: $backdrop_bg_color;
  10. text-shadow: none;
  11. -gtk-icon-shadow: none;
  12. }
  13. &.chromium { background-color: lighten($base_color, 3%); }
  14. }
  15. /*
  16. These wildcard seems unavoidable, need to investigate.
  17. Wildcards are bad and troublesome, use them with care,
  18. or better, just don't.
  19. Everytime a wildcard is used a kitten dies, painfully.
  20. */
  21. .gtkstyle-fallback {
  22. color: $fg_color;
  23. background-color: $bg_color;
  24. &:hover {
  25. color: $fg_color;
  26. background-color: lighten($bg_color, 10%);
  27. }
  28. &:active {
  29. color: $fg_color;
  30. background-color: darken($bg_color, 10%);
  31. }
  32. &:disabled {
  33. color: $insensitive_fg_color;
  34. background-color: $insensitive_bg_color;
  35. }
  36. &:selected {
  37. color: $selected_fg_color;
  38. background-color: $selected_bg_color;
  39. }
  40. }
  41. .view,
  42. %view {
  43. color: $text_color;
  44. background-color: $base_color;
  45. &:backdrop {
  46. color: $backdrop_text_color;
  47. background-color: $backdrop_base_color;
  48. }
  49. &:selected {
  50. &:focus, & {
  51. @extend %selected_items;
  52. border-radius: 3px;
  53. }
  54. }
  55. }
  56. .view,
  57. textview {
  58. text {
  59. @extend %view;
  60. selection { &:focus, & { @extend %selected_items; }}
  61. }
  62. }
  63. textview border { background-color: mix($bg_color, $base_color, 50%); }
  64. iconview { @extend .view; }
  65. .rubberband,
  66. rubberband {
  67. border: 1px solid darken($selected_bg_color, 10%);
  68. background-color: transparentize(darken($selected_bg_color, 10%), 0.3);
  69. }
  70. flowbox {
  71. rubberband { @extend rubberband; }
  72. flowboxchild {
  73. padding: 3px;
  74. border-radius: 3px;
  75. &:selected {
  76. @extend %selected_items;
  77. outline-offset: -2px;
  78. }
  79. }
  80. }
  81. label {
  82. caret-color: currentColor; // this shouldn't be needed.
  83. &.separator {
  84. @extend .dim-label;
  85. color: $fg_color;
  86. &:backdrop { color: $backdrop_fg_color; }
  87. }
  88. row:selected &,
  89. &:selected { @extend %nobg_selected_items; }
  90. selection {
  91. background-color: $selected_bg_color;
  92. color: $selected_fg_color;
  93. }
  94. &:disabled {
  95. color: $insensitive_fg_color;
  96. selection { @extend %selected_items:disabled; }
  97. &:backdrop { color: $backdrop_insensitive_color; }
  98. }
  99. &:backdrop {
  100. color: $backdrop_fg_color;
  101. selection { @extend %selected_items:backdrop; }
  102. }
  103. }
  104. .dim-label {
  105. opacity: 0.55;
  106. text-shadow: none;
  107. }
  108. assistant {
  109. .sidebar {
  110. background-color: $base_color;
  111. border-top: 1px solid $borders_color;
  112. &:backdrop {
  113. background-color: $backdrop_base_color;
  114. border-color: $backdrop_borders_color;
  115. }
  116. }
  117. &.csd .sidebar { border-top-style: none; }
  118. .sidebar label { padding: 6px 12px; }
  119. .sidebar label.highlight { background-color: mix($bg_color, $fg_color, 80%); }
  120. }
  121. %osd, .osd {
  122. color: $osd_fg_color;
  123. border: none;
  124. background-color: $osd_bg_color;
  125. background-clip: padding-box;
  126. outline-color: transparentize($osd_fg_color, 0.7);
  127. text-shadow: 0 1px black;
  128. -gtk-icon-shadow: 0 1px black;
  129. &:backdrop {
  130. text-shadow: none;
  131. -gtk-icon-shadow: none;
  132. }
  133. }
  134. *:selected {
  135. background: $selected_bg_color;
  136. color: $selected_fg_color;
  137. }