flexlayout-react 0.5.15 → 0.5.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (88) hide show
  1. package/ChangeLog.txt +26 -0
  2. package/README.md +121 -97
  3. package/declarations/DragDrop.d.ts +1 -0
  4. package/declarations/I18nLabel.d.ts +1 -0
  5. package/declarations/Rect.d.ts +4 -0
  6. package/declarations/Types.d.ts +9 -1
  7. package/declarations/model/Actions.d.ts +18 -11
  8. package/declarations/model/BorderNode.d.ts +2 -1
  9. package/declarations/model/IJsonModel.d.ts +10 -0
  10. package/declarations/model/Model.d.ts +1 -0
  11. package/declarations/model/TabNode.d.ts +1 -0
  12. package/declarations/model/TabSetNode.d.ts +1 -0
  13. package/declarations/view/Layout.d.ts +20 -6
  14. package/dist/flexlayout.js +20 -20
  15. package/dist/flexlayout_min.js +1 -1
  16. package/lib/DockLocation.js +25 -11
  17. package/lib/DockLocation.js.map +1 -1
  18. package/lib/DragDrop.js +19 -3
  19. package/lib/DragDrop.js.map +1 -1
  20. package/lib/I18nLabel.js +1 -0
  21. package/lib/I18nLabel.js.map +1 -1
  22. package/lib/PopupMenu.js +14 -9
  23. package/lib/PopupMenu.js.map +1 -1
  24. package/lib/Rect.js +3 -0
  25. package/lib/Rect.js.map +1 -1
  26. package/lib/Types.js +8 -0
  27. package/lib/Types.js.map +1 -1
  28. package/lib/model/Actions.js +20 -11
  29. package/lib/model/Actions.js.map +1 -1
  30. package/lib/model/BorderNode.js +61 -14
  31. package/lib/model/BorderNode.js.map +1 -1
  32. package/lib/model/BorderSet.js +33 -19
  33. package/lib/model/BorderSet.js.map +1 -1
  34. package/lib/model/Model.js +39 -1
  35. package/lib/model/Model.js.map +1 -1
  36. package/lib/model/RowNode.js +19 -5
  37. package/lib/model/RowNode.js.map +1 -1
  38. package/lib/model/TabNode.js +14 -0
  39. package/lib/model/TabNode.js.map +1 -1
  40. package/lib/model/TabSetNode.js +42 -19
  41. package/lib/model/TabSetNode.js.map +1 -1
  42. package/lib/view/BorderButton.js +14 -3
  43. package/lib/view/BorderButton.js.map +1 -1
  44. package/lib/view/BorderTabSet.js +15 -4
  45. package/lib/view/BorderTabSet.js.map +1 -1
  46. package/lib/view/Layout.js +206 -45
  47. package/lib/view/Layout.js.map +1 -1
  48. package/lib/view/Splitter.js +34 -3
  49. package/lib/view/Splitter.js.map +1 -1
  50. package/lib/view/TabButton.js +11 -2
  51. package/lib/view/TabButton.js.map +1 -1
  52. package/lib/view/TabFloating.js +23 -11
  53. package/lib/view/TabFloating.js.map +1 -1
  54. package/lib/view/TabSet.js +50 -17
  55. package/lib/view/TabSet.js.map +1 -1
  56. package/package.json +1 -1
  57. package/src/DockLocation.ts +30 -9
  58. package/src/DragDrop.ts +26 -3
  59. package/src/I18nLabel.ts +1 -0
  60. package/src/PopupMenu.tsx +28 -10
  61. package/src/Rect.ts +6 -2
  62. package/src/Types.ts +9 -0
  63. package/src/model/Actions.ts +21 -11
  64. package/src/model/BorderNode.ts +57 -15
  65. package/src/model/BorderSet.ts +32 -19
  66. package/src/model/IJsonModel.ts +10 -0
  67. package/src/model/Model.ts +43 -1
  68. package/src/model/RowNode.ts +8 -5
  69. package/src/model/TabNode.ts +16 -0
  70. package/src/model/TabSetNode.ts +43 -19
  71. package/src/view/BorderButton.tsx +22 -3
  72. package/src/view/BorderTabSet.tsx +21 -4
  73. package/src/view/Layout.tsx +263 -70
  74. package/src/view/Splitter.tsx +49 -3
  75. package/src/view/TabButton.tsx +17 -1
  76. package/src/view/TabFloating.tsx +36 -19
  77. package/src/view/TabSet.tsx +76 -16
  78. package/style/_base.scss +75 -44
  79. package/style/dark.css +90 -61
  80. package/style/dark.css.map +1 -1
  81. package/style/dark.scss +20 -20
  82. package/style/gray.css +90 -61
  83. package/style/gray.css.map +1 -1
  84. package/style/gray.scss +20 -20
  85. package/style/light.css +90 -61
  86. package/style/light.css.map +1 -1
  87. package/style/light.scss +18 -18
  88. package/yarn-error.log +0 -11828
