]> git.proxmox.com Git - extjs.git/blame - extjs/classic/theme-neutral/sass/var/view/Table.scss
add extjs 6.0.1 sources
[extjs.git] / extjs / classic / theme-neutral / sass / var / view / Table.scss
CommitLineData
6527f429
DM
1/**\r
2 * @class Ext.view.Table\r
3 */\r
4\r
5/**\r
6 * @var {color}\r
7 * The color of the text in the grid cells\r
8 */\r
9$grid-row-cell-color: dynamic($color);\r
10\r
11/**\r
12 * @var {number}\r
13 * The font size of the text in the grid cells\r
14 */\r
15$grid-row-cell-font-size: dynamic($font-size);\r
16/**\r
17 * @var {number}\r
18 * The line-height of the text inside the grid cells.\r
19 */\r
20$grid-row-cell-line-height: dynamic(round($grid-row-cell-font-size * 1.15));\r
21\r
22/**\r
23 * @var {string}\r
24 * The font-weight of the text in the grid cells\r
25 */\r
26$grid-row-cell-font-weight: dynamic($font-weight);\r
27\r
28/**\r
29 * @var {string}\r
30 * The font-family of the text in the grid cells\r
31 */\r
32$grid-row-cell-font-family: dynamic($font-family);\r
33\r
34// private\r
35$grid-row-cell-font: dynamic($grid-row-cell-font-weight #{$grid-row-cell-font-size}/#{$grid-row-cell-line-height} $grid-row-cell-font-family);\r
36\r
37/**\r
38 * @var {color}\r
39 * The background-color of the grid cells\r
40 */\r
41$grid-row-cell-background-color: dynamic(#fff);\r
42\r
43/**\r
44 * @var {color}\r
45 * The border-color of row/column borders. Can be specified as a single color, or as a list\r
46 * of colors containing the row border color followed by the column border color.\r
47 */\r
48$grid-row-cell-border-color: dynamic(#ededed);\r
49\r
50/**\r
51 * @var {string}\r
52 * The border-style of the row/column borders.\r
53 */\r
54$grid-row-cell-border-style: dynamic(solid);\r
55\r
56/**\r
57 * @var {number}\r
58 * The border-width of the row and column borders.\r
59 */\r
60$grid-row-cell-border-width: dynamic(1px);\r
61\r
62/**\r
63 * @var {color}\r
64 * The background-color of "special" cells. Special cells are created by {@link\r
65 * Ext.grid.RowNumberer RowNumberer}, {@link Ext.selection.CheckboxModel Checkbox Selection\r
66 * Model} and {@link Ext.grid.plugin.RowExpander RowExpander}.\r
67 */\r
68$grid-cell-special-background-color: dynamic($grid-row-cell-background-color);\r
69\r
70/**\r
71 * @var {string}\r
72 * The background-gradient to use for "special" cells. Special cells are created by {@link\r
73 * Ext.grid.RowNumberer RowNumberer}, {@link Ext.selection.CheckboxModel Checkbox Selection\r
74 * Model} and {@link Ext.grid.plugin.RowExpander RowExpander}.\r
75 */\r
76$grid-cell-special-background-gradient: dynamic('none');\r
77\r
78/**\r
79 * @var {number}\r
80 * The border-width of "special" cells. Special cells are created by {@link\r
81 * Ext.grid.RowNumberer RowNumberer}, {@link Ext.selection.CheckboxModel Checkbox Selection\r
82 * Model} and {@link Ext.grid.plugin.RowExpander RowExpander}.\r
83 * Only applies to the vertical border, since the row border width is determined by\r
84 * {#$grid-row-cell-border-width}.\r
85 */\r
86$grid-cell-special-border-width: dynamic($grid-row-cell-border-width);\r
87\r
88/**\r
89 * @var {color}\r
90 * The border-color of "special" cells. Special cells are created by {@link\r
91 * Ext.grid.RowNumberer RowNumberer}, {@link Ext.selection.CheckboxModel Checkbox Selection\r
92 * Model} and {@link Ext.grid.plugin.RowExpander RowExpander}.\r
93 * Only applies to the vertical border, since the row border color is determined by\r
94 * {#$grid-row-cell-border-color}.\r
95 */\r
96$grid-cell-special-border-color: dynamic(right($grid-row-cell-border-color));\r
97\r
98/**\r
99 * @var {string}\r
100 * The border-style of "special" cells. Special cells are created by {@link\r
101 * Ext.grid.RowNumberer RowNumberer}, {@link Ext.selection.CheckboxModel Checkbox Selection\r
102 * Model} and {@link Ext.grid.plugin.RowExpander RowExpander}.\r
103 * Only applies to the vertical border, since the row border style is determined by\r
104 * {#$grid-row-cell-border-style}.\r
105 */\r
106$grid-cell-special-border-style: dynamic($grid-row-cell-border-style);\r
107\r
108/**\r
109 * @var {color}\r
110 * The border-color of "special" cells when the row is selected using a {@link\r
111 * Ext.selection.RowModel Row Selection Model}. Special cells are created by {@link\r
112 * Ext.grid.RowNumberer RowNumberer}, {@link Ext.selection.CheckboxModel Checkbox Selection\r
113 * Model} and {@link Ext.grid.plugin.RowExpander RowExpander}.\r
114 * Only applies to the vertical border, since the selected row border color is determined by\r
115 * {#$grid-row-cell-selected-border-color}.\r
116 */\r
117$grid-cell-special-selected-border-color: dynamic(right($grid-row-cell-border-color));\r
118\r
119/**\r
120 * @var {color}\r
121 * The background-color of "special" cells when the row is hovered. Special cells are\r
122 * created by {@link Ext.grid.RowNumberer RowNumberer}, {@link Ext.selection.CheckboxModel\r
123 * Checkbox Selection Model} and {@link Ext.grid.plugin.RowExpander RowExpander}.\r
124 */\r
125$grid-cell-special-over-background-color: dynamic($grid-row-cell-over-background-color);\r
126\r
127/**\r
128 * @var {color}\r
129 * The background-color color of odd-numbered rows when the table view is configured with\r
130 * `{@link Ext.view.Table#stripeRows stripeRows}: true`.\r
131 */\r
132$grid-row-cell-alt-background-color: dynamic(darken($grid-row-cell-background-color, 2));\r
133\r
134/**\r
135 * @var {string}\r
136 * The border-style of the hovered row\r
137 */\r
138$grid-row-cell-over-border-style: dynamic(solid);\r
139\r
140/**\r
141 * @var {color}\r
142 * The text color of the hovered row\r
143 */\r
144$grid-row-cell-over-color: dynamic($grid-row-cell-color);\r
145\r
146/**\r
147 * @var {color}\r
148 * The background-color of the hovered row\r
149 */\r
150$grid-row-cell-over-background-color: dynamic(#ddd);\r
151\r
152/**\r
153 * @var {color}\r
154 * The border-color of the hovered row\r
155 */\r
156$grid-row-cell-over-border-color: dynamic(top($grid-row-cell-border-color));\r
157\r
158/**\r
159 * @var {string}\r
160 * The border-style of the selected row\r
161 */\r
162$grid-row-cell-selected-border-style: dynamic(solid);\r
163\r
164/**\r
165 * @var {color}\r
166 * The text color of the selected row\r
167 */\r
168$grid-row-cell-selected-color: dynamic($grid-row-cell-color);\r
169\r
170/**\r
171 * @var {color}\r
172 * The background-color of the selected row\r
173 */\r
174$grid-row-cell-selected-background-color: dynamic(#ccc);\r
175\r
176/**\r
177 * @var {color}\r
178 * The border-color of the selected row\r
179 */\r
180$grid-row-cell-selected-border-color: dynamic(top($grid-row-cell-border-color));\r
181\r
182/**\r
183 * @var {number}\r
184 * The border-width of the focused cell\r
185 */\r
186$grid-row-cell-focus-border-width: dynamic(1px);\r
187\r
188/**\r
189 * @var {color}\r
190 * The border-color of the focused cell\r
191 */\r
192$grid-row-cell-focus-border-color: dynamic(#808080);\r
193\r
194/**\r
195 * @var {string}\r
196 * The border-style of the focused cell\r
197 */\r
198$grid-row-cell-focus-border-style: dynamic(dotted);\r
199\r
200/**\r
201 * @var {number}\r
202 * The spacing between grid cell border and inner focus border\r
203 */\r
204$grid-row-cell-focus-border-inset: dynamic(0px);\r
205\r
206/**\r
207 * @var {color}\r
208 * The text color of the focused cell\r
209 */\r
210$grid-row-cell-focus-color: dynamic($grid-row-cell-color);\r
211\r
212/**\r
213 * @var {color}\r
214 * The background-color of the focused cell\r
215 */\r
216$grid-row-cell-focus-background-color: dynamic('none');\r
217\r
218/**\r
219 * @var {boolean}\r
220 * True to show the focus border when a row is focused even if the grid has no\r
221 * {@link Ext.panel.Table#rowLines rowLines}.\r
222 */\r
223$grid-no-row-lines-show-focus-border: dynamic(false);\r
224\r
225/**\r
226 * @var {color}\r
227 * The text color of a selected cell when using a {@link Ext.selection.CellModel\r
228 * Cell Selection Model}.\r
229 */\r
230$grid-cell-selected-color: dynamic($grid-row-cell-selected-color);\r
231\r
232/**\r
233 * @var {color}\r
234 * The background-color of a selected cell when using a {@link Ext.selection.CellModel\r
235 * Cell Selection Model}.\r
236 */\r
237$grid-cell-selected-background-color: dynamic($grid-row-cell-selected-background-color);\r
238\r
239/**\r
240 * @var {number}\r
241 * The amount of padding to apply to the grid cell's inner div element\r
242 */\r
243$grid-cell-inner-padding: dynamic(3px 6px);\r
244\r
245/**\r
246 * @var {string}\r
247 * The type of text-overflow to use on the grid cell's inner div element\r
248 */\r
249$grid-cell-inner-text-overflow: dynamic(ellipsis);\r
250\r
251/**\r
252 * @var {color}\r
253 * The border-color of the grid body\r
254 */\r
255$grid-body-border-color: dynamic($panel-body-border-color);\r
256\r
257/**\r
258 * @var {number}\r
259 * The border-width of the grid body border\r
260 */\r
261$grid-body-border-width: dynamic($panel-body-border-width);\r
262\r
263/**\r
264 * @var {string}\r
265 * The border-style of the grid body border\r
266 */\r
267$grid-body-border-style: dynamic($panel-body-border-style);\r
268\r
269/**\r
270 * @var {color}\r
271 * The background-color of the grid body\r
272 */\r
273$grid-body-background-color: dynamic($panel-body-background-color);\r
274\r
275/**\r
276 * @var {number}\r
277 * The amount of padding to apply to the grid body when the grid contains no data.\r
278 */\r
279$grid-empty-padding: dynamic(10px);\r
280\r
281/**\r
282 * @var {color}\r
283 * The text color of the {@link Ext.view.Table#emptyText emptyText} in the grid body when\r
284 * the grid contains no data.\r
285 */\r
286$grid-empty-color: dynamic(#808080);\r
287\r
288/**\r
289 * @var {color}\r
290 * The background color of the grid body when the grid contains no data.\r
291 */\r
292$grid-empty-background-color: dynamic($panel-body-background-color);\r
293\r
294/**\r
295 * @var {number}\r
296 * The font-size of the {@link Ext.view.Table#emptyText emptyText} in the grid body when\r
297 * the grid contains no data.\r
298 */\r
299$grid-empty-font-size: dynamic($grid-row-cell-font-size);\r
300\r
301/**\r
302 * @var {number}\r
303 * The font-weight of the {@link Ext.view.Table#emptyText emptyText} in the grid body when\r
304 * the grid contains no data.\r
305 */\r
306$grid-empty-font-weight: dynamic($font-weight);\r
307\r
308/**\r
309 * @var {number}\r
310 * The font-family of the {@link Ext.view.Table#emptyText emptyText} in the grid body when\r
311 * the grid contains no data.\r
312 */\r
313$grid-empty-font-family: dynamic($font-family);\r
314\r
315/**\r
316 * @var {color}\r
317 * The color of the resize markers that display when dragging a column border to resize\r
318 * the column\r
319 */\r
320$grid-resize-marker-background-color: dynamic(#0f0f0f);\r
321\r
322/**\r
323 * @var {color}\r
324 * The color of the grid cell dirty indicator when {@link Global_CSS#$enable-font-icons} is `true`.\r
325 */\r
326$grid-cell-dirty-glyph-color: dynamic(#c30);\r
327\r
328/**\r
329 * @var {string/list}\r
330 * Glyph for the grid cell dirty indicator when {@link Global_CSS#$enable-font-icons} is `true`.\r
331 */\r
332$grid-cell-dirty-glyph: dynamic($ext-var-dirty 14px ExtJS);\r
333\r
334/**\r
335 * @var {string/list}\r
336 * Glyph for the grid cell dirty indicator in rtl mode\r
337 * when {@link Global_CSS#$enable-font-icons} is `true`.\r
338 */\r
339$grid-cell-dirty-glyph-rtl: dynamic($ext-var-dirty-rtl 14px ExtJS);\r
340\r
341// private\r
342$grid-row-height: dynamic($grid-row-cell-line-height + vertical($grid-cell-inner-padding));\r
343// private\r
344$grid-row-border-color: top($grid-row-cell-border-color);\r
345// private\r
346$grid-col-border-color: right($grid-row-cell-border-color);\r