Changeset View
Changeset View
Standalone View
Standalone View
src/gtk3/widgets/_treeview.scss
1 | @charset "UTF-8"; | 1 | @charset "UTF-8"; | ||
---|---|---|---|---|---|
2 | 2 | | |||
3 | @mixin item-highlight-middle { | ||||
4 | @if $new-highlight { | ||||
5 | background-color: gtkalpha(gtk("@theme_button_decoration_focus"), 0.3); | ||||
6 | color: gtk("@theme_button_foreground_active"); | ||||
7 | border: 1px solid gtk("@theme_button_decoration_focus"); | ||||
8 | border-left: 0; | ||||
9 | border-right: 0; | ||||
10 | border-radius: 0px; | ||||
11 | } @else { | ||||
12 | background-color: gtk("@theme_selected_bg_color"); | ||||
13 | border-left-color: gtk("@theme_selected_fg_color"); | ||||
14 | border-top-color: gtk("@theme_selected_fg_color"); | ||||
15 | } | ||||
16 | } | ||||
3 | 17 | | |||
18 | @mixin item-highlight-middle-backdrop { | ||||
19 | @if $new-highlight { | ||||
20 | background-color: gtkalpha(gtk("@theme_button_decoration_focus_backdrop"), 0.3); | ||||
21 | color: gtk("@theme_button_foreground_active_backdrop"); | ||||
22 | border: 1px solid gtk("@theme_button_decoration_focus_backdrop"); | ||||
23 | border-left: 0; | ||||
24 | border-right: 0; | ||||
25 | border-radius: 0px; | ||||
26 | } @else { | ||||
27 | background-color: gtk("@theme_unfocused_selected_bg_color"); | ||||
28 | border-left-color: gtk("@theme_unfocused_selected_fg_color"); | ||||
29 | border-top-color: gtk("@theme_unfocused_selected_fg_color"); | ||||
30 | } | ||||
31 | } | ||||
4 | 32 | | |||
5 | /************** | 33 | /************** | ||
6 | * Tree Views * | 34 | * Tree Views * | ||
7 | **************/ | 35 | **************/ | ||
8 | treeview.view { | 36 | treeview.view { | ||
9 | -GtkTreeView-grid-line-width: 0; | 37 | -GtkTreeView-grid-line-width: 0; | ||
10 | -GtkTreeView-grid-line-pattern: ''; | 38 | -GtkTreeView-grid-line-pattern: ''; | ||
11 | -GtkTreeView-tree-line-width: 1; | 39 | -GtkTreeView-tree-line-width: 1; | ||
12 | -GtkTreeView-tree-line-pattern: ''; | 40 | -GtkTreeView-tree-line-pattern: ''; | ||
13 | -GtkTreeView-expander-size: 16; | 41 | -GtkTreeView-expander-size: 16; | ||
14 | 42 | | |||
15 | border-left-color: $border_color; // this is actually the tree lines color, | 43 | border-left-color: gtk("@borders"); // this is actually the tree lines color, | ||
16 | border-top-color: transparent; // while this is the grid lines color, better then nothing | 44 | border-top-color: transparent; // while this is the grid lines color, better then nothing | ||
17 | 45 | | |||
18 | rubberband { @extend rubberband; } // to avoid borders being overridden by the previously set props | 46 | rubberband { @extend rubberband; } // to avoid borders being overridden by the previously set props | ||
19 | 47 | | |||
20 | &:selected { border-radius: 0; } // rest border radius in lists | 48 | &:selected { border-radius: 0; } // rest border radius in lists | ||
21 | 49 | | |||
50 | &:hover { | ||||
51 | @include item-highlight-middle(); | ||||
52 | } | ||||
53 | | ||||
22 | &:selected { | 54 | &:selected { | ||
23 | background-color: s_color(normal); | 55 | @include item-highlight-middle(); | ||
24 | border-left-color: s_color(text); | | |||
25 | border-top-color: s_color(text); // doesn't work unfortunatelly | | |||
26 | } | 56 | } | ||
57 | | ||||
27 | &:backdrop:selected { | 58 | &:backdrop:selected { | ||
28 | background-color: backdrop(s_color(backdrop)); | 59 | @include item-highlight-middle-backdrop(); | ||
29 | border-left-color: backdrop(s_color(text)); | | |||
30 | border-top-color: backdrop(s_color(text)); | | |||
31 | } | 60 | } | ||
32 | 61 | | |||
33 | &:disabled { | 62 | &:disabled { | ||
34 | color: insensitive($border_color); | 63 | color: gtk("@insensitive_borders"); | ||
35 | &:selected { | 64 | &:selected { | ||
36 | color: insensitive(s_color(text)); | 65 | color: gtk("@insensitive_selected_fg_color"); | ||
37 | &:backdrop { color: backdrop(insensitive(s_color(text))); } | 66 | &:backdrop { color: gtk("@insensitive_unfocused_selected_fg_color"); } | ||
38 | } | 67 | } | ||
39 | &:backdrop { color: backdrop(insensitive($border_color)); } | 68 | &:backdrop { color: gtk("@unfocused_insensitive_borders"); } | ||
40 | } | 69 | } | ||
41 | &.separator { | 70 | &.separator { | ||
42 | min-height: 2px; | 71 | min-height: 2px; | ||
43 | color: $border_color; | 72 | color: gtk("@borders"); | ||
44 | } | 73 | } | ||
45 | &.separator:backdrop { | 74 | &.separator:backdrop { | ||
46 | color: backdrop($border_color); | 75 | color: gtk("@unfocused_borders"); | ||
47 | } | 76 | } | ||
48 | 77 | | |||
49 | &:backdrop { | 78 | &:backdrop { | ||
50 | border-left-color: backdrop($border_color); | 79 | border-left-color: gtk("@unfocused_borders"); | ||
51 | } | 80 | } | ||
52 | 81 | | |||
53 | &:drop(active) { | 82 | &:drop(active) { | ||
54 | border-style: solid none; | 83 | border-style: solid none; | ||
55 | border-width: 1px; | 84 | border-width: 1px; | ||
56 | border-color: b_color(hover); | 85 | border-color: gtk("@theme_button_decoration_hover"); | ||
57 | } | 86 | } | ||
58 | 87 | | |||
59 | &.expander { | 88 | &.expander { | ||
60 | // GtkTreeView uses the larger of the expander’s min-width and min-height | 89 | // GtkTreeView uses the larger of the expander’s min-width and min-height | ||
61 | min-width: 16px; | 90 | min-width: 16px; | ||
62 | min-height: 16px; | 91 | min-height: 16px; | ||
63 | -gtk-icon-source: -gtk-icontheme('pan-end-symbolic'); | 92 | -gtk-icon-source: -gtk-icontheme('pan-end-symbolic'); | ||
64 | color: v_color(text); | 93 | color: gtk("@theme_base_fg_color"); | ||
65 | &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic'); }; | 94 | &:dir(rtl) { -gtk-icon-source: -gtk-icontheme('pan-start-symbolic'); }; | ||
66 | &:hover { color: b_color(hover); } | 95 | &:hover { color: gtk("@theme_button_decoration_hover"); } | ||
67 | &:selected { color: s_color(text); } | 96 | &:selected { color: gtk("@theme_selected_fg_color"); } | ||
68 | &:checked { | 97 | &:checked { | ||
69 | -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); | 98 | -gtk-icon-source: -gtk-icontheme('pan-down-symbolic'); | ||
70 | &:selected { color: s_color(text); } | 99 | &:selected { color: gtk("@theme_selected_fg_color"); } | ||
71 | &:backdrop { color: backdrop(v_color(normal)); } | 100 | &:backdrop { color: gtk("@theme_unfocused_base_color"); } | ||
72 | } | 101 | } | ||
73 | &:backdrop { color: backdrop(v_color(normal)); } | 102 | &:backdrop { color: gtk("@theme_unfocused_base_color"); } | ||
74 | } | 103 | } | ||
75 | header { | 104 | header { | ||
76 | button { | 105 | button { | ||
77 | @extend %column_header_button; | 106 | @extend %column_header_button; | ||
78 | color: b_color(text); | 107 | color: gtk("@theme_button_foreground_normal"); | ||
79 | background-color: b_color(normal); | 108 | background-color: gtk("@theme_button_background_normal"); | ||
80 | text-shadow: none; | 109 | text-shadow: none; | ||
81 | box-shadow: none; | 110 | box-shadow: none; | ||
82 | &:hover { | 111 | &:hover { | ||
83 | @extend %column_header_button; | 112 | @extend %column_header_button; | ||
84 | color: b_color(text); | 113 | color: gtk("@theme_button_foreground_normal"); | ||
85 | background-color: transparentize(b_color(hover), 0.5); | 114 | background-color: gtkalpha("@theme_button_decoration_hover", 0.5); | ||
86 | box-shadow: none; | 115 | box-shadow: none; | ||
87 | transition: none; //I shouldn't need this | 116 | transition: none; //I shouldn't need this | ||
88 | } | 117 | } | ||
89 | &:active { | 118 | &:active { | ||
90 | @extend %column_header_button; | 119 | @extend %column_header_button; | ||
91 | color: b_color(text); | 120 | color: gtk("@theme_button_foreground_normal"); | ||
92 | background-color: transparentize(b_color(hover), 0.5); | 121 | background-color: gtkalpha("@theme_button_decoration_hover", 0.5); | ||
93 | transition: none; //I shouldn't need this | 122 | transition: none; //I shouldn't need this | ||
94 | } | 123 | } | ||
95 | } | 124 | } | ||
96 | button:last-child { &:backdrop, & { border-right-style: none; }} | 125 | button:last-child { &:backdrop, & { border-right-style: none; }} | ||
97 | } | 126 | } | ||
98 | button.dnd, | 127 | button.dnd, | ||
99 | header.button.dnd { // for treeview-like derive widgets | 128 | header.button.dnd { // for treeview-like derive widgets | ||
100 | &:active, &:selected, &:hover, & { | 129 | &:active, &:selected, &:hover, & { | ||
101 | padding: 0 6px; | 130 | padding: 0 6px; | ||
102 | color: s_color(text); | 131 | color: gtk("@theme_selected_fg_color"); | ||
103 | background-image: none; | 132 | background-image: none; | ||
104 | background-color: s_color(normal); | 133 | background-color: gtk("@theme_selected_bg_color"); | ||
105 | border-style: none; | 134 | border-style: none; | ||
106 | border-radius: 0; | 135 | border-radius: 0; | ||
107 | box-shadow: none; | 136 | box-shadow: none; | ||
108 | text-shadow: none; | 137 | text-shadow: none; | ||
109 | transition: none; | 138 | transition: none; | ||
110 | } | 139 | } | ||
111 | } | 140 | } | ||
112 | } | 141 | } | ||
113 | 142 | | |||
114 | %column_header_button { | 143 | %column_header_button { | ||
115 | padding: 6px; | 144 | padding: 6px; | ||
116 | border-style: none solid solid none; | 145 | border-style: none solid solid none; | ||
117 | border-radius: 0; | 146 | border-radius: 0; | ||
118 | background-image: none; | 147 | background-image: none; | ||
119 | border-color: $border_color; | 148 | border-color: gtk("@borders"); | ||
120 | text-shadow: none; | 149 | text-shadow: none; | ||
121 | &:disabled { | 150 | &:disabled { | ||
122 | border-color: insensitive($border_color); | 151 | border-color: gtk("@insensitive_borders"); | ||
123 | color: insensitive(b_color(text)); | 152 | color: gtk("@theme_button_foreground_insensitive"); | ||
124 | background-color: insensitive(b_color(normal)); | 153 | background-color: gtk("@theme_button_background_insensitive"); | ||
125 | background-image: none; | 154 | background-image: none; | ||
126 | } | 155 | } | ||
127 | &:backdrop { | 156 | &:backdrop { | ||
128 | border-color: backdrop($border_color); | 157 | border-color: gtk("@unfocused_borders"); | ||
129 | border-style: none solid solid none; | 158 | border-style: none solid solid none; | ||
130 | color: backdrop(b_color(text)); | 159 | color: gtk("@theme_button_foreground_backdrop"); | ||
131 | background-image: none; | 160 | background-image: none; | ||
132 | background-color: backdrop(b_color(normal)); | 161 | background-color: gtk("@theme_button_background_backdrop"); | ||
133 | &:disabled { | 162 | &:disabled { | ||
134 | border-color: backdrop(insensitive($border_color)); | 163 | border-color: gtk("@unfocused_insensitive_borders"); | ||
135 | background-image: none; | 164 | background-image: none; | ||
136 | background-color: backdrop(insensitive(b_color(normal))); | 165 | background-color: gtk("@theme_button_background_backdrop_insensitive"); | ||
137 | color: backdrop(insensitive(b_color(text))); | 166 | color: gtk("@theme_button_foreground_backdrop_insensitive"); | ||
138 | } | 167 | } | ||
139 | } | 168 | } | ||
140 | } | 169 | } |