flexlayout-react 0.8.6 → 0.8.8

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 (38) hide show
  1. package/ChangeLog.txt +9 -0
  2. package/README.md +49 -0
  3. package/declarations/Rect.d.ts +2 -0
  4. package/declarations/view/Layout.d.ts +1 -1
  5. package/dist/flexlayout.js +6 -6
  6. package/dist/flexlayout_min.js +1 -1
  7. package/lib/Rect.js +6 -0
  8. package/lib/Rect.js.map +1 -1
  9. package/lib/view/BorderTabSet.js +5 -6
  10. package/lib/view/BorderTabSet.js.map +1 -1
  11. package/lib/view/Layout.js +1 -1
  12. package/lib/view/PopupMenu.js +14 -1
  13. package/lib/view/PopupMenu.js.map +1 -1
  14. package/lib/view/TabOverflowHook.js +55 -52
  15. package/lib/view/TabOverflowHook.js.map +1 -1
  16. package/lib/view/TabSet.js +4 -4
  17. package/lib/view/TabSet.js.map +1 -1
  18. package/package.json +1 -2
  19. package/src/Rect.ts +8 -0
  20. package/src/view/BorderTabSet.tsx +5 -6
  21. package/src/view/Layout.tsx +1 -1
  22. package/src/view/PopupMenu.tsx +18 -0
  23. package/src/view/TabOverflowHook.tsx +63 -60
  24. package/src/view/TabSet.tsx +4 -4
  25. package/style/_base.scss +1 -0
  26. package/style/_themes.scss +3 -6
  27. package/style/combined.css +4 -6
  28. package/style/combined.css.map +1 -1
  29. package/style/dark.css +705 -704
  30. package/style/dark.css.map +1 -1
  31. package/style/gray.css +708 -707
  32. package/style/gray.css.map +1 -1
  33. package/style/light.css +682 -681
  34. package/style/light.css.map +1 -1
  35. package/style/rounded.css +4 -6
  36. package/style/rounded.css.map +1 -1
  37. package/style/underline.css +711 -710
  38. package/style/underline.css.map +1 -1
