_base-states.scss 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  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. selection {
  22. background-color: $selected_bg_color;
  23. color: $selected_fg_color;
  24. }
  25. *:disabled { -gtk-icon-effect: dim; }
  26. .gtkstyle-fallback {
  27. color: $fg_color;
  28. background-color: $bg_color;
  29. &:hover {
  30. color: $fg_color;
  31. background-color: lighten($bg_color, 10%);
  32. }
  33. &:active {
  34. color: $fg_color;
  35. background-color: darken($bg_color, 10%);
  36. }
  37. &:disabled {
  38. color: $insensitive_fg_color;
  39. background-color: $insensitive_bg_color;
  40. }
  41. &:selected {
  42. color: $selected_fg_color;
  43. background-color: $selected_bg_color;
  44. }
  45. }
  46. .view,
  47. %view {
  48. color: $text_color;
  49. background-color: $base_color;
  50. &:backdrop {
  51. color: $backdrop_text_color;
  52. background-color: $backdrop_base_color;
  53. }
  54. &:selected {
  55. &:focus, & {
  56. @extend %selected_items;
  57. border-radius: 3px;
  58. }
  59. }
  60. }
  61. .view,
  62. textview {
  63. text {
  64. @extend %view;
  65. selection { &:focus, & { @extend %selected_items; }}
  66. }
  67. }
  68. textview border { background-color: mix($bg_color, $base_color, 50%); }
  69. iconview { @extend .view; }
  70. .rubberband,
  71. rubberband {
  72. border: 1px solid darken($selected_bg_color, 10%);
  73. background-color: transparentize(darken($selected_bg_color, 10%), 0.3);
  74. }
  75. flowbox {
  76. rubberband { @extend rubberband; }
  77. flowboxchild {
  78. padding: 3px;
  79. border-radius: 3px;
  80. &:selected {
  81. @extend %selected_items;
  82. outline-offset: -2px;
  83. }
  84. }
  85. }
  86. label {
  87. caret-color: currentColor; // this shouldn't be needed.
  88. &.separator {
  89. @extend .dim-label;
  90. color: $fg_color;
  91. &:backdrop { color: $backdrop_fg_color; }
  92. }
  93. row:selected &,
  94. &:selected { @extend %nobg_selected_items; }
  95. selection {
  96. background-color: $selected_bg_color;
  97. color: $selected_fg_color;
  98. }
  99. &:disabled {
  100. color: $insensitive_fg_color;
  101. selection { @extend %selected_items:disabled; }
  102. &:backdrop { color: $backdrop_insensitive_color; }
  103. }
  104. &:backdrop {
  105. color: $backdrop_fg_color;
  106. selection { @extend %selected_items:backdrop; }
  107. }
  108. }
  109. .dim-label {
  110. opacity: 0.55;
  111. text-shadow: none;
  112. }
  113. assistant {
  114. .sidebar {
  115. background-color: $base_color;
  116. border-top: 1px solid $borders_color;
  117. &:backdrop {
  118. background-color: $backdrop_base_color;
  119. border-color: $backdrop_borders_color;
  120. }
  121. }
  122. &.csd .sidebar { border-top-style: none; }
  123. .sidebar label { padding: 6px 12px; }
  124. .sidebar label.highlight { background-color: mix($bg_color, $fg_color, 80%); }
  125. }
  126. %osd, .osd {
  127. color: $osd_fg_color;
  128. border: none;
  129. background-color: $osd_bg_color;
  130. background-clip: padding-box;
  131. outline-color: transparentize($osd_fg_color, 0.7);
  132. text-shadow: 0 1px black;
  133. -gtk-icon-shadow: 0 1px black;
  134. &:backdrop {
  135. text-shadow: none;
  136. -gtk-icon-shadow: none;
  137. }
  138. }
  139. *:selected {
  140. background: $selected_bg_color;
  141. color: $selected_fg_color;
  142. }