_windows.scss 3.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142
  1. /**********************
  2. * Window Decorations *
  3. *********************/
  4. decoration {
  5. border-radius: 4px 4px 0 0;
  6. // lamefun trick to get rounded borders regardless of CSD use
  7. border-width: 0px;
  8. // this needs to be transparent
  9. // see bug #722563
  10. $_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize($borders_color, 0.1));
  11. $_wm_border_backdrop: if($variant=='light', transparentize(black, 0.82), transparentize($borders_color, 0.1));
  12. // lamefun trick to get rounded borders regardless of CSD use
  13. border-width: 0px;
  14. box-shadow: 0 2px 4px 2px transparentize(black, 0.8);
  15. // FIXME rationalize shadows
  16. // this is used for the resize cursor area
  17. margin: 10px;
  18. &:backdrop {
  19. // the transparent shadow here is to enforce that the shadow extents don't
  20. // change when we go to backdrop, to prevent jumping windows.
  21. // The biggest shadow should be in the same order then in the active state
  22. // or the jumping will happen during the transition.
  23. box-shadow: 0 2px 4px 2px transparentize(black, 0.85);
  24. transition: $backdrop_transition;
  25. }
  26. .maximized &,
  27. .fullscreen &,
  28. .tiled & { border-radius: 0; }
  29. .popup & { box-shadow: none; }
  30. // server-side decorations as used by mutter
  31. .ssd & { } //just doing borders, wm draws actual shadows
  32. .csd.popup & {
  33. border-radius: 0;
  34. box-shadow: 0 1px 6px transparentize(black, 0.6),
  35. 0 0 0 1px transparentize($_wm_border,0.1);
  36. }
  37. tooltip.csd & {
  38. border-radius: 5px;
  39. box-shadow: none;
  40. }
  41. messagedialog.csd & {
  42. border-radius: 7px;
  43. box-shadow: 0 1px 2px transparentize(black, 0.8),
  44. 0 0 0 1px transparentize($_wm_border,0.1);
  45. }
  46. .solid-csd & {
  47. border-radius: 0;
  48. margin: 0px;
  49. background-color: $backdrop_bg_color;
  50. border: solid 1px $backdrop_borders_color;
  51. box-shadow: none;
  52. }
  53. }
  54. // Window Close button
  55. button.titlebutton {
  56. background-repeat: no-repeat;
  57. background-position: center;
  58. min-height: 32px;
  59. padding: 0 3px;
  60. box-shadow: none;
  61. &.close {
  62. background-image: -gtk-scaled(url("../assets/close.png"),url("../assets/close@2.png"));
  63. &:hover,&:active {
  64. background-image: -gtk-scaled(url("../assets/close_prelight.png"),url("../assets/close_prelight@2.png"));
  65. }
  66. }
  67. &.maximize {
  68. background-image: -gtk-scaled(url("../assets/maximize.png"),url("../assets/maximize@2.png"));
  69. &:hover,&:active {
  70. background-image: -gtk-scaled(url("../assets/maximize_prelight.png"),url("../assets/maximize_prelight@2.png"));
  71. }
  72. }
  73. &.minimize {
  74. background-image: -gtk-scaled(url("../assets/min.png"),url("../assets/min@2.png"));
  75. &:hover,&:active {
  76. background-image: -gtk-scaled(url("../assets/min_prelight.png"),url("../assets/min_prelight@2.png"));
  77. }
  78. }
  79. &.close, &.minimize, &.maximize {
  80. &:backdrop {
  81. background-image: -gtk-scaled(url("../assets/close_unfocused.png"),url("../assets/close_unfocused@2.png"));
  82. }
  83. }
  84. .selection-mode & {
  85. @extend %button.flat.suggested-action;
  86. @extend %nobg_selected_items;
  87. }
  88. &:backdrop {
  89. -gtk-icon-shadow: none;
  90. }
  91. }
  92. headerbar.selection-mode button.titlebutton,
  93. .titlebar.selection-mode button.titlebutton {
  94. @include _button_text_shadow(white, $selected_bg_color);
  95. &:backdrop { -gtk-icon-shadow: none; }
  96. }
  97. // catch all extend :)
  98. %selected_items {
  99. background-color: $selected_bg_color;
  100. @at-root %nobg_selected_items, & {
  101. color: $selected_fg_color;
  102. font-weight: bold;
  103. @if $variant == 'light' { outline-color: transparentize($selected_fg_color, 0.7); }
  104. &:disabled { color: mix($selected_fg_color, $selected_bg_color, 50%); }
  105. &:backdrop {
  106. color: $backdrop_selected_fg_color;
  107. &:disabled { color: mix($backdrop_selected_fg_color, $selected_bg_color, 30%); }
  108. }
  109. }
  110. }
  111. .monospace { font-family: Monospace; }