package/style/light.css CHANGED
@@ -1,4 +1,17 @@
1
1
  .flexlayout__layout {
2
+ --color-text: black;
3
+ --color-background: white;
4
+ --color-base: white;
5
+ --color-1: #f7f7f7;
6
+ --color-2: #f0f0f0;
7
+ --color-3: #e9e9e9;
8
+ --color-4: #e2e2e2;
9
+ --color-5: #dbdbdb;
10
+ --color-6: #d4d4d4;
11
+ --color-drag1: red;
12
+ --color-drag2: green;
13
+ --font-size: medium;
14
+ --font-family: Roboto, Arial, sans-serif;
2
15
  left: 0;
3
16
  top: 0;
4
17
  right: 0;
@@ -7,11 +20,13 @@
7
20
  overflow: hidden;
8
21
  }
9
22
  .flexlayout__splitter {
10
- background-color: #f7f7f7;
23
+ background-color: var(--color-1);
11
24
  }
12
25
  @media (hover: hover) {
13
26
  .flexlayout__splitter:hover {
14
- background-color: #e2e2e2;
27
+ transition: background-color ease-in 0.1s;
28
+ transition-delay: 0.05s;
29
+ background-color: var(--color-4);
15
30
  }
16
31
  }
17
32
  .flexlayout__splitter_border {
@@ -19,20 +34,23 @@
19
34
  }
20
35
  .flexlayout__splitter_drag {
21
36
  z-index: 1000;
22
- background-color: #e2e2e2;
37
+ background-color: var(--color-4);
38
+ }
39
+ .flexlayout__splitter_extra {
40
+ background-color: transparent;
23
41
  }
24
42
  .flexlayout__outline_rect {
25
43
  position: absolute;
26
- cursor: move;
44
+ pointer-events: none;
27
45
  box-sizing: border-box;
28
- border: 2px solid red;
46
+ border: 2px solid var(--color-drag1);
29
47
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.2);
30
48
  border-radius: 5px;
31
49
  z-index: 1000;
32
50
  }
33
51
  .flexlayout__outline_rect_edge {
34
- cursor: move;
35
- border: 2px solid green;
52
+ pointer-events: none;
53
+ border: 2px solid var(--color-drag2);
36
54
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.2);
37
55
  border-radius: 5px;
38
56
  z-index: 1000;
@@ -43,13 +61,14 @@
43
61
  z-index: 1000;
44
62
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
45
63
  background-color: gray;
64
+ pointer-events: none;
46
65
  }
47
66
  .flexlayout__drag_rect {
48
67
  position: absolute;
49
68
  cursor: move;
50
- color: black;
51
- background-color: #f7f7f7;
52
- border: 2px solid #e2e2e2;
69
+ color: var(--color-text);
70
+ background-color: var(--color-1);
71
+ border: 2px solid var(--color-4);
53
72
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.3);
54
73
  border-radius: 5px;
55
74
  z-index: 1000;
@@ -62,16 +81,16 @@
62
81
  overflow: hidden;
63
82
  padding: 10px;
64
83
  word-wrap: break-word;
65
- font-size: medium;
66
- font-family: Roboto, Arial, sans-serif;
84
+ font-size: var(--font-size);
85
+ font-family: var(--font-family);
67
86
  }
68
87
  .flexlayout__tabset {
69
88
  overflow: hidden;
70
- background-color: #f7f7f7;
89
+ background-color: var(--color-1);
71
90
  box-sizing: border-box;
72
- font-size: medium;
73
- font-family: Roboto, Arial, sans-serif;
74
- background-color: white;
91
+ font-size: var(--font-size);
92
+ font-family: var(--font-family);
93
+ background-color: var(--color-background);
75
94
  }
76
95
  .flexlayout__tabset_header {
77
96
  position: absolute;
@@ -81,28 +100,28 @@
81
100
  right: 0;
82
101
  padding: 3px 3px 3px 5px;
83
102
  box-sizing: border-box;
84
- border-bottom: 1px solid #e9e9e9;
85
- color: black;
86
- background-color: white;
103
+ border-bottom: 1px solid var(--color-3);
104
+ color: var(--color-text);
105
+ background-color: var(--color-background);
87
106
  }
