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/dark.css CHANGED
@@ -1,4 +1,17 @@
1
1
  .flexlayout__layout {
2
+ --color-text: white;
3
+ --color-background: black;
4
+ --color-base: black;
5
+ --color-1: #121212;
6
+ --color-2: #1a1a1a;
7
+ --color-3: #262626;
8
+ --color-4: #333333;
9
+ --color-5: #404040;
10
+ --color-6: #4d4d4d;
11
+ --color-drag1: #cfe8ff;
12
+ --color-drag2: #b7d1b5;
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: #1a1a1a;
23
+ background-color: var(--color-2);
11
24
  }
12
25
  @media (hover: hover) {
13
26
  .flexlayout__splitter:hover {
14
- background-color: #333333;
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 {
@@ -20,20 +35,23 @@
20
35
  .flexlayout__splitter_drag {
21
36
  z-index: 1000;
22
37
  border-radius: 5px;
23
- background-color: #404040;
38
+ background-color: var(--color-5);
39
+ }
40
+ .flexlayout__splitter_extra {
41
+ background-color: transparent;
24
42
  }
25
43
  .flexlayout__outline_rect {
26
44
  position: absolute;
27
- cursor: move;
45
+ pointer-events: none;
28
46
  box-sizing: border-box;
29
- border: 2px solid #cfe8ff;
47
+ border: 2px solid var(--color-drag1);
30
48
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.2);
31
49
  border-radius: 5px;
32
50
  z-index: 1000;
33
51
  }
34
52
  .flexlayout__outline_rect_edge {
35
- cursor: move;
36
- border: 2px solid #b7d1b5;
53
+ pointer-events: none;
54
+ border: 2px solid var(--color-drag2);
37
55
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.2);
38
56
  border-radius: 5px;
39
57
  z-index: 1000;
@@ -44,13 +62,14 @@
44
62
  z-index: 1000;
45
63
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
46
64
  background-color: gray;
65
+ pointer-events: none;
47
66
  }
48
67
  .flexlayout__drag_rect {
49
68
  position: absolute;
50
69
  cursor: move;
51
- color: white;
52
- background-color: #121212;
53
- border: 2px solid #333333;
70
+ color: var(--color-text);
71
+ background-color: var(--color-1);
72
+ border: 2px solid var(--color-4);
54
73
  box-shadow: inset 0 0 60px rgba(0, 0, 0, 0.3);
55
74
  border-radius: 5px;
56
75
  z-index: 1000;
@@ -63,16 +82,16 @@
63
82
  overflow: hidden;
64
83
  padding: 10px;
65
84
  word-wrap: break-word;
66
- font-size: medium;
67
- font-family: Roboto, Arial, sans-serif;
85
+ font-size: var(--font-size);
86
+ font-family: var(--font-family);
68
87
  }
69
88
  .flexlayout__tabset {
70
89
  overflow: hidden;
71
- background-color: #121212;
90
+ background-color: var(--color-1);
72
91
  box-sizing: border-box;
73
- font-size: medium;
74
- font-family: Roboto, Arial, sans-serif;
75
- background-color: #121212;
92
+ font-size: var(--font-size);
93
+ font-family: var(--font-family);
94
+ background-color: var(--color-1);
76
95
  }
77
96
  .flexlayout__tabset_header {
78
97
  position: absolute;
@@ -82,9 +101,9 @@
82
101
  right: 0;
83
102
  padding: 3px 3px 3px 5px;
84
103
  box-sizing: border-box;
85
- border-bottom: 1px solid #262626;
86
- color: white;
87
- background-color: #121212;
104
+ border-bottom: 1px solid var(--color-3);
105
+ color: var(--color-text);
106
+ background-color: var(--color-1);
88
107
  box-shadow: inset 0 0 3px 0 rgba(136, 136, 136, 0.54);
89
108
  }
90
109
  .flexlayout__tabset_header_content {
@@ -92,19 +111,19 @@
92
111
  }
93
112
  .flexlayout__tabset_tabbar_outer {
94
113
  box-sizing: border-box;
95
- background-color: #121212;
114
+ background-color: var(--color-1);
96
115
  position: absolute;
97
116
  left: 0;
98
117
  right: 0;
99
118
  overflow: hidden;
100
119
  display: flex;
101
- background-color: #121212;
120
+ background-color: var(--color-1);
102
121
  }
103
122
  .flexlayout__tabset_tabbar_outer_top {
104
- border-bottom: 1px solid #262626;
123
+ border-bottom: 1px solid var(--color-3);
105
124
  }
106
125
  .flexlayout__tabset_tabbar_outer_bottom {
107
- border-top: 1px solid #262626;
126
+ border-top: 1px solid var(--color-3);
108
127
  }
109
128
  .flexlayout__tabset_tabbar_inner {
110
129
  position: relative;
@@ -128,17 +147,17 @@
128
147
  border-bottom: 2px solid transparent;
129
148
  }
130
149
  .flexlayout__tabset-selected {
131
- background-image: linear-gradient(black, #333333);
150
+ background-image: linear-gradient(var(--color-background), var(--color-4));
132
151
  }
133
152
  .flexlayout__tabset-maximized {
134
- background-image: linear-gradient(#4d4d4d, #1a1a1a);
153
+ background-image: linear-gradient(var(--color-6), var(--color-2));
135
154
  }
136
155
  .flexlayout__tab {
137
156
  overflow: auto;
138
157
  position: absolute;
139
158
  box-sizing: border-box;
140
- color: white;
141
- background-color: black;
159
+ color: var(--color-text);
160
+ background-color: var(--color-background);
142
161
  }
143
162
  .flexlayout__tab_button {
144
163
  display: inline-flex;
@@ -149,13 +168,13 @@
149
168
  cursor: pointer;
150
169
  }
151
170
  .flexlayout__tab_button--selected {
152
- background-color: #262626;
153
- color: white;
171
+ background-color: var(--color-3);
172
+ color: var(--color-text);
154
173
  }
155
174
  @media (hover: hover) {
156
175
  .flexlayout__tab_button:hover {
157
- background-color: #262626;
158
- color: white;
176
+ background-color: var(--color-3);
177
+ color: var(--color-text);
159
178
  }
160
179
  }
161
180
  .flexlayout__tab_button--unselected {
@@ -179,8 +198,12 @@
179
198
  }
180
199
  .flexlayout__tab_button_textbox {
181
200
  border: none;
182
- color: green;
183
- background-color: #262626;
201
+ font-family: var(--font-family);
202
+ font-size: var(--font-size);
203
+ color: var(--color-text);
204
+ background-color: var(--color-5);
205
+ border: 1px inset var(--color-1);
206
+ border-radius: 3px;
184
207
  }
185
208
  .flexlayout__tab_button_textbox:focus {
186
209
  outline: none;
@@ -232,6 +255,9 @@
232
255
  .flexlayout__tab_toolbar_button-float {
233
256
  background: transparent url("../images/popout.png") no-repeat center;
234
257
  }
258
+ .flexlayout__tab_toolbar_button-close {
259
+ background: transparent url("../images/close.png") no-repeat center;
260
+ }
235
261
  .flexlayout__tab_toolbar_sticky_buttons_container {
236
262
  display: flex;
237
263
  align-items: center;
@@ -240,8 +266,8 @@
240
266
  overflow: auto;
241
267
  position: absolute;
242
268
  box-sizing: border-box;
243
- color: white;
244
- background-color: black;
269
+ color: var(--color-text);
270
+ background-color: var(--color-background);
245
271
  display: flex;
246
272
  justify-content: center;
247
273
  align-items: center;
@@ -264,25 +290,25 @@
264
290
  box-sizing: border-box;
265
291
  overflow: hidden;
266
292
  display: flex;
267
- font-size: medium;
268
- font-family: Roboto, Arial, sans-serif;
269
- background-color: #121212;
293
+ font-size: var(--font-size);
294
+ font-family: var(--font-family);
295
+ background-color: var(--color-1);
270
296
  }
271
297
  .flexlayout__border_top {
272
- border-bottom: 1px solid #262626;
298
+ border-bottom: 1px solid var(--color-3);
273
299
  align-items: center;
274
300
  }
275
301
  .flexlayout__border_bottom {
276
- border-top: 1px solid #262626;
302
+ border-top: 1px solid var(--color-3);
277
303
  align-items: center;
278
304
  }
279
305
  .flexlayout__border_left {
280
- border-right: 1px solid #262626;
306
+ border-right: 1px solid var(--color-3);
281
307
  align-content: center;
282
308
  flex-direction: column;
283
309
  }
284
310
  .flexlayout__border_right {
285
- border-left: 1px solid #262626;
311
+ border-left: 1px solid var(--color-3);
286
312
  align-content: center;
287
313
  flex-direction: column;
288
314
  }
@@ -321,16 +347,16 @@
321
347
  white-space: nowrap;
322
348
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
323
349
  border-radius: 3px;
324
- background-color: #1a1a1a;
350
+ background-color: var(--color-2);
325
351
  }
326
352
  .flexlayout__border_button--selected {
327
- background-color: #262626;
328
- color: white;
353
+ background-color: var(--color-3);
354
+ color: var(--color-text);
329
355
  }
330
356
  @media (hover: hover) {
331
357
  .flexlayout__border_button:hover {
332
- background-color: #262626;
333
- color: white;
358
+ background-color: var(--color-3);
359
+ color: var(--color-text);
334
360
  }
335
361
  }
336
362
  .flexlayout__border_button--unselected {
@@ -396,23 +422,26 @@
396
422
  margin-top: 5px;
397
423
  }
398
424
  .flexlayout__popup_menu {
399
- font-size: medium;
400
- font-family: Roboto, Arial, sans-serif;
425
+ font-size: var(--font-size);
426
+ font-family: var(--font-family);
401
427
  }
402
428
  .flexlayout__popup_menu_item {
429
+ margin: 2px;
403
430
  padding: 2px 10px 2px 10px;
404
431
  white-space: nowrap;
432
+ cursor: pointer;
433
+ border-radius: 2px;
405
434
  }
406
435
  @media (hover: hover) {
407
436
  .flexlayout__popup_menu_item:hover {
408
- background-color: #4d4d4d;
437
+ background-color: var(--color-6);
409
438
  }
410
439
  }
411
440
  .flexlayout__popup_menu_container {
412
441
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
413
- border: 1px solid #4d4d4d;
414
- color: white;
415
- background: black;
442
+ border: 1px solid var(--color-6);
443
+ color: var(--color-text);
444
+ background: var(--color-background);
416
445
  border-radius: 3px;
417
446
  position: absolute;
418
447
  z-index: 1000;
@@ -438,8 +467,8 @@
438
467
  bottom: 0;
439
468
  position: absolute;
440
469
  box-sizing: border-box;
441
- background-color: black;
442
- color: white;
470
+ background-color: var(--color-background);
471
+ color: var(--color-text);
443
472
  }
444
473
  .flexlayout__error_boundary_container {
445
474
  left: 0;
@@ -457,20 +486,20 @@
457
486
  .flexlayout__tabset_sizer {
458
487
  padding-top: 5px;
459
488
  padding-bottom: 3px;
460
- font-size: medium;
461
- font-family: Roboto, Arial, sans-serif;
489
+ font-size: var(--font-size);
490
+ font-family: var(--font-family);
462
491
  }
463
492
  .flexlayout__tabset_header_sizer {
464
493
  padding-top: 3px;
465
494
  padding-bottom: 3px;
466
- font-size: medium;
467
- font-family: Roboto, Arial, sans-serif;
495
+ font-size: var(--font-size);
496
+ font-family: var(--font-family);
468
497
  }
469
498
  .flexlayout__border_sizer {
470
499
  padding-top: 6px;
471
500
  padding-bottom: 5px;
472
- font-size: medium;
473
- font-family: Roboto, Arial, sans-serif;
501
+ font-size: var(--font-size);
502
+ font-family: var(--font-family);
474
503
  }
475
504
 
476
505
  /*# sourceMappingURL=dark.css.map */
package/style/dark.css.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sourceRoot":"","sources":["_base.scss","dark.scss"],"names":[],"mappings":"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","file":"dark.css"}
1
+ {"version":3,"sourceRoot":"","sources":["_base.scss","dark.scss"],"names":[],"mappings":"AASI;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAtBJ;EACA;EACA;EACA;EACA;EAqBI;;AAGJ;ECuEA;;ADpEI;EACI;IACI;IACA;ICqEZ;;;ADjEI;EACI;;AAGJ;EACI;ECgER;EACA;;AD9DI;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;ECxFR;EACA;;AD0FQ;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;EC1IJ;;AD8II;EC1IJ;;AD+IA;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;;AAGA;EC1IR;EACA;;AD4IQ;EACI;ICrIZ;IACA;;;ADyIQ;EC9IR;;ADkJQ;ECxKR;EACA;EACA;;AD0KQ;ECtKR;EACA;EACA;;ADwKQ;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;EC1QJ;;AD6QI;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;EClUR;EACA;EACA;;ADmUQ;EC/TR;EACA;;ADiUQ;EACI;IC1TZ;IACA;;;AD8TQ;ECnUR;;ADuUQ;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":"dark.css"}
package/style/dark.scss CHANGED
@@ -14,32 +14,32 @@ $font-size: medium !default;
14
14
  $font-family: Roboto, Arial, sans-serif !default;
15
15
 
16
16
  @mixin tabset_mixin {
17
- background-color: $color_1;
17
+ background-color: var(--color-1);
18
18
  }
19
19
 
20
20
  @mixin tabset_tabbar_mixin {
21
- background-color: $color_1;
21
+ background-color: var(--color-1);
22
22
  }
23
23
 
24
24
  @mixin tabset_header_mixin {
25
- background-color: $color_1;
25
+ background-color: var(--color-1);
26
26
  }
27
27
 
28
28
  @mixin tabset_selected_mixin {
29
- background-image: linear-gradient($color_background, $color_4);
29
+ background-image: linear-gradient(var(--color-background), var(--color-4));
30
30
  }
31
31
 
32
32
  @mixin tabset_header_mixin {
33
- background-color: $color_1;
33
+ background-color: var(--color-1);
34
34
  box-shadow: inset 0 0 3px 0 rgba(136, 136, 136, 0.54);
35
35
  }
36
36
 
37
37
  @mixin tabset_selected_mixin {
38
- background-image: linear-gradient($color_background, $color_4);
38
+ background-image: linear-gradient(var(--color-background), var(--color-4));
39
39
  }
40
40
 
41
41
  @mixin tabset_maximized_mixin {
42
- background-image: linear-gradient($color_6, $color_2);
42
+ background-image: linear-gradient(var(--color-6), var(--color-2));
43
43
  }
44
44
 
45
45
  @mixin tab_top_mixin {
@@ -60,8 +60,8 @@ $font-family: Roboto, Arial, sans-serif !default;
60
60
  }
61
61
 
62
62
  @mixin tab_button_selected_mixin {
63
- background-color: $color_3;
64
- color: $color_text;
63
+ background-color: var(--color-3);
64
+ color: var(--color-text);
65
65
  }
66
66
 
67
67
  @mixin tab_button_unselected_mixin {
@@ -69,23 +69,23 @@ $font-family: Roboto, Arial, sans-serif !default;
69
69
  }
70
70
 
71
71
  @mixin tab_button_hovered_mixin {
72
- background-color: $color_3;
73
- color: $color_text;
72
+ background-color: var(--color-3);
73
+ color: var(--color-text);
74
74
  }
75
75
 
76
76
  @mixin border_mixin {
77
- background-color: $color_1;
77
+ background-color: var(--color-1);
78
78
  }
79
79
 
80
80
  @mixin border_button_mixin {
81
81
  box-shadow: inset 0 0 5px rgba(0, 0, 0, .15);
82
82
  border-radius: 3px;
83
- background-color: $color_2;
83
+ background-color: var(--color-2);
84
84
  }
85
85
 
86
86
  @mixin border_button_selected_mixin {
87
- background-color: $color_3;
88
- color: $color_text;
87
+ background-color: var(--color-3);
88
+ color: var(--color-text);
89
89
  }
90
90
 
91
91
  @mixin border_button_unselected_mixin {
@@ -93,21 +93,21 @@ $font-family: Roboto, Arial, sans-serif !default;
93
93
  }
94
94
 
95
95
  @mixin border_button_hovered_mixin {
96
- background-color: $color_3;
97
- color: $color_text;
96
+ background-color: var(--color-3);
97
+ color: var(--color-text);
98
98
  }
99
99
 
100
100
  @mixin splitter_mixin {
101
- background-color: $color_2;
101
+ background-color: var(--color-2);
102
102
  }
103
103
 
104
104
  @mixin splitter_hover_mixin {
105
- background-color: $color_4;
105
+ background-color: var(--color-4);
106
106
  }
107
107
 
108
108
  @mixin splitter_drag_mixin {
109
109
  border-radius: 5px;
110
- background-color: $color_5;
110
+ background-color: var(--color-5);
111
111
  }
112
112
 
113
113
  @mixin splitter_border_mixin {