_drawing.scss 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167
  1. // Drawing mixins
  2. // generic drawing of more complex things
  3. // provide font size in rem, with px fallback
  4. @mixin fontsize($size: 24, $base: 16) {
  5. font-size: round($size) + pt;
  6. //font-size: ($size / $base) * 1rem;
  7. }
  8. // Entries
  9. @mixin entry($t, $dark:false) {
  10. //
  11. // Entries drawing function
  12. //
  13. //@extend %reset_style;
  14. @if $t==normal {
  15. color: $text_color;
  16. background-color: $entry_bg;
  17. border: 1px solid $entry_border;
  18. box-shadow: inset 0 2px 4px transparentize($entry_bg, 0.95);
  19. }
  20. @if $t==focus {
  21. color: $fg_color;
  22. background-color: $entry_bg;
  23. border: 1px solid $selected_bg_color;
  24. box-shadow: inset 0 2px 4px transparentize($entry_bg, 0.95);
  25. }
  26. @if $t==insensitive {
  27. color: $insensitive_fg_color;
  28. background-color: mix($entry_bg, $bg_color, 55%);
  29. border-color: 1px solid mix($entry_border, $bg_color, 55%);
  30. box-shadow: inset 0 2px 4px transparentize(mix($entry_bg, $bg_color, 55%), 0.95);
  31. }
  32. @if $t==osd {
  33. color: $osd_fg_color;
  34. background-color: $osd_entry_bg;
  35. border: 1px solid $osd_entry_border;
  36. box-shadow: inset 0 2px 4px transparentize(black, 0.95);
  37. }
  38. @if $t==osd-focus {
  39. color: $selected_fg_color;
  40. background-color: $selected_bg_color;
  41. border: 1px solid $selected_bg_color;
  42. box-shadow: inset 0 2px 4px transparentize(black, 0.95);
  43. }
  44. @if $t==osd-insensitive {
  45. color: transparentize($osd_fg_color, 0.45);
  46. background-color: transparentize($osd_entry_bg, 0.15);
  47. border: 1px solid $osd_entry_border;
  48. box-shadow: inset 0 2px 4px transparentize(black, 0.95);
  49. }
  50. }
  51. // Buttons
  52. @mixin button($t) {
  53. //
  54. // Button drawing function
  55. //
  56. //@extend %reset_style;
  57. text-shadow: 0 1px transparentize($base_color, 1);
  58. @if $t==normal {
  59. //
  60. // normal button
  61. //
  62. color: $fg_color;
  63. background-color: $button_bg;
  64. border: 1px solid $button_border;
  65. box-shadow: inset 0 2px 4px transparentize($button_bg, 0.95);
  66. }
  67. @else if $t==focus {
  68. //
  69. // focused button
  70. //
  71. color: $fg_color;
  72. background-color: $button_bg;
  73. border: 1px solid $selected_bg_color;
  74. box-shadow: inset 0 2px 4px transparentize($button_bg, 0.95);
  75. }
  76. @else if $t==focus-hover {
  77. //
  78. // focused button
  79. //
  80. color: $fg_color;
  81. background-color: $button_bg;
  82. border: 1px solid $selected_bg_color;
  83. box-shadow: inset 0 2px 4px transparentize($button_bg, 0.95);
  84. }
  85. @else if $t==hover {
  86. //
  87. // hovered button
  88. //
  89. color: $fg_color;
  90. background-color: lighten($button_bg, 5%);
  91. border: 1px solid $button_border;
  92. box-shadow: inset 0 2px 4px transparentize(lighten($button_bg, 5%), 0.95);
  93. }
  94. @else if $t==active {
  95. //
  96. // pushed button
  97. //
  98. color: $selected_fg_color;
  99. background-color: $selected_bg_color;
  100. border: 1px solid $selected_bg_color;
  101. box-shadow: inset 0 2px 4px $selected_bg_color;
  102. }
  103. @else if $t==insensitive {
  104. //
  105. // insensitive button
  106. //
  107. color: $insensitive_fg_color;
  108. border: 1px solid transparentize($button_border, 0.45);
  109. background-color: transparentize($button_bg, 0.45);
  110. box-shadow: inset 0 2px 4px transparentize($button_bg, 0.95);
  111. }
  112. @else if $t==osd {
  113. //
  114. // normal osd button
  115. //
  116. color: $osd_fg_color;
  117. border: 1px solid $osd_button_border;
  118. background-color: $osd_button_bg;
  119. }
  120. @else if $t==osd-hover {
  121. //
  122. // active osd button
  123. //
  124. color: $osd_fg_color;
  125. border: 1px solid $osd_button_border;
  126. background-color: opacify(lighten($osd_button_bg, 7%), 0.1);
  127. }
  128. @else if $t==osd-active {
  129. //
  130. // active osd button
  131. //
  132. color: $selected_fg_color;
  133. border: 1px solid $selected_bg_color;
  134. background-color: $selected_bg_color;
  135. }
  136. @else if $t==osd-insensitive {
  137. //
  138. // insensitive osd button
  139. //
  140. color: $osd_insensitive_fg_color;
  141. border: 1px solid $osd_button_border;
  142. background-color: transparentize($osd_button_bg, 0.15);
  143. }
  144. }