88
107
  .flexlayout__tabset_header_content {
89
108
  flex-grow: 1;
90
109
  }
91
110
  .flexlayout__tabset_tabbar_outer {
92
111
  box-sizing: border-box;
93
- background-color: #f7f7f7;
112
+ background-color: var(--color-1);
94
113
  position: absolute;
95
114
  left: 0;
96
115
  right: 0;
97
116
  overflow: hidden;
98
117
  display: flex;
99
- background-color: white;
118
+ background-color: var(--color-background);
100
119
  }
101
120
  .flexlayout__tabset_tabbar_outer_top {
102
- border-bottom: 1px solid #e9e9e9;
121
+ border-bottom: 1px solid var(--color-3);
103
122
  }
104
123
  .flexlayout__tabset_tabbar_outer_bottom {
105
- border-top: 1px solid #e9e9e9;
124
+ border-top: 1px solid var(--color-3);
106
125
  }
107
126
  .flexlayout__tabset_tabbar_inner {
108
127
  position: relative;
@@ -126,17 +145,17 @@
126
145
  border-bottom: 2px solid transparent;
127
146
  }
128
147
  .flexlayout__tabset-selected {
129
- background-color: #f7f7f7;
148
+ background-color: var(--color-1);
130
149
  }
131
150
  .flexlayout__tabset-maximized {
132
- background-color: #d4d4d4;
151
+ background-color: var(--color-6);
133
152
  }
134
153
  .flexlayout__tab {
135
154
  overflow: auto;
136
155
  position: absolute;
137
156
  box-sizing: border-box;
138
- color: black;
139
- background-color: white;
157
+ color: var(--color-text);
158
+ background-color: var(--color-background);
140
159
  }
141
160
  .flexlayout__tab_button {
142
161
  display: inline-flex;
@@ -147,13 +166,13 @@
147
166
  cursor: pointer;
148
167
  }
149
168
  .flexlayout__tab_button--selected {
150
- background-color: #e9e9e9;
151
- color: black;
169
+ background-color: var(--color-3);
170
+ color: var(--color-text);
152
171
  }
153
172
  @media (hover: hover) {
154
173
  .flexlayout__tab_button:hover {
155
- background-color: #e9e9e9;
156
- color: black;
174
+ background-color: var(--color-3);
175
+ color: var(--color-text);
157
176
  }
158
177
  }
159
178
  .flexlayout__tab_button--unselected {
@@ -167,8 +186,12 @@
167
186
  }
168
187
  .flexlayout__tab_button_textbox {
169
188
  border: none;
170
- color: green;
171
- background-color: #e9e9e9;
189
+ font-family: var(--font-family);
190
+ font-size: var(--font-size);
191
+ color: var(--color-text);
192
+ background-color: var(--color-5);
193
+ border: 1px inset var(--color-1);
194
+ border-radius: 3px;
172
195
  }
173
196
  .flexlayout__tab_button_textbox:focus {
174
197
  outline: none;
@@ -220,6 +243,9 @@
220
243
  .flexlayout__tab_toolbar_button-float {
221
244
  background: transparent url("../images/popout.png") no-repeat center;
222
245
  }
246
+ .flexlayout__tab_toolbar_button-close {
247
+ background: transparent url("../images/close.png") no-repeat center;
248
+ }
223
249
  .flexlayout__tab_toolbar_sticky_buttons_container {
224
250
  display: flex;
225
251
  align-items: center;
@@ -228,8 +254,8 @@
228
254
  overflow: auto;
229
255
  position: absolute;
230
256
  box-sizing: border-box;
231
- color: black;
232
- background-color: white;
257
+ color: var(--color-text);
258
+ background-color: var(--color-background);
233
259
  display: flex;
234
260
  justify-content: center;
235
261
  align-items: center;
@@ -252,25 +278,25 @@
252
278
  box-sizing: border-box;
253
279
  overflow: hidden;
254
280
  display: flex;
255
- font-size: medium;
256
- font-family: Roboto, Arial, sans-serif;
257
- background-color: white;
281
+ font-size: var(--font-size);
282
+ font-family: var(--font-family);
283
+ background-color: var(--color-background);
258
284
  }
259
285
  .flexlayout__border_top {
260
- border-bottom: 1px solid #e9e9e9;
286
+ border-bottom: 1px solid var(--color-3);
261
287
  align-items: center;
262
288
  }
263
289
  .flexlayout__border_bottom {
264
- border-top: 1px solid #e9e9e9;
290
+ border-top: 1px solid var(--color-3);
265
291
  align-items: center;
266
292
  }
267
293
  .flexlayout__border_left {
268
- border-right: 1px solid #e9e9e9;
294
+ border-right: 1px solid var(--color-3);
269
295
  align-content: center;
270
296
  flex-direction: column;
271
297
  }
272
298
  .flexlayout__border_right {
273
- border-left: 1px solid #e9e9e9;
299
+ border-left: 1px solid var(--color-3);
274
300
  align-content: center;
275
301
  flex-direction: column;
276
302
  }
@@ -307,16 +333,16 @@
307
333
  margin: 2px;
308
334
  box-sizing: border-box;
309
335
  white-space: nowrap;
310
- background-color: #f0f0f0;
336
+ background-color: var(--color-2);
311
337
  }