package/style/dark.css CHANGED
@@ -1,704 +1,705 @@
1
- .flexlayout__layout {
2
- --color-text: #eeeeee;
3
- --color-background: black;
4
- --color-base: black;
5
- --color-1: rgb(17.85, 17.85, 17.85);
6
- --color-2: rgb(25.5, 25.5, 25.5);
7
- --color-3: rgb(38.25, 38.25, 38.25);
8
- --color-4: #333333;
9
- --color-5: rgb(63.75, 63.75, 63.75);
10
- --color-6: rgb(76.5, 76.5, 76.5);
11
- --color-drag1: rgb(207, 232, 255);
12
- --color-drag2: rgb(183, 209, 181);
13
- --color-drag1-background: rgba(128, 128, 128, 0.15);
14
- --color-drag2-background: rgba(128, 128, 128, 0.15);
15
- --font-size: medium;
16
- --font-family: Roboto, Arial, sans-serif;
17
- --color-overflow: gray;
18
- --color-icon: gray;
19
- --color-tabset-background: var(--color-1);
20
- --color-tabset-background-selected: var(--color-1);
21
- --color-tabset-background-maximized: var(--color-6);
22
- --color-tabset-divider-line: var(--color-4);
23
- --color-tabset-header-background: var(--color-1);
24
- --color-tabset-header: var(--color-text);
25
- --color-border-tab-content: var(--color-background);
26
- --color-border-background: var(--color-1);
27
- --color-border-divider-line: var(--color-4);
28
- --color-tab-content: var(--color-background);
29
- --color-tab-selected: var(--color-text);
30
- --color-tab-selected-background: var(--color-4);
31
- --color-tab-unselected: gray;
32
- --color-tab-unselected-background: transparent;
33
- --color-tab-textbox: var(--color-text);
34
- --color-tab-textbox-background: var(--color-3);
35
- --color-border-tab-selected: var(--color-text);
36
- --color-border-tab-selected-background: var(--color-4);
37
- --color-border-tab-unselected: gray;
38
- --color-border-tab-unselected-background: var(--color-2);
39
- --color-splitter: var(--color-2);
40
- --color-splitter-hover: var(--color-4);
41
- --color-splitter-drag: var(--color-5);
42
- --color-drag-rect-border: var(--color-4);
43
- --color-drag-rect-background: var(--color-1);
44
- --color-drag-rect: var(--color-text);
45
- --color-popup-border: var(--color-6);
46
- --color-popup-unselected: var(--color-text);
47
- --color-popup-unselected-background: var(--color-background);
48
- --color-popup-selected: var(--color-text);
49
- --color-popup-selected-background: var(--color-4);
50
- --color-edge-marker: gray;
51
- --color-edge-icon: #eee;
52
- --color-mini-scroll-indicator: rgba(128, 128, 128, 0.5);
53
- --color-mini-scroll-indicator-hovered: rgba(128, 128, 128, 0.8);
54
- --size-mini-scroll-indicator: 3px;
55
- --color-toolbar-button-hover: var(--color-4);
56
- }
57
-
58
- /*
59
- base classes
60
- */
61
- .flexlayout__layout {
62
- left: 0;
63
- top: 0;
64
- right: 0;
65
- bottom: 0;
66
- position: absolute;
67
- display: flex;
68
- background-color: var(--color-background);
69
- }
70
- .flexlayout__layout_overlay {
71
- left: 0;
72
- top: 0;
73
- right: 0;
74
- bottom: 0;
75
- position: absolute;
76
- z-index: 1000;
77
- }
78
- .flexlayout__layout_tab_stamps {
79
- position: absolute;
80
- top: -10000px;
81
- z-index: 100;
82
- display: flex;
83
- flex-direction: column;
84
- align-items: start;
85
- }
86
- .flexlayout__layout_moveables {
87
- visibility: hidden;
88
- position: absolute;
89
- width: 100px;
90
- height: 100px;
91
- top: -20000px;
92
- }
93
- .flexlayout__layout_main {
94
- display: flex;
95
- flex-basis: 0px;
96
- min-width: 0;
97
- min-height: 0;
98
- flex-grow: 1;
99
- position: relative;
100
- }
101
- .flexlayout__layout_border_container {
102
- display: flex;
103
- flex-basis: 0px;
104
- min-width: 0;
105
- min-height: 0;
106
- flex-grow: 1;
107
- }
108
- .flexlayout__layout_border_container_inner {
109
- display: flex;
110
- flex-basis: 0px;
111
- min-width: 0;
112
- min-height: 0;
113
- flex-grow: 1;
114
- }
115
- .flexlayout__splitter {
116
- display: flex;
117
- align-items: center;
118
- justify-content: center;
119
- background-color: var(--color-splitter);
120
- touch-action: none;
121
- z-index: 10;
122
- }
123
- @media (hover: hover) {
124
- .flexlayout__splitter:hover {
125
- background-color: var(--color-splitter-hover);
126
- transition: background-color ease-in 0.1s;
127
- transition-delay: 0.05s;
128
- }
129
- }
130
- .flexlayout__splitter_drag {
131
- position: absolute;
132
- display: flex;
133
- align-items: center;
134
- justify-content: center;
135
- z-index: 1000;
136
- border-radius: 5px;
137
- background-color: var(--color-splitter-drag);
138
- }
139
- .flexlayout__splitter_handle {
140
- background-color: #ccc;
141
- border-radius: 3px;
142
- }
143
- .flexlayout__splitter_handle_horz {
144
- width: 3px;
145
- height: 30px;
146
- }
147
- .flexlayout__splitter_handle_vert {
148
- width: 30px;
149
- height: 3px;
150
- }
151
- .flexlayout__splitter_extra {
152
- touch-action: none;
153
- background-color: transparent;
154
- }
155
- .flexlayout__outline_rect {
156
- position: absolute;
157
- pointer-events: none;
158
- box-sizing: border-box;
159
- border: 2px solid var(--color-drag1);
160
- background: var(--color-drag1-background);
161
- border-radius: 5px;
162
- z-index: 1000;
163
- }
164
- .flexlayout__outline_rect_edge {
165
- pointer-events: none;
166
- border: 2px solid var(--color-drag2);
167
- background: var(--color-drag2-background);
168
- border-radius: 5px;
169
- z-index: 1000;
170
- box-sizing: border-box;
171
- }
172
- .flexlayout__edge_rect {
173
- position: absolute;
174
- z-index: 1000;
175
- background-color: var(--color-edge-marker);
176
- pointer-events: none;
177
- display: flex;
178
- align-items: center;
179
- justify-content: center;
180
- }
181
- .flexlayout__drag_rect {
182
- color: var(--color-drag-rect);
183
- background-color: var(--color-drag-rect-background);
184
- border: 2px solid var(--color-drag-rect-border);
185
- border-radius: 5px;
186
- box-sizing: border-box;
187
- display: flex;
188
- justify-content: center;
189
- flex-direction: column;
190
- overflow: hidden;
191
- padding: 0.3em 0.8em;
192
- word-wrap: break-word;
193
- font-size: var(--font-size);
194
- font-family: var(--font-family);
195
- }
196
- .flexlayout__row {
197
- display: flex;
198
- flex-basis: 0px;
199
- min-width: 0;
200
- min-height: 0;
201
- position: relative;
202
- box-sizing: border-box;
203
- overflow: hidden;
204
- }
205
- .flexlayout__tabset {
206
- display: flex;
207
- flex-direction: column;
208
- position: relative;
209
- background-color: var(--color-tabset-background);
210
- box-sizing: border-box;
211
- font-family: var(--font-family);
212
- overflow: hidden;
213
- flex-grow: 1;
214
- }
215
- .flexlayout__tabset_container {
216
- display: flex;
217
- flex-basis: 0px;
218
- min-width: 0;
219
- min-height: 0;
220
- flex-direction: column;
221
- overflow: hidden;
222
- flex-grow: 1;
223
- }
224
- .flexlayout__tabset_tab_divider {
225
- width: 4px;
226
- }
227
- .flexlayout__tabset_content {
228
- display: flex;
229
- flex-basis: 0px;
230
- min-width: 0;
231
- min-height: 0;
232
- flex-grow: 1;
233
- box-sizing: border-box;
234
- position: relative;
235
- }
236
- .flexlayout__tabset_header {
237
- display: flex;
238
- align-items: center;
239
- padding: 3px 3px 3px 5px;
240
- box-sizing: border-box;
241
- border-bottom: 1px solid var(--color-tabset-divider-line);
242
- color: var(--color-tabset-header);
243
- background-color: var(--color-tabset-header-background);
244
- font-size: var(--font-size);
245
- }
246
- .flexlayout__tabset_header_content {
247
- flex-grow: 1;
248
- }
249
- .flexlayout__tabset_tabbar_outer {
250
- box-sizing: border-box;
251
- background-color: var(--color-tabset-background);
252
- overflow: hidden;
253
- display: flex;
254
- font-size: var(--font-size);
255
- }
256
- .flexlayout__tabset_tabbar_outer_top {
257
- padding: 0px 2px 0px 2px;
258
- border-bottom: 1px solid var(--color-tabset-divider-line);
259
- }
260
- .flexlayout__tabset_tabbar_outer_bottom {
261
- padding: 0px 2px 0px 2px;
262
- border-top: 1px solid var(--color-tabset-divider-line);
263
- }
264
- .flexlayout__tabset_tabbar_inner {
265
- position: relative;
266
- box-sizing: border-box;
267
- display: flex;
268
- flex-grow: 1;
269
- scrollbar-width: none;
270
- }
271
- .flexlayout__tabset_tabbar_inner::-webkit-scrollbar {
272
- display: none;
273
- }
274
- .flexlayout__tabset_tabbar_inner_tab_container {
275
- position: relative;
276
- display: flex;
277
- padding-left: 4px;
278
- padding-right: 4px;
279
- box-sizing: border-box;
280
- white-space: nowrap;
281
- }
282
- .flexlayout__tabset_tabbar_inner_tab_container_top {
283
- border-top: 2px solid transparent;
284
- }
285
- .flexlayout__tabset_tabbar_inner_tab_container_bottom {
286
- border-bottom: 2px solid transparent;
287
- }
288
- .flexlayout__tabset-selected {
289
- background-color: var(--color-tabset-background-selected);
290
- }
291
- .flexlayout__tabset-maximized {
292
- background-color: var(--color-tabset-background-maximized);
293
- }
294
- .flexlayout__tab_button_stamp {
295
- display: inline-flex;
296
- align-items: center;
297
- gap: 0.3em;
298
- white-space: nowrap;
299
- box-sizing: border-box;
300
- }
301
- .flexlayout__tab {
302
- overflow: hidden;
303
- box-sizing: border-box;
304
- background-color: var(--color-tab-content);
305
- color: var(--color-text);
306
- position: relative;
307
- }
308
- .flexlayout__tab_moveable {
309
- position: relative;
310
- height: 100%;
311
- min-width: 1px;
312
- min-height: 1px;
313
- overflow: auto;
314
- box-sizing: border-box;
315
- }
316
- .flexlayout__tab_overlay {
317
- z-index: 20;
318
- position: absolute;
319
- top: 0;
320
- left: 0;
321
- right: 0;
322
- bottom: 0;
323
- background-color: rgba(0, 0, 0, 0.2392156863);
324
- }
325
- .flexlayout__tab_button {
326
- display: flex;
327
- gap: 0.3em;
328
- align-items: center;
329
- box-sizing: border-box;
330
- padding: 3px 0.5em;
331
- cursor: pointer;
332
- }
333
- .flexlayout__tab_button_stretch {
334
- background-color: transparent;
335
- color: var(--color-tab-selected);
336
- width: 100%;
337
- padding: 3px 0em;
338
- text-wrap: nowrap;
339
- display: flex;
340
- gap: 0.3em;
341
- align-items: center;
342
- box-sizing: border-box;
343
- cursor: pointer;
344
- }
345
- @media (hover: hover) {
346
- .flexlayout__tab_button_stretch:hover {
347
- color: var(--color-tab-selected);
348
- }
349
- }
350
- .flexlayout__tab_button--selected {
351
- background-color: var(--color-tab-selected-background);
352
- color: var(--color-tab-selected);
353
- }
354
- @media (hover: hover) {
355
- .flexlayout__tab_button:hover {
356
- color: var(--color-tab-selected);
357
- }
358
- }
359
- .flexlayout__tab_button--unselected {
360
- background-color: var(--color-tab-unselected-background);
361
- color: var(--color-tab-unselected);
362
- }
363
- .flexlayout__tab_button_leading {
364
- display: flex;
365
- }
366
- .flexlayout__tab_button_content {
367
- display: flex;
368
- text-wrap: nowrap;
369
- }
370
- .flexlayout__tab_button_textbox {
371
- border: none;
372
- font-family: var(--font-family);
373
- font-size: var(--font-size);
374
- color: var(--color-tab-textbox);
375
- background-color: var(--color-tab-textbox-background);
376
- border: 1px inset var(--color-1);
377
- border-radius: 3px;
378
- width: 10em;
379
- }
380
- .flexlayout__tab_button_textbox:focus {
381
- outline: none;
382
- }
383
- .flexlayout__tab_button_trailing {
384
- display: flex;
385
- visibility: hidden;
386
- border-radius: 4px;
387
- }
388
- .flexlayout__tab_button_trailing:hover {
389
- background-color: var(--color-toolbar-button-hover);
390
- }
391
- @media (hover: hover) {
392
- .flexlayout__tab_button:hover .flexlayout__tab_button_trailing {
393
- visibility: visible;
394
- }
395
- }
396
- .flexlayout__tab_button--selected .flexlayout__tab_button_trailing {
397
- visibility: visible;
398
- }
399
- .flexlayout__tab_button_overflow {
400
- display: flex;
401
- align-items: center;
402
- border: none;
403
- color: var(--color-overflow);
404
- font-size: inherit;
405
- background-color: transparent;
406
- width: 2em;
407
- overflow: hidden;
408
- }
409
- .flexlayout__tab_toolbar {
410
- display: flex;
411
- align-items: center;
412
- gap: 0.3em;
413
- padding-left: 0.5em;
414
- padding-right: 0.3em;
415
- }
416
- .flexlayout__tab_toolbar_icon {
417
- border: none;
418
- outline: none;
419
- font-size: inherit;
420
- margin: 0px;
421
- background-color: transparent;
422
- padding: 1px;
423
- }
424
- .flexlayout__tab_toolbar_button {
425
- border: none;
426
- outline: none;
427
- font-size: inherit;
428
- margin: 0px;
429
- background-color: transparent;
430
- border-radius: 4px;
431
- padding: 1px;
432
- }
433
- @media (hover: hover) {
434
- .flexlayout__tab_toolbar_button:hover {
435
- background-color: var(--color-toolbar-button-hover);
436
- }
437
- }
438
- .flexlayout__tab_toolbar_sticky_buttons_container {
439
- display: flex;
440
- gap: 0.3em;
441
- padding-left: 5px;
442
- align-items: center;
443
- }
444
- .flexlayout__border {
445
- box-sizing: border-box;
446
- overflow: hidden;
447
- display: flex;
448
- font-size: var(--font-size);
449
- font-family: var(--font-family);
450
- color: var(--color-border);
451
- background-color: var(--color-border-background);
452
- }
453
- .flexlayout__border_tab_contents {
454
- box-sizing: border-box;
455
- overflow: hidden;
456
- background-color: var(--color-border-tab-content);
457
- }
458
- .flexlayout__border_top {
459
- border-bottom: 1px solid var(--color-border-divider-line);
460
- align-items: center;
461
- }
462
- .flexlayout__border_bottom {
463
- border-top: 1px solid var(--color-border-divider-line);
464
- align-items: center;
465
- }
466
- .flexlayout__border_left {
467
- border-right: 1px solid var(--color-border-divider-line);
468
- align-content: center;
469
- flex-direction: column;
470
- }
471
- .flexlayout__border_right {
472
- border-left: 1px solid var(--color-border-divider-line);
473
- align-content: center;
474
- flex-direction: column;
475
- }
476
- .flexlayout__border_inner {
477
- position: relative;
478
- box-sizing: border-box;
479
- align-items: center;
480
- display: flex;
481
- flex-grow: 1;
482
- scrollbar-width: none;
483
- }
484
- .flexlayout__border_inner::-webkit-scrollbar {
485
- display: none;
486
- }
487
- .flexlayout__border_inner_tab_container {
488
- white-space: nowrap;
489
- display: flex;
490
- padding-left: 2px;
491
- padding-right: 2px;
492
- box-sizing: border-box;
493
- position: absolute;
494
- }
495
- .flexlayout__border_inner_tab_container_right {
496
- transform-origin: top left;
497
- transform: rotate(90deg);
498
- }
499
- .flexlayout__border_inner_tab_container_left {
500
- flex-direction: row-reverse;
501
- transform-origin: top right;
502
- transform: rotate(-90deg);
503
- }
504
- .flexlayout__border_tab_divider {
505
- width: 4px;
506
- }
507
- .flexlayout__border_button {
508
- display: flex;
509
- gap: 0.3em;
510
- align-items: center;
511
- cursor: pointer;
512
- padding: 3px 0.5em;
513
- margin: 2px 0px;
514
- box-sizing: border-box;
515
- white-space: nowrap;
516
- }
517
- .flexlayout__border_button--selected {
518
- background-color: var(--color-border-tab-selected-background);
519
- color: var(--color-border-tab-selected);
520
- }
521
- @media (hover: hover) {
522
- .flexlayout__border_button:hover {
523
- color: var(--color-border-tab-selected);
524
- }
525
- }
526
- .flexlayout__border_button--unselected {
527
- background-color: var(--color-border-tab-unselected-background);
528
- color: var(--color-border-tab-unselected);
529
- }
530
- .flexlayout__border_button_leading {
531
- display: flex;
532
- }
533
- .flexlayout__border_button_content {
534
- display: flex;
535
- }
536
- .flexlayout__border_button_trailing {
537
- display: flex;
538
- border-radius: 4px;
539
- visibility: hidden;
540
- }
541
- @media (hover: hover) {
542
- .flexlayout__border_button:hover .flexlayout__border_button_trailing {
543
- visibility: visible;
544
- }
545
- }
546
- .flexlayout__border_button--selected .flexlayout__border_button_trailing {
547
- visibility: visible;
548
- }
549
- .flexlayout__border_toolbar {
550
- display: flex;
551
- gap: 0.3em;
552
- align-items: center;
553
- }
554
- .flexlayout__border_toolbar_left, .flexlayout__border_toolbar_right {
555
- flex-direction: column;
556
- padding-top: 0.5em;
557
- padding-bottom: 0.3em;
558
- }
559
- .flexlayout__border_toolbar_top, .flexlayout__border_toolbar_bottom {
560
- padding-left: 0.5em;
561
- padding-right: 0.3em;
562
- }
563
- .flexlayout__border_toolbar_button {
564
- border: none;
565
- outline: none;
566
- font-size: inherit;
567
- background-color: transparent;
568
- border-radius: 4px;
569
- padding: 1px;
570
- }
571
- @media (hover: hover) {
572
- .flexlayout__border_toolbar_button:hover {
573
- background-color: var(--color-toolbar-button-hover);
574
- }
575
- }
576
- .flexlayout__border_toolbar_button_overflow {
577
- display: flex;
578
- align-items: center;
579
- border: none;
580
- color: var(--color-overflow);
581
- font-size: inherit;
582
- background-color: transparent;
583
- width: 1.5em;
584
- }
585
- .flexlayout__popup_menu {
586
- font-size: var(--font-size);
587
- font-family: var(--font-family);
588
- }
589
- .flexlayout__popup_menu_item {
590
- padding: 2px 0.5em;
591
- white-space: nowrap;
592
- cursor: pointer;
593
- border-radius: 2px;
594
- }
595
- .flexlayout__popup_menu_item--selected {
596
- font-weight: 500;
597
- background-color: var(--color-tab-selected-background);
598
- color: var(--color-tab-selected);
599
- }
600
- @media (hover: hover) {
601
- .flexlayout__popup_menu_item:hover {
602
- background-color: var(--color-6);
603
- }
604
- }
605
- .flexlayout__popup_menu_container {
606
- box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
607
- border: 1px solid var(--color-popup-border);
608
- color: var(--color-popup-unselected);
609
- background: var(--color-popup-unselected-background);
610
- border-radius: 3px;
611
- position: absolute;
612
- z-index: 1000;
613
- max-height: 50%;
614
- min-width: 100px;
615
- overflow: auto;
616
- padding: 2px;
617
- }
618
- .flexlayout__floating_window _body {
619
- height: 100%;
620
- }
621
- .flexlayout__floating_window_content {
622
- left: 0;
623
- top: 0;
624
- right: 0;
625
- bottom: 0;
626
- position: absolute;
627
- }
628
- .flexlayout__error_boundary_container {
629
- left: 0;
630
- top: 0;
631
- right: 0;
632
- bottom: 0;
633
- position: absolute;
634
- display: flex;
635
- justify-content: center;
636
- }
637
- .flexlayout__error_boundary_content {
638
- display: flex;
639
- align-items: center;
640
- }
641
- .flexlayout__border_sizer {
642
- position: absolute;
643
- top: -30000px;
644
- padding-top: 6px;
645
- padding-bottom: 5px;
646
- font-size: var(--font-size);
647
- font-family: var(--font-family);
648
- }
649
- .flexlayout__mini_scrollbar {
650
- position: absolute;
651
- background-color: var(--color-mini-scroll-indicator);
652
- border-radius: 5px;
653
- width: var(--size-mini-scroll-indicator);
654
- height: var(--size-mini-scroll-indicator);
655
- visibility: hidden;
656
- opacity: 0;
657
- transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
658
- }
659
- .flexlayout__mini_scrollbar:hover {
660
- background-color: var(--color-mini-scroll-indicator-hovered);
661
- transition: background-color 0.3s ease-in-out;
662
- }
663
- .flexlayout__mini_scrollbar_container {
664
- position: relative;
665
- display: flex;
666
- flex-grow: 1;
667
- overflow: hidden;
668
- }
669
- @media (hover: hover) {
670
- .flexlayout__mini_scrollbar_container:hover .flexlayout__mini_scrollbar {
671
- opacity: 1;
672
- visibility: visible;
673
- }
674
- }
675
-
676
- /* ======================== End of Base Classes =========================== */
677
- /*
678
- dark theme overrides
679
- */
680
- .flexlayout__tabset_header {
681
- box-shadow: inset 0 0 3px 0 rgba(136, 136, 136, 0.54);
682
- }
683
- .flexlayout__tabset-selected {
684
- background-image: linear-gradient(var(--color-background), var(--color-4));
685
- }
686
- .flexlayout__tabset-maximized {
687
- background-image: linear-gradient(var(--color-6), var(--color-2));
688
- }
689
- .flexlayout__tab_top {
690
- box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
691
- border-top-left-radius: 3px;
692
- border-top-right-radius: 3px;
693
- }
694
- .flexlayout__tab_bottom {
695
- box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
696
- border-bottom-left-radius: 3px;
697
- border-bottom-right-radius: 3px;
698
- }
699
- .flexlayout__border_button {
700
- box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
701
- border-radius: 3px;
702
- }
703
-
704
- /*# sourceMappingURL=dark.css.map */
1
+ .flexlayout__layout {
2
+ --color-text: #eeeeee;
3
+ --color-background: black;
4
+ --color-base: black;
5
+ --color-1: rgb(17.85, 17.85, 17.85);
6
+ --color-2: rgb(25.5, 25.5, 25.5);
7
+ --color-3: rgb(38.25, 38.25, 38.25);
8
+ --color-4: #333333;
9
+ --color-5: rgb(63.75, 63.75, 63.75);
10
+ --color-6: rgb(76.5, 76.5, 76.5);
11
+ --color-drag1: rgb(207, 232, 255);
12
+ --color-drag2: rgb(183, 209, 181);
13
+ --color-drag1-background: rgba(128, 128, 128, 0.15);
14
+ --color-drag2-background: rgba(128, 128, 128, 0.15);
15
+ --font-size: medium;
16
+ --font-family: Roboto, Arial, sans-serif;
17
+ --color-overflow: gray;
18
+ --color-icon: gray;
19
+ --color-tabset-background: var(--color-1);
20
+ --color-tabset-background-selected: var(--color-1);
21
+ --color-tabset-background-maximized: var(--color-6);
22
+ --color-tabset-divider-line: var(--color-4);
23
+ --color-tabset-header-background: var(--color-1);
24
+ --color-tabset-header: var(--color-text);
25
+ --color-border-tab-content: var(--color-background);
26
+ --color-border-background: var(--color-1);
27
+ --color-border-divider-line: var(--color-4);
28
+ --color-tab-content: var(--color-background);
29
+ --color-tab-selected: var(--color-text);
30
+ --color-tab-selected-background: var(--color-4);
31
+ --color-tab-unselected: gray;
32
+ --color-tab-unselected-background: transparent;
33
+ --color-tab-textbox: var(--color-text);
34
+ --color-tab-textbox-background: var(--color-3);
35
+ --color-border-tab-selected: var(--color-text);
36
+ --color-border-tab-selected-background: var(--color-4);
37
+ --color-border-tab-unselected: gray;
38
+ --color-border-tab-unselected-background: var(--color-2);
39
+ --color-splitter: var(--color-2);
40
+ --color-splitter-hover: var(--color-4);
41
+ --color-splitter-drag: var(--color-5);
42
+ --color-drag-rect-border: var(--color-4);
43
+ --color-drag-rect-background: var(--color-1);
44
+ --color-drag-rect: var(--color-text);
45
+ --color-popup-border: var(--color-6);
46
+ --color-popup-unselected: var(--color-text);
47
+ --color-popup-unselected-background: var(--color-background);
48
+ --color-popup-selected: var(--color-text);
49
+ --color-popup-selected-background: var(--color-4);
50
+ --color-edge-marker: gray;
51
+ --color-edge-icon: #eee;
52
+ --color-mini-scroll-indicator: rgba(128, 128, 128, 0.5);
53
+ --color-mini-scroll-indicator-hovered: rgba(128, 128, 128, 0.8);
54
+ --size-mini-scroll-indicator: 3px;
55
+ --color-toolbar-button-hover: var(--color-4);
56
+ }
57
+
58
+ /*
59
+ base classes
60
+ */
61
+ .flexlayout__layout {
62
+ left: 0;
63
+ top: 0;
64
+ right: 0;
65
+ bottom: 0;
66
+ position: absolute;
67
+ display: flex;
68
+ background-color: var(--color-background);
69
+ }
70
+ .flexlayout__layout_overlay {
71
+ left: 0;
72
+ top: 0;
73
+ right: 0;
74
+ bottom: 0;
75
+ position: absolute;
76
+ z-index: 1000;
77
+ }
78
+ .flexlayout__layout_tab_stamps {
79
+ position: absolute;
80
+ top: -10000px;
81
+ z-index: 100;
82
+ display: flex;
83
+ flex-direction: column;
84
+ align-items: start;
85
+ }
86
+ .flexlayout__layout_moveables {
87
+ visibility: hidden;
88
+ position: absolute;
89
+ width: 100px;
90
+ height: 100px;
91
+ top: -20000px;
92
+ }
93
+ .flexlayout__layout_main {
94
+ display: flex;
95
+ flex-basis: 0px;
96
+ min-width: 0;
97
+ min-height: 0;
98
+ flex-grow: 1;
99
+ position: relative;
100
+ }
101
+ .flexlayout__layout_border_container {
102
+ display: flex;
103
+ flex-basis: 0px;
104
+ min-width: 0;
105
+ min-height: 0;
106
+ flex-grow: 1;
107
+ }
108
+ .flexlayout__layout_border_container_inner {
109
+ display: flex;
110
+ flex-basis: 0px;
111
+ min-width: 0;
112
+ min-height: 0;
113
+ flex-grow: 1;
114
+ }
115
+ .flexlayout__splitter {
116
+ display: flex;
117
+ align-items: center;
118
+ justify-content: center;
119
+ background-color: var(--color-splitter);
120
+ touch-action: none;
121
+ z-index: 10;
122
+ }
123
+ @media (hover: hover) {
124
+ .flexlayout__splitter:hover {
125
+ background-color: var(--color-splitter-hover);
126
+ transition: background-color ease-in 0.1s;
127
+ transition-delay: 0.05s;
128
+ border-radius: 5px;
129
+ }
130
+ }
131
+ .flexlayout__splitter_drag {
132
+ position: absolute;
133
+ display: flex;
134
+ align-items: center;
135
+ justify-content: center;
136
+ z-index: 1000;
137
+ border-radius: 5px;
138
+ background-color: var(--color-splitter-drag);
139
+ }
140
+ .flexlayout__splitter_handle {
141
+ background-color: #ccc;
142
+ border-radius: 3px;
143
+ }
144
+ .flexlayout__splitter_handle_horz {
145
+ width: 3px;
146
+ height: 30px;
147
+ }
148
+ .flexlayout__splitter_handle_vert {
149
+ width: 30px;
150
+ height: 3px;
151
+ }
152
+ .flexlayout__splitter_extra {
153
+ touch-action: none;
154
+ background-color: transparent;
155
+ }
156
+ .flexlayout__outline_rect {
157
+ position: absolute;
158
+ pointer-events: none;
159
+ box-sizing: border-box;
160
+ border: 2px solid var(--color-drag1);
161
+ background: var(--color-drag1-background);
162
+ border-radius: 5px;
163
+ z-index: 1000;
164
+ }
165
+ .flexlayout__outline_rect_edge {
166
+ pointer-events: none;
167
+ border: 2px solid var(--color-drag2);
168
+ background: var(--color-drag2-background);
169
+ border-radius: 5px;
170
+ z-index: 1000;
171
+ box-sizing: border-box;
172
+ }
173
+ .flexlayout__edge_rect {
174
+ position: absolute;
175
+ z-index: 1000;
176
+ background-color: var(--color-edge-marker);
177
+ pointer-events: none;
178
+ display: flex;
179
+ align-items: center;
180
+ justify-content: center;
181
+ }
182
+ .flexlayout__drag_rect {
183
+ color: var(--color-drag-rect);
184
+ background-color: var(--color-drag-rect-background);
185
+ border: 2px solid var(--color-drag-rect-border);
186
+ border-radius: 5px;
187
+ box-sizing: border-box;
188
+ display: flex;
189
+ justify-content: center;
190
+ flex-direction: column;
191
+ overflow: hidden;
192
+ padding: 0.3em 0.8em;
193
+ word-wrap: break-word;
194
+ font-size: var(--font-size);
195
+ font-family: var(--font-family);
196
+ }
197
+ .flexlayout__row {
198
+ display: flex;
199
+ flex-basis: 0px;
200
+ min-width: 0;
201
+ min-height: 0;
202
+ position: relative;
203
+ box-sizing: border-box;
204
+ overflow: hidden;
205
+ }
206
+ .flexlayout__tabset {
207
+ display: flex;
208
+ flex-direction: column;
209
+ position: relative;
210
+ background-color: var(--color-tabset-background);
211
+ box-sizing: border-box;
212
+ font-family: var(--font-family);
213
+ overflow: hidden;
214
+ flex-grow: 1;
215
+ }
216
+ .flexlayout__tabset_container {
217
+ display: flex;
218
+ flex-basis: 0px;
219
+ min-width: 0;
220
+ min-height: 0;
221
+ flex-direction: column;
222
+ overflow: hidden;
223
+ flex-grow: 1;
224
+ }
225
+ .flexlayout__tabset_tab_divider {
226
+ width: 4px;
227
+ }
228
+ .flexlayout__tabset_content {
229
+ display: flex;
230
+ flex-basis: 0px;
231
+ min-width: 0;
232
+ min-height: 0;
233
+ flex-grow: 1;
234
+ box-sizing: border-box;
235
+ position: relative;
236
+ }
237
+ .flexlayout__tabset_header {
238
+ display: flex;
239
+ align-items: center;
240
+ padding: 3px 3px 3px 5px;
241
+ box-sizing: border-box;
242
+ border-bottom: 1px solid var(--color-tabset-divider-line);
243
+ color: var(--color-tabset-header);
244
+ background-color: var(--color-tabset-header-background);
245
+ font-size: var(--font-size);
246
+ }
247
+ .flexlayout__tabset_header_content {
248
+ flex-grow: 1;
249
+ }
250
+ .flexlayout__tabset_tabbar_outer {
251
+ box-sizing: border-box;
252
+ background-color: var(--color-tabset-background);
253
+ overflow: hidden;
254
+ display: flex;
255
+ font-size: var(--font-size);
256
+ }
257
+ .flexlayout__tabset_tabbar_outer_top {
258
+ padding: 0px 2px 0px 2px;
259
+ border-bottom: 1px solid var(--color-tabset-divider-line);
260
+ }
261
+ .flexlayout__tabset_tabbar_outer_bottom {
262
+ padding: 0px 2px 0px 2px;
263
+ border-top: 1px solid var(--color-tabset-divider-line);
264
+ }
265
+ .flexlayout__tabset_tabbar_inner {
266
+ position: relative;
267
+ box-sizing: border-box;
268
+ display: flex;
269
+ flex-grow: 1;
270
+ scrollbar-width: none;
271
+ }
272
+ .flexlayout__tabset_tabbar_inner::-webkit-scrollbar {
273
+ display: none;
274
+ }
275
+ .flexlayout__tabset_tabbar_inner_tab_container {
276
+ position: relative;
277
+ display: flex;
278
+ padding-left: 4px;
279
+ padding-right: 4px;
280
+ box-sizing: border-box;
281
+ white-space: nowrap;
282
+ }
283
+ .flexlayout__tabset_tabbar_inner_tab_container_top {
284
+ border-top: 2px solid transparent;
285
+ }
286
+ .flexlayout__tabset_tabbar_inner_tab_container_bottom {
287
+ border-bottom: 2px solid transparent;
288
+ }
289
+ .flexlayout__tabset-selected {
290
+ background-color: var(--color-tabset-background-selected);
291
+ }
292
+ .flexlayout__tabset-maximized {
293
+ background-color: var(--color-tabset-background-maximized);
294
+ }
295
+ .flexlayout__tab_button_stamp {
296
+ display: inline-flex;
297
+ align-items: center;
298
+ gap: 0.3em;
299
+ white-space: nowrap;
300
+ box-sizing: border-box;
301
+ }
302
+ .flexlayout__tab {
303
+ overflow: hidden;
304
+ box-sizing: border-box;
305
+ background-color: var(--color-tab-content);
306
+ color: var(--color-text);
307
+ position: relative;
308
+ }
309
+ .flexlayout__tab_moveable {
310
+ position: relative;
311
+ height: 100%;
312
+ min-width: 1px;
313
+ min-height: 1px;
314
+ overflow: auto;
315
+ box-sizing: border-box;
316
+ }
317
+ .flexlayout__tab_overlay {
318
+ z-index: 20;
319
+ position: absolute;
320
+ top: 0;
321
+ left: 0;
322
+ right: 0;
323
+ bottom: 0;
324
+ background-color: rgba(0, 0, 0, 0.2392156863);
325
+ }
326
+ .flexlayout__tab_button {
327
+ display: flex;
328
+ gap: 0.3em;
329
+ align-items: center;
330
+ box-sizing: border-box;
331
+ padding: 3px 0.5em;
332
+ cursor: pointer;
333
+ }
334
+ .flexlayout__tab_button_stretch {
335
+ background-color: transparent;
336
+ color: var(--color-tab-selected);
337
+ width: 100%;
338
+ padding: 3px 0em;
339
+ text-wrap: nowrap;
340
+ display: flex;
341
+ gap: 0.3em;
342
+ align-items: center;
343
+ box-sizing: border-box;
344
+ cursor: pointer;
345
+ }
346
+ @media (hover: hover) {
347
+ .flexlayout__tab_button_stretch:hover {
348
+ color: var(--color-tab-selected);
349
+ }
350
+ }
351
+ .flexlayout__tab_button--selected {
352
+ background-color: var(--color-tab-selected-background);
353
+ color: var(--color-tab-selected);
354
+ }
355
+ @media (hover: hover) {
356
+ .flexlayout__tab_button:hover {
357
+ color: var(--color-tab-selected);
358
+ }
359
+ }
360
+ .flexlayout__tab_button--unselected {
361
+ background-color: var(--color-tab-unselected-background);
362
+ color: var(--color-tab-unselected);
363
+ }
364
+ .flexlayout__tab_button_leading {
365
+ display: flex;
366
+ }
367
+ .flexlayout__tab_button_content {
368
+ display: flex;
369
+ text-wrap: nowrap;
370
+ }
371
+ .flexlayout__tab_button_textbox {
372
+ border: none;
373
+ font-family: var(--font-family);
374
+ font-size: var(--font-size);
375
+ color: var(--color-tab-textbox);
376
+ background-color: var(--color-tab-textbox-background);
377
+ border: 1px inset var(--color-1);
378
+ border-radius: 3px;
379
+ width: 10em;
380
+ }
381
+ .flexlayout__tab_button_textbox:focus {
382
+ outline: none;
383
+ }
384
+ .flexlayout__tab_button_trailing {
385
+ display: flex;
386
+ visibility: hidden;
387
+ border-radius: 4px;
388
+ }
389
+ .flexlayout__tab_button_trailing:hover {
390
+ background-color: var(--color-toolbar-button-hover);
391
+ }
392
+ @media (hover: hover) {
393
+ .flexlayout__tab_button:hover .flexlayout__tab_button_trailing {
394
+ visibility: visible;
395
+ }
396
+ }
397
+ .flexlayout__tab_button--selected .flexlayout__tab_button_trailing {
398
+ visibility: visible;
399
+ }
400
+ .flexlayout__tab_button_overflow {
401
+ display: flex;
402
+ align-items: center;
403
+ border: none;
404
+ color: var(--color-overflow);
405
+ font-size: inherit;
406
+ background-color: transparent;
407
+ width: 2em;
408
+ overflow: hidden;
409
+ }
410
+ .flexlayout__tab_toolbar {
411
+ display: flex;
412
+ align-items: center;
413
+ gap: 0.3em;
414
+ padding-left: 0.5em;
415
+ padding-right: 0.3em;
416
+ }
417
+ .flexlayout__tab_toolbar_icon {
418
+ border: none;
419
+ outline: none;
420
+ font-size: inherit;
421
+ margin: 0px;
422
+ background-color: transparent;
423
+ padding: 1px;
424
+ }
425
+ .flexlayout__tab_toolbar_button {
426
+ border: none;
427
+ outline: none;
428
+ font-size: inherit;
429
+ margin: 0px;
430
+ background-color: transparent;
431
+ border-radius: 4px;
432
+ padding: 1px;
433
+ }
434
+ @media (hover: hover) {
435
+ .flexlayout__tab_toolbar_button:hover {
436
+ background-color: var(--color-toolbar-button-hover);
437
+ }
438
+ }
439
+ .flexlayout__tab_toolbar_sticky_buttons_container {
440
+ display: flex;
441
+ gap: 0.3em;
442
+ padding-left: 5px;
443
+ align-items: center;
444
+ }
445
+ .flexlayout__border {
446
+ box-sizing: border-box;
447
+ overflow: hidden;
448
+ display: flex;
449
+ font-size: var(--font-size);
450
+ font-family: var(--font-family);
451
+ color: var(--color-border);
452
+ background-color: var(--color-border-background);
453
+ }
454
+ .flexlayout__border_tab_contents {
455
+ box-sizing: border-box;
456
+ overflow: hidden;
457
+ background-color: var(--color-border-tab-content);
458
+ }
459
+ .flexlayout__border_top {
460
+ border-bottom: 1px solid var(--color-border-divider-line);
461
+ align-items: center;
462
+ }
463
+ .flexlayout__border_bottom {
464
+ border-top: 1px solid var(--color-border-divider-line);
465
+ align-items: center;
466
+ }
467
+ .flexlayout__border_left {
468
+ border-right: 1px solid var(--color-border-divider-line);
469
+ align-content: center;
470
+ flex-direction: column;
471
+ }
472
+ .flexlayout__border_right {
473
+ border-left: 1px solid var(--color-border-divider-line);
474
+ align-content: center;
475
+ flex-direction: column;
476
+ }
477
+ .flexlayout__border_inner {
478
+ position: relative;
479
+ box-sizing: border-box;
480
+ align-items: center;
481
+ display: flex;
482
+ flex-grow: 1;
483
+ scrollbar-width: none;
484
+ }
485
+ .flexlayout__border_inner::-webkit-scrollbar {
486
+ display: none;
487
+ }
488
+ .flexlayout__border_inner_tab_container {
489
+ white-space: nowrap;
490
+ display: flex;
491
+ padding-left: 2px;
492
+ padding-right: 2px;
493
+ box-sizing: border-box;
494
+ position: absolute;
495
+ }
496
+ .flexlayout__border_inner_tab_container_right {
497
+ transform-origin: top left;
498
+ transform: rotate(90deg);
499
+ }
500
+ .flexlayout__border_inner_tab_container_left {
501
+ flex-direction: row-reverse;
502
+ transform-origin: top right;
503
+ transform: rotate(-90deg);
504
+ }
505
+ .flexlayout__border_tab_divider {
506
+ width: 4px;
507
+ }
508
+ .flexlayout__border_button {
509
+ display: flex;
510
+ gap: 0.3em;
511
+ align-items: center;
512
+ cursor: pointer;
513
+ padding: 3px 0.5em;
514
+ margin: 2px 0px;
515
+ box-sizing: border-box;
516
+ white-space: nowrap;
517
+ }
518
+ .flexlayout__border_button--selected {
519
+ background-color: var(--color-border-tab-selected-background);
520
+ color: var(--color-border-tab-selected);
521
+ }
522
+ @media (hover: hover) {
523
+ .flexlayout__border_button:hover {
524
+ color: var(--color-border-tab-selected);
525
+ }
526
+ }
527
+ .flexlayout__border_button--unselected {
528
+ background-color: var(--color-border-tab-unselected-background);
529
+ color: var(--color-border-tab-unselected);
530
+ }
531
+ .flexlayout__border_button_leading {
532
+ display: flex;
533
+ }
534
+ .flexlayout__border_button_content {
535
+ display: flex;
536
+ }
537
+ .flexlayout__border_button_trailing {
538
+ display: flex;
539
+ border-radius: 4px;
540
+ visibility: hidden;
541
+ }
542
+ @media (hover: hover) {
543
+ .flexlayout__border_button:hover .flexlayout__border_button_trailing {
544
+ visibility: visible;
545
+ }
546
+ }
547
+ .flexlayout__border_button--selected .flexlayout__border_button_trailing {
548
+ visibility: visible;
549
+ }
550
+ .flexlayout__border_toolbar {
551
+ display: flex;
552
+ gap: 0.3em;
553
+ align-items: center;
554
+ }
555
+ .flexlayout__border_toolbar_left, .flexlayout__border_toolbar_right {
556
+ flex-direction: column;
557
+ padding-top: 0.5em;
558
+ padding-bottom: 0.3em;
559
+ }
560
+ .flexlayout__border_toolbar_top, .flexlayout__border_toolbar_bottom {
561
+ padding-left: 0.5em;
562
+ padding-right: 0.3em;
563
+ }
564
+ .flexlayout__border_toolbar_button {
565
+ border: none;
566
+ outline: none;
567
+ font-size: inherit;
568
+ background-color: transparent;
569
+ border-radius: 4px;
570
+ padding: 1px;
571
+ }
572
+ @media (hover: hover) {
573
+ .flexlayout__border_toolbar_button:hover {
574
+ background-color: var(--color-toolbar-button-hover);
575
+ }
576
+ }
577
+ .flexlayout__border_toolbar_button_overflow {
578
+ display: flex;
579
+ align-items: center;
580
+ border: none;
581
+ color: var(--color-overflow);
582
+ font-size: inherit;
583
+ background-color: transparent;
584
+ width: 1.5em;
585
+ }
586
+ .flexlayout__popup_menu {
587
+ font-size: var(--font-size);
588
+ font-family: var(--font-family);
589
+ }
590
+ .flexlayout__popup_menu_item {
591
+ padding: 2px 0.5em;
592
+ white-space: nowrap;
593
+ cursor: pointer;
594
+ border-radius: 2px;
595
+ }
596
+ .flexlayout__popup_menu_item--selected {
597
+ font-weight: 500;
598
+ background-color: var(--color-tab-selected-background);
599
+ color: var(--color-tab-selected);
600
+ }
601
+ @media (hover: hover) {
602
+ .flexlayout__popup_menu_item:hover {
603
+ background-color: var(--color-6);
604
+ }
605
+ }
606
+ .flexlayout__popup_menu_container {
607
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
608
+ border: 1px solid var(--color-popup-border);
609
+ color: var(--color-popup-unselected);
610
+ background: var(--color-popup-unselected-background);
611
+ border-radius: 3px;
612
+ position: absolute;
613
+ z-index: 1000;
614
+ max-height: 50%;
615
+ min-width: 100px;
616
+ overflow: auto;
617
+ padding: 2px;
618
+ }
619
+ .flexlayout__floating_window _body {
620
+ height: 100%;
621
+ }
622
+ .flexlayout__floating_window_content {
623
+ left: 0;
624
+ top: 0;
625
+ right: 0;
626
+ bottom: 0;
627
+ position: absolute;
628
+ }
629
+ .flexlayout__error_boundary_container {
630
+ left: 0;
631
+ top: 0;
632
+ right: 0;
633
+ bottom: 0;
634
+ position: absolute;
635
+ display: flex;
636
+ justify-content: center;
637
+ }
638
+ .flexlayout__error_boundary_content {
639
+ display: flex;
640
+ align-items: center;
641
+ }
642
+ .flexlayout__border_sizer {
643
+ position: absolute;
644
+ top: -30000px;
645
+ padding-top: 6px;
646
+ padding-bottom: 5px;
647
+ font-size: var(--font-size);
648
+ font-family: var(--font-family);
649
+ }
650
+ .flexlayout__mini_scrollbar {
651
+ position: absolute;
652
+ background-color: var(--color-mini-scroll-indicator);
653
+ border-radius: 5px;
654
+ width: var(--size-mini-scroll-indicator);
655
+ height: var(--size-mini-scroll-indicator);
656
+ visibility: hidden;
657
+ opacity: 0;
658
+ transition: opacity 0.3s ease-in-out, visibility 0.3s ease-in-out;
659
+ }
660
+ .flexlayout__mini_scrollbar:hover {
661
+ background-color: var(--color-mini-scroll-indicator-hovered);
662
+ transition: background-color 0.3s ease-in-out;
663
+ }
664
+ .flexlayout__mini_scrollbar_container {
665
+ position: relative;
666
+ display: flex;
667
+ flex-grow: 1;
668
+ overflow: hidden;
669
+ }
670
+ @media (hover: hover) {
671
+ .flexlayout__mini_scrollbar_container:hover .flexlayout__mini_scrollbar {
672
+ opacity: 1;
673
+ visibility: visible;
674
+ }
675
+ }
676
+
677
+ /* ======================== End of Base Classes =========================== */
678
+ /*
679
+ dark theme overrides
680
+ */
681
+ .flexlayout__tabset_header {
682
+ box-shadow: inset 0 0 3px 0 rgba(136, 136, 136, 0.54);
683
+ }
684
+ .flexlayout__tabset-selected {
685
+ background-image: linear-gradient(var(--color-background), var(--color-4));
686
+ }
687
+ .flexlayout__tabset-maximized {
688
+ background-image: linear-gradient(var(--color-6), var(--color-2));
689
+ }
690
+ .flexlayout__tab_top {
691
+ box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
692
+ border-top-left-radius: 3px;
693
+ border-top-right-radius: 3px;
694
+ }
695
+ .flexlayout__tab_bottom {
696
+ box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
697
+ border-bottom-left-radius: 3px;
698
+ border-bottom-right-radius: 3px;
699
+ }
700
+ .flexlayout__border_button {
701
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
702
+ border-radius: 3px;
703
+ }
704
+
705
+ /*# sourceMappingURL=dark.css.map */