312
338
  .flexlayout__border_button--selected {
313
- background-color: #e9e9e9;
314
- color: black;
339
+ background-color: var(--color-3);
340
+ color: var(--color-text);
315
341
  }
316
342
  @media (hover: hover) {
317
343
  .flexlayout__border_button:hover {
318
- background-color: #e9e9e9;
319
- color: black;
344
+ background-color: var(--color-3);
345
+ color: var(--color-text);
320
346
  }
321
347
  }
322
348
  .flexlayout__border_button--unselected {
@@ -382,23 +408,26 @@
382
408
  margin-top: 5px;
383
409
  }
384
410
  .flexlayout__popup_menu {
385
- font-size: medium;
386
- font-family: Roboto, Arial, sans-serif;
411
+ font-size: var(--font-size);
412
+ font-family: var(--font-family);
387
413
  }
388
414
  .flexlayout__popup_menu_item {
415
+ margin: 2px;
389
416
  padding: 2px 10px 2px 10px;
390
417
  white-space: nowrap;
418
+ cursor: pointer;
419
+ border-radius: 2px;
391
420
  }
392
421
  @media (hover: hover) {
393
422
  .flexlayout__popup_menu_item:hover {
394
- background-color: #d4d4d4;
423
+ background-color: var(--color-6);
395
424
  }
396
425
  }
397
426
  .flexlayout__popup_menu_container {
398
427
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
399
- border: 1px solid #d4d4d4;
400
- color: black;
401
- background: white;
428
+ border: 1px solid var(--color-6);
429
+ color: var(--color-text);
430
+ background: var(--color-background);
402
431
  border-radius: 3px;
403
432
  position: absolute;
404
433
  z-index: 1000;
@@ -424,8 +453,8 @@
424
453
  bottom: 0;
425
454
  position: absolute;
426
455
  box-sizing: border-box;
427
- background-color: white;
428
- color: black;
456
+ background-color: var(--color-background);
457
+ color: var(--color-text);
429
458
  }
430
459
  .flexlayout__error_boundary_container {
431
460
  left: 0;
@@ -443,20 +472,20 @@
443
472
  .flexlayout__tabset_sizer {
444
473
  padding-top: 5px;
445
474
  padding-bottom: 3px;
446
- font-size: medium;
447
- font-family: Roboto, Arial, sans-serif;
475
+ font-size: var(--font-size);
476
+ font-family: var(--font-family);
448
477
  }
449
478
  .flexlayout__tabset_header_sizer {
450
479
  padding-top: 3px;
451
480
  padding-bottom: 3px;
452
- font-size: medium;
453
- font-family: Roboto, Arial, sans-serif;
481
+ font-size: var(--font-size);
482
+ font-family: var(--font-family);
454
483
  }
455
484
  .flexlayout__border_sizer {
456
485
  padding-top: 6px;
457
486
  padding-bottom: 5px;
458
- font-size: medium;
459
- font-family: Roboto, Arial, sans-serif;
487
+ font-size: var(--font-size);
488
+ font-family: var(--font-family);
460
489
  }
461
490
 
462
491
  /*# sourceMappingURL=light.css.map */
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["_base.scss","light.scss"],"names":[],"mappings":"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","file":"light.css"}
1
+ {"version":3,"sourceRoot":"","sources":["_base.scss","light.scss"],"names":[],"mappings":"AASI;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAtBJ;EACA;EACA;EACA;EACA;EAqBI;;AAGJ;ECoDA;;ADjDI;EACI;IACI;IACA;ICkDZ;;;AD9CI;EACI;;AAGJ;EACI;EC6CR;;AD1CI;EACI;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EC3FJ;;AD8FI;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EChGR;;ADmGQ;EACI;;AAKJ;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;ECrHZ;;ADyHQ;EACI;;AAGJ;EACI;;AAGJ;EAEI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEJ;EACI;;AAMhB;ECnJJ;;ADuJI;ECnJJ;;ADwJA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAGA;EC3JR;EACA;;AD6JQ;EACI;ICtJZ;IACA;;;AD0JQ;EC/JR;;AD2KQ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAEJ;EACI;IACI;IACA;;;AAGR;EACI;IACI;;;AAIR;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAGJ;EACI;;AAIR;EACI;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;;AAKZ;EACI;EACA;EACA;EACA;EACA;EC3RJ;;AD8RI;EACI;EACA;;AAGJ;EACI;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;;AAEJ;EACI;EACA;EACA;;AAKZ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;ECnVR;;ADsVQ;EClVR;EACA;;ADoVQ;EACI;IC7UZ;IACA;;;ADiVQ;ECtVR;;AD0VQ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;IACI;IACA;;;AAIR;EACI;IACI;;;AAIR;EACI;;AAIR;EACI;EACA;;AAEA;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;;AAEA;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAGJ;EAEI;;AAGJ;EAEI;EACA;;AAMhB;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;IACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKJ;EACI;;AAGJ;EAnhBJ;EACA;EACA;EACA;EACA;;AAmhBI;EACI;EAxhBR;EACA;EACA;EACA;EACA;EAuhBQ;EACA;EACA;;AAIR;EAjiBA;EACA;EACA;EACA;EACA;EA+hBI;EACA;;AAEJ;EACI;EACA;;AAOJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA","file":"light.css"}
package/style/light.scss CHANGED
@@ -14,23 +14,23 @@ $font-size: medium !default;
14
14
  $font-family: Roboto, Arial, sans-serif !default;
15
15
 
16
16
  @mixin tabset_mixin {
17
- background-color: $color_background;
17
+ background-color: var(--color-background);
18
18
  }
19
19
 
20
20
  @mixin tabset_tabbar_mixin {
21
- background-color: $color_background;
21
+ background-color: var(--color-background);
22
22
  }
23
23
 
24
24
  @mixin tabset_header_mixin {
25
- background-color: $color_background;
25
+ background-color: var(--color-background);
26
26
  }
27
27
 
28
28
  @mixin tabset_selected_mixin {
29
- background-color: $color_1;
29
+ background-color: var(--color-1);
30
30
  }
31
31
 
32
32
  @mixin tabset_maximized_mixin {
33
- background-color: $color_6;
33
+ background-color: var(--color-6);
34
34
  }
35
35
 
36
36
  @mixin tab_top_mixin {
@@ -43,8 +43,8 @@ $font-family: Roboto, Arial, sans-serif !default;
43
43
  }
44
44
 
45
45
  @mixin tab_button_selected_mixin {
46
- background-color: $color_3;
47
- color: $color_text;
46
+ background-color: var(--color-3);
47
+ color: var(--color-text);
48
48
  }
49
49
 
50
50
  @mixin tab_button_unselected_mixin {
@@ -52,21 +52,21 @@ $font-family: Roboto, Arial, sans-serif !default;
52
52
  }
53
53
 
54
54
  @mixin tab_button_hovered_mixin {
55
- background-color: $color_3;
56
- color: $color_text;
55
+ background-color: var(--color-3);
56
+ color: var(--color-text);
57
57
  }
58
58
 
59
59
  @mixin border_mixin {
60
- background-color: $color_background;
60
+ background-color: var(--color-background);
61
61
  }
62
62
 
63
63
  @mixin border_button_mixin {
64
- background-color: $color_2;
64
+ background-color: var(--color-2);
65
65
  }
66
66
 
67
67
  @mixin border_button_selected_mixin {
68
- background-color: $color_3;
69
- color: $color_text;
68
+ background-color: var(--color-3);
69
+ color: var(--color-text);
70
70
  }
71
71
 
72
72
  @mixin border_button_unselected_mixin {
@@ -74,20 +74,20 @@ $font-family: Roboto, Arial, sans-serif !default;
74
74
  }
75
75
 
76
76
  @mixin border_button_hovered_mixin {
77
- background-color: $color_3;
78
- color: $color_text;
77
+ background-color: var(--color-3);
78
+ color: var(--color-text);
79
79
  }
80
80
 
81
81
  @mixin splitter_mixin {
82
- background-color: $color_1;
82
+ background-color: var(--color-1);
83
83
  }
84
84
 
85
85
  @mixin splitter_hover_mixin {
86
- background-color: $color_4;
86
+ background-color: var(--color-4);
87
87
  }
88
88
 
89
89
  @mixin splitter_drag_mixin {
90
- background-color: $color_4;
90
+ background-color: var(--color-4);
91
91
  }
92
92
 
93
93
  @mixin splitter_border_mixin {