@aptre/flex-layout 0.1.0

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 (115) hide show
  1. package/LICENSE +22 -0
  2. package/README.md +527 -0
  3. package/declarations/Attribute.d.ts +1 -0
  4. package/declarations/AttributeDefinitions.d.ts +1 -0
  5. package/declarations/DockLocation.d.ts +12 -0
  6. package/declarations/DragDrop.d.ts +15 -0
  7. package/declarations/DropInfo.d.ts +12 -0
  8. package/declarations/I18nLabel.d.ts +14 -0
  9. package/declarations/Orientation.d.ts +7 -0
  10. package/declarations/PopupMenu.d.ts +1 -0
  11. package/declarations/Rect.d.ts +28 -0
  12. package/declarations/Types.d.ts +78 -0
  13. package/declarations/index.d.ts +22 -0
  14. package/declarations/model/Action.d.ts +5 -0
  15. package/declarations/model/Actions.d.ts +110 -0
  16. package/declarations/model/BorderNode.d.ts +34 -0
  17. package/declarations/model/BorderSet.d.ts +4 -0
  18. package/declarations/model/ICloseType.d.ts +5 -0
  19. package/declarations/model/IDraggable.d.ts +2 -0
  20. package/declarations/model/IDropTarget.d.ts +2 -0
  21. package/declarations/model/IJsonModel.d.ts +146 -0
  22. package/declarations/model/Model.d.ts +86 -0
  23. package/declarations/model/Node.d.ts +17 -0
  24. package/declarations/model/RowNode.d.ts +11 -0
  25. package/declarations/model/SplitterNode.d.ts +5 -0
  26. package/declarations/model/TabNode.d.ts +36 -0
  27. package/declarations/model/TabSetNode.d.ts +40 -0
  28. package/declarations/model/Utils.d.ts +1 -0
  29. package/declarations/view/BorderButton.d.ts +1 -0
  30. package/declarations/view/BorderTabSet.d.ts +1 -0
  31. package/declarations/view/ErrorBoundary.d.ts +1 -0
  32. package/declarations/view/FloatingWindow.d.ts +1 -0
  33. package/declarations/view/FloatingWindowTab.d.ts +1 -0
  34. package/declarations/view/Icons.d.ts +6 -0
  35. package/declarations/view/Layout.d.ts +158 -0
  36. package/declarations/view/Splitter.d.ts +1 -0
  37. package/declarations/view/Tab.d.ts +1 -0
  38. package/declarations/view/TabButton.d.ts +1 -0
  39. package/declarations/view/TabButtonStamp.d.ts +1 -0
  40. package/declarations/view/TabFloating.d.ts +1 -0
  41. package/declarations/view/TabOverflowHook.d.ts +1 -0
  42. package/declarations/view/TabSet.d.ts +1 -0
  43. package/declarations/view/Utils.d.ts +1 -0
  44. package/dist/index.js +5669 -0
  45. package/package.json +73 -0
  46. package/style/_base.scss +631 -0
  47. package/style/dark.css +560 -0
  48. package/style/dark.css.map +1 -0
  49. package/style/dark.scss +173 -0
  50. package/style/gray.css +543 -0
  51. package/style/gray.css.map +1 -0
  52. package/style/gray.scss +172 -0
  53. package/style/light.css +544 -0
  54. package/style/light.css.map +1 -0
  55. package/style/light.scss +156 -0
  56. package/style/underline.css +565 -0
  57. package/style/underline.css.map +1 -0
  58. package/style/underline.scss +178 -0
  59. package/tsconfig.json +18 -0
  60. package/typedoc/.nojekyll +1 -0
  61. package/typedoc/assets/highlight.css +106 -0
  62. package/typedoc/assets/main.js +58 -0
  63. package/typedoc/assets/search.js +1 -0
  64. package/typedoc/assets/style.css +1338 -0
  65. package/typedoc/classes/Action.html +134 -0
  66. package/typedoc/classes/Actions.html +499 -0
  67. package/typedoc/classes/BorderNode.html +374 -0
  68. package/typedoc/classes/BorderSet.html +112 -0
  69. package/typedoc/classes/DockLocation.html +163 -0
  70. package/typedoc/classes/DragDrop.html +242 -0
  71. package/typedoc/classes/DropInfo.html +155 -0
  72. package/typedoc/classes/Layout.html +600 -0
  73. package/typedoc/classes/Model.html +396 -0
  74. package/typedoc/classes/Node.html +221 -0
  75. package/typedoc/classes/Orientation.html +148 -0
  76. package/typedoc/classes/Rect.html +312 -0
  77. package/typedoc/classes/RowNode.html +275 -0
  78. package/typedoc/classes/SplitterNode.html +238 -0
  79. package/typedoc/classes/TabNode.html +389 -0
  80. package/typedoc/classes/TabSetNode.html +453 -0
  81. package/typedoc/enums/CLASSES.html +480 -0
  82. package/typedoc/enums/I18nLabel.html +160 -0
  83. package/typedoc/enums/ICloseType.html +115 -0
  84. package/typedoc/index.html +148 -0
  85. package/typedoc/interfaces/IBorderAttributes.html +166 -0
  86. package/typedoc/interfaces/ICustomDropDestination.html +149 -0
  87. package/typedoc/interfaces/IDraggable.html +95 -0
  88. package/typedoc/interfaces/IDropTarget.html +96 -0
  89. package/typedoc/interfaces/IFontValues.html +124 -0
  90. package/typedoc/interfaces/IGlobalAttributes.html +329 -0
  91. package/typedoc/interfaces/IIcons.html +134 -0
  92. package/typedoc/interfaces/IJsonBorderNode.html +188 -0
  93. package/typedoc/interfaces/IJsonModel.html +119 -0
  94. package/typedoc/interfaces/IJsonRowNode.html +141 -0
  95. package/typedoc/interfaces/IJsonTabNode.html +220 -0
  96. package/typedoc/interfaces/IJsonTabSetNode.html +273 -0
  97. package/typedoc/interfaces/ILayoutProps.html +365 -0
  98. package/typedoc/interfaces/ILayoutState.html +144 -0
  99. package/typedoc/interfaces/IRowAttributes.html +131 -0
  100. package/typedoc/interfaces/ITabAttributes.html +201 -0
  101. package/typedoc/interfaces/ITabRenderValues.html +124 -0
  102. package/typedoc/interfaces/ITabSetAttributes.html +241 -0
  103. package/typedoc/interfaces/ITabSetRenderValues.html +134 -0
  104. package/typedoc/interfaces/ITitleObject.html +114 -0
  105. package/typedoc/types/CustomDragCallback.html +108 -0
  106. package/typedoc/types/DragRectRenderCallback.html +104 -0
  107. package/typedoc/types/FloatingTabPlaceholderRenderCallback.html +114 -0
  108. package/typedoc/types/IBorderLocation.html +87 -0
  109. package/typedoc/types/IInsets.html +98 -0
  110. package/typedoc/types/ITabLocation.html +87 -0
  111. package/typedoc/types/IconFactory.html +100 -0
  112. package/typedoc/types/NodeMouseEvent.html +102 -0
  113. package/typedoc/types/ShowOverflowMenuCallback.html +122 -0
  114. package/typedoc/types/TabSetPlaceHolderCallback.html +100 -0
  115. package/typedoc/types/TitleFactory.html +100 -0
@@ -0,0 +1,173 @@
1
+ $color_text: #eeeeee !default;
2
+ $color_background: black !default;
3
+ $color_base: black !default;
4
+ $color_1: scale_color($color_base, $lightness: 7%) !default;
5
+ $color_2: scale_color($color_base, $lightness: 10%) !default;
6
+ $color_3: scale_color($color_base, $lightness: 15%) !default;
7
+ $color_4: scale_color($color_base, $lightness: 20%) !default;
8
+ $color_5: scale_color($color_base, $lightness: 25%) !default;
9
+ $color_6: scale_color($color_base, $lightness: 30%) !default;
10
+ $color_drag1: rgb(207, 232, 255) !default;
11
+ $color_drag2: rgb(183, 209, 181) !default;
12
+ $color_drag1_background: rgba(128, 128, 128, 0.15) !default;
13
+ $color_drag2_background: rgba(128, 128, 128, 0.15) !default;
14
+
15
+ $font-size: medium !default;
16
+ $font-family: Roboto, Arial, sans-serif !default;
17
+
18
+ .flexlayout {
19
+ &__layout {
20
+ --color-text: #{$color_text};
21
+ --color-background: #{$color_background};
22
+ --color-base: #{$color_base};
23
+ --color-1: #{$color_1};
24
+ --color-2: #{$color_2};
25
+ --color-3: #{$color_3};
26
+ --color-4: #{$color_4};
27
+ --color-5: #{$color_5};
28
+ --color-6: #{$color_6};
29
+ --color-drag1: #{$color_drag1};
30
+ --color-drag2: #{$color_drag2};
31
+ --color-drag1-background: #{$color_drag1_background};
32
+ --color-drag2-background: #{$color_drag2_background};
33
+
34
+ --font-size: #{$font_size};
35
+ --font-family: #{$font_family};
36
+
37
+ --color-overflow: gray;
38
+ --color-icon: gray;
39
+
40
+ --color-tabset-background: var(--color-1);
41
+ --color-tabset-background-selected: var(--color-1);
42
+ --color-tabset-background-maximized: var(--color-6);
43
+ --color-tabset-divider-line: var(--color-4);
44
+
45
+ --color-tabset-header-background: var(--color-1);
46
+ --color-tabset-header: var(--color-text);
47
+
48
+ --color-border-background: var(--color-1);
49
+ --color-border-divider-line: var(--color-4);
50
+
51
+ --color-tab-selected: var(--color-text);
52
+ --color-tab-selected-background: var(--color-4);
53
+ --color-tab-unselected: gray;
54
+ --color-tab-unselected-background: transparent;
55
+ --color-tab-textbox: var(--color-text);
56
+ --color-tab-textbox-background: var(--color-3);
57
+
58
+ --color-border-tab-selected: var(--color-text);
59
+ --color-border-tab-selected-background: var(--color-4);
60
+ --color-border-tab-unselected: gray;
61
+ --color-border-tab-unselected-background: var(--color-2);
62
+
63
+ --color-splitter: var(--color-2);
64
+ --color-splitter-hover: var(--color-4);
65
+ --color-splitter-drag: var(--color-5);
66
+
67
+ --color-drag-rect-border: var(--color-4);
68
+ --color-drag-rect-background: var(--color-1);
69
+ --color-drag-rect: var(--color-text);
70
+
71
+ --color-popup-border: var(--color-6);
72
+ --color-popup-unselected: var(--color-text);
73
+ --color-popup-unselected-background: #{$color_background};
74
+ --color-popup-selected: var(--color-text);
75
+ --color-popup-selected-background: var(--color-4);
76
+
77
+ --color-edge-marker: gray;
78
+ }
79
+ }
80
+ @mixin tabset_mixin {
81
+ }
82
+
83
+ @mixin tabset_tabbar_mixin {
84
+ }
85
+
86
+ @mixin tabset_header_mixin {
87
+ }
88
+
89
+ @mixin tabset_selected_mixin {
90
+ }
91
+
92
+ @mixin tabset_header_mixin {
93
+ box-shadow: inset 0 0 3px 0 rgba(136, 136, 136, 0.54);
94
+ }
95
+
96
+ @mixin tabset_selected_mixin {
97
+ background-image: linear-gradient(var(--color-background), var(--color-4));
98
+ }
99
+
100
+ @mixin tabset_maximized_mixin {
101
+ background-image: linear-gradient(var(--color-6), var(--color-2));
102
+ }
103
+
104
+ @mixin tab_top_mixin {
105
+ box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
106
+ border-top-left-radius: 3px;
107
+ border-top-right-radius: 3px;
108
+ }
109
+
110
+ @mixin tab_bottom_mixin {
111
+ box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
112
+ border-bottom-left-radius: 3px;
113
+ border-bottom-right-radius: 3px;
114
+ }
115
+
116
+ @mixin tab_button_mixin {
117
+ }
118
+
119
+ @mixin tab_button_selected_mixin {
120
+ }
121
+
122
+ @mixin tab_button_unselected_mixin {
123
+ }
124
+
125
+ @mixin tab_button_hovered_mixin {
126
+ }
127
+
128
+ @mixin border_mixin {
129
+ }
130
+
131
+ @mixin close_button_hovered_mixin {
132
+ background-color:var(--color-6);
133
+ }
134
+
135
+ @mixin toolbar_button_hovered_mixin {
136
+ background-color:var(--color-4);
137
+ }
138
+
139
+ @mixin border_button_mixin {
140
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, .15);
141
+ border-radius: 3px;
142
+ }
143
+
144
+ @mixin border_button_selected_mixin {
145
+ }
146
+
147
+ @mixin border_button_unselected_mixin {
148
+ }
149
+
150
+ @mixin border_button_hovered_mixin {
151
+ background-color: var(--color-4);
152
+ }
153
+
154
+ @mixin splitter_mixin {
155
+ }
156
+
157
+ @mixin splitter_hover_mixin {
158
+ }
159
+
160
+ @mixin splitter_drag_mixin {
161
+ border-radius: 5px;
162
+ }
163
+
164
+ @mixin splitter_border_mixin {
165
+ }
166
+
167
+ @mixin tabset_tab_divider_mixin {
168
+ }
169
+
170
+ @mixin border_tab_divider_mixin {
171
+ }
172
+
173
+ @import "_base";
package/style/gray.css ADDED
@@ -0,0 +1,543 @@
1
+ .flexlayout__layout {
2
+ --color-text: black;
3
+ --color-background: white;
4
+ --color-base: white;
5
+ --color-1: #f7f7f7;
6
+ --color-2: #e6e6e6;
7
+ --color-3: #d9d9d9;
8
+ --color-4: #cccccc;
9
+ --color-5: #bfbfbf;
10
+ --color-6: #b3b3b3;
11
+ --color-drag1: rgb(95, 134, 196);
12
+ --color-drag2: rgb(119, 166, 119);
13
+ --color-drag1-background: rgba(95, 134, 196, 0.1);
14
+ --color-drag2-background: rgba(119, 166, 119, 0.075);
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-3);
23
+ --color-tabset-header-background: var(--color-1);
24
+ --color-tabset-header: var(--color-text);
25
+ --color-border-background: var(--color-1);
26
+ --color-border-divider-line: var(--color-3);
27
+ --color-tab-selected: var(--color-text);
28
+ --color-tab-selected-background: var(--color-3);
29
+ --color-tab-unselected: gray;
30
+ --color-tab-unselected-background: transparent;
31
+ --color-tab-textbox: var(--color-text);
32
+ --color-tab-textbox-background: var(--color-3);
33
+ --color-border-tab-selected: var(--color-text);
34
+ --color-border-tab-selected-background: var(--color-3);
35
+ --color-border-tab-unselected: gray;
36
+ --color-border-tab-unselected-background: var(--color-2);
37
+ --color-splitter: var(--color-2);
38
+ --color-splitter-hover: var(--color-4);
39
+ --color-splitter-drag: var(--color-5);
40
+ --color-drag-rect-border: var(--color-4);
41
+ --color-drag-rect-background: var(--color-3);
42
+ --color-drag-rect: var(--color-text);
43
+ --color-popup-border: var(--color-6);
44
+ --color-popup-unselected: var(--color-text);
45
+ --color-popup-unselected-background: white;
46
+ --color-popup-selected: var(--color-text);
47
+ --color-popup-selected-background: var(--color-3);
48
+ --color-edge-marker: gray;
49
+ }
50
+
51
+ .flexlayout__layout {
52
+ left: 0;
53
+ top: 0;
54
+ right: 0;
55
+ bottom: 0;
56
+ position: absolute;
57
+ overflow: hidden;
58
+ }
59
+ .flexlayout__splitter {
60
+ background-color: var(--color-splitter);
61
+ }
62
+ @media (hover: hover) {
63
+ .flexlayout__splitter:hover {
64
+ background-color: var(--color-splitter-hover);
65
+ transition: background-color ease-in 0.1s;
66
+ transition-delay: 0.05s;
67
+ }
68
+ }
69
+ .flexlayout__splitter_border {
70
+ z-index: 10;
71
+ }
72
+ .flexlayout__splitter_drag {
73
+ z-index: 1000;
74
+ background-color: var(--color-splitter-drag);
75
+ border-radius: 5px;
76
+ }
77
+ .flexlayout__splitter_extra {
78
+ background-color: transparent;
79
+ }
80
+ .flexlayout__outline_rect {
81
+ position: absolute;
82
+ pointer-events: none;
83
+ box-sizing: border-box;
84
+ border: 2px solid var(--color-drag1);
85
+ background: var(--color-drag1-background);
86
+ border-radius: 5px;
87
+ z-index: 1000;
88
+ }
89
+ .flexlayout__outline_rect_edge {
90
+ pointer-events: none;
91
+ border: 2px solid var(--color-drag2);
92
+ background: var(--color-drag2-background);
93
+ border-radius: 5px;
94
+ z-index: 1000;
95
+ box-sizing: border-box;
96
+ }
97
+ .flexlayout__edge_rect {
98
+ position: absolute;
99
+ z-index: 1000;
100
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
101
+ background-color: var(--color-edge-marker);
102
+ pointer-events: none;
103
+ }
104
+ .flexlayout__drag_rect {
105
+ position: absolute;
106
+ cursor: move;
107
+ color: var(--color-drag-rect);
108
+ background-color: var(--color-drag-rect-background);
109
+ border: 2px solid var(--color-drag-rect-border);
110
+ border-radius: 5px;
111
+ z-index: 1000;
112
+ box-sizing: border-box;
113
+ opacity: 0.9;
114
+ text-align: center;
115
+ display: flex;
116
+ justify-content: center;
117
+ flex-direction: column;
118
+ overflow: hidden;
119
+ padding: 0.3em 1em;
120
+ word-wrap: break-word;
121
+ font-size: var(--font-size);
122
+ font-family: var(--font-family);
123
+ }
124
+ .flexlayout__tabset {
125
+ display: flex;
126
+ flex-direction: column;
127
+ overflow: hidden;
128
+ background-color: var(--color-tabset-background);
129
+ box-sizing: border-box;
130
+ font-size: var(--font-size);
131
+ font-family: var(--font-family);
132
+ }
133
+ .flexlayout__tabset_tab_divider {
134
+ width: 4px;
135
+ }
136
+ .flexlayout__tabset_content {
137
+ display: flex;
138
+ flex-grow: 1;
139
+ align-items: center;
140
+ justify-content: center;
141
+ }
142
+ .flexlayout__tabset_header {
143
+ display: flex;
144
+ align-items: center;
145
+ padding: 3px 3px 3px 5px;
146
+ box-sizing: border-box;
147
+ border-bottom: 1px solid var(--color-tabset-divider-line);
148
+ color: var(--color-tabset-header);
149
+ background-color: var(--color-tabset-header-background);
150
+ box-shadow: inset 0 0 3px 0 rgba(136, 136, 136, 0.54);
151
+ }
152
+ .flexlayout__tabset_header_content {
153
+ flex-grow: 1;
154
+ }
155
+ .flexlayout__tabset_tabbar_outer {
156
+ box-sizing: border-box;
157
+ background-color: var(--color-tabset-background);
158
+ overflow: hidden;
159
+ display: flex;
160
+ }
161
+ .flexlayout__tabset_tabbar_outer_top {
162
+ border-bottom: 1px solid var(--color-tabset-divider-line);
163
+ }
164
+ .flexlayout__tabset_tabbar_outer_bottom {
165
+ border-top: 1px solid var(--color-tabset-divider-line);
166
+ }
167
+ .flexlayout__tabset_tabbar_inner {
168
+ position: relative;
169
+ box-sizing: border-box;
170
+ display: flex;
171
+ flex-grow: 1;
172
+ overflow: hidden;
173
+ }
174
+ .flexlayout__tabset_tabbar_inner_tab_container {
175
+ display: flex;
176
+ padding-left: 4px;
177
+ padding-right: 4px;
178
+ box-sizing: border-box;
179
+ position: absolute;
180
+ top: 0;
181
+ bottom: 0;
182
+ width: 10000px;
183
+ }
184
+ .flexlayout__tabset_tabbar_inner_tab_container_top {
185
+ border-top: 2px solid transparent;
186
+ }
187
+ .flexlayout__tabset_tabbar_inner_tab_container_bottom {
188
+ border-bottom: 2px solid transparent;
189
+ }
190
+ .flexlayout__tabset-selected {
191
+ background-color: var(--color-tabset-background-selected);
192
+ background-image: linear-gradient(var(--color-background), var(--color-4));
193
+ }
194
+ .flexlayout__tabset-maximized {
195
+ background-color: var(--color-tabset-background-maximized);
196
+ background-image: linear-gradient(var(--color-6), var(--color-2));
197
+ }
198
+ .flexlayout__tab_button_stamp {
199
+ display: inline-flex;
200
+ align-items: center;
201
+ gap: 0.3em;
202
+ white-space: nowrap;
203
+ box-sizing: border-box;
204
+ }
205
+ .flexlayout__tab {
206
+ overflow: auto;
207
+ position: absolute;
208
+ box-sizing: border-box;
209
+ background-color: var(--color-background);
210
+ color: var(--color-text);
211
+ }
212
+ .flexlayout__tab_button {
213
+ display: flex;
214
+ gap: 0.3em;
215
+ align-items: center;
216
+ box-sizing: border-box;
217
+ padding: 3px 0.5em;
218
+ cursor: pointer;
219
+ }
220
+ .flexlayout__tab_button--selected {
221
+ background-color: var(--color-tab-selected-background);
222
+ color: var(--color-tab-selected);
223
+ }
224
+ @media (hover: hover) {
225
+ .flexlayout__tab_button:hover {
226
+ background-color: var(--color-tab-selected-background);
227
+ color: var(--color-tab-selected);
228
+ }
229
+ }
230
+ .flexlayout__tab_button--unselected {
231
+ background-color: var(--color-tab-unselected-background);
232
+ color: var(--color-tab-unselected);
233
+ }
234
+ .flexlayout__tab_button_top {
235
+ box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
236
+ border-top-left-radius: 3px;
237
+ border-top-right-radius: 3px;
238
+ }
239
+ .flexlayout__tab_button_bottom {
240
+ box-shadow: inset -2px 0px 5px rgba(0, 0, 0, 0.1);
241
+ border-bottom-left-radius: 3px;
242
+ border-bottom-right-radius: 3px;
243
+ }
244
+ .flexlayout__tab_button_leading {
245
+ display: flex;
246
+ }
247
+ .flexlayout__tab_button_content {
248
+ display: flex;
249
+ }
250
+ .flexlayout__tab_button_textbox {
251
+ border: none;
252
+ font-family: var(--font-family);
253
+ font-size: var(--font-size);
254
+ color: var(--color-tab-textbox);
255
+ background-color: var(--color-tab-textbox-background);
256
+ border: 1px inset var(--color-1);
257
+ border-radius: 3px;
258
+ width: 10em;
259
+ }
260
+ .flexlayout__tab_button_textbox:focus {
261
+ outline: none;
262
+ }
263
+ .flexlayout__tab_button_trailing {
264
+ display: flex;
265
+ visibility: hidden;
266
+ border-radius: 4px;
267
+ }
268
+ @media (hover: hover) {
269
+ .flexlayout__tab_button:hover .flexlayout__tab_button_trailing {
270
+ visibility: visible;
271
+ }
272
+ }
273
+ .flexlayout__tab_button--selected .flexlayout__tab_button_trailing {
274
+ visibility: visible;
275
+ }
276
+ .flexlayout__tab_button_overflow {
277
+ display: flex;
278
+ align-items: center;
279
+ border: none;
280
+ color: var(--color-overflow);
281
+ font-size: inherit;
282
+ background-color: transparent;
283
+ }
284
+ .flexlayout__tab_toolbar {
285
+ display: flex;
286
+ align-items: center;
287
+ gap: 0.3em;
288
+ padding-left: 0.5em;
289
+ padding-right: 0.3em;
290
+ }
291
+ .flexlayout__tab_toolbar_button {
292
+ border: none;
293
+ outline: none;
294
+ font-size: inherit;
295
+ margin: 0px;
296
+ background-color: transparent;
297
+ border-radius: 4px;
298
+ padding: 1px;
299
+ }
300
+ .flexlayout__tab_toolbar_sticky_buttons_container {
301
+ display: flex;
302
+ gap: 0.3em;
303
+ padding-left: 5px;
304
+ align-items: center;
305
+ }
306
+ .flexlayout__tab_floating {
307
+ overflow: auto;
308
+ position: absolute;
309
+ box-sizing: border-box;
310
+ color: var(--color-text);
311
+ background-color: var(--color-background);
312
+ display: flex;
313
+ justify-content: center;
314
+ align-items: center;
315
+ }
316
+ .flexlayout__tab_floating_inner {
317
+ overflow: auto;
318
+ display: flex;
319
+ flex-direction: column;
320
+ justify-content: center;
321
+ align-items: center;
322
+ }
323
+ .flexlayout__tab_floating_inner div {
324
+ margin-bottom: 5px;
325
+ text-align: center;
326
+ }
327
+ .flexlayout__tab_floating_inner div a {
328
+ color: royalblue;
329
+ }
330
+ .flexlayout__border {
331
+ box-sizing: border-box;
332
+ overflow: hidden;
333
+ display: flex;
334
+ font-size: var(--font-size);
335
+ font-family: var(--font-family);
336
+ color: var(--color-border);
337
+ background-color: var(--color-border-background);
338
+ }
339
+ .flexlayout__border_top {
340
+ border-bottom: 1px solid var(--color-border-divider-line);
341
+ align-items: center;
342
+ }
343
+ .flexlayout__border_bottom {
344
+ border-top: 1px solid var(--color-border-divider-line);
345
+ align-items: center;
346
+ }
347
+ .flexlayout__border_left {
348
+ border-right: 1px solid var(--color-border-divider-line);
349
+ align-content: center;
350
+ flex-direction: column;
351
+ }
352
+ .flexlayout__border_right {
353
+ border-left: 1px solid var(--color-border-divider-line);
354
+ align-content: center;
355
+ flex-direction: column;
356
+ }
357
+ .flexlayout__border_inner {
358
+ position: relative;
359
+ box-sizing: border-box;
360
+ display: flex;
361
+ overflow: hidden;
362
+ flex-grow: 1;
363
+ }
364
+ .flexlayout__border_inner_tab_container {
365
+ white-space: nowrap;
366
+ display: flex;
367
+ padding-left: 2px;
368
+ padding-right: 2px;
369
+ box-sizing: border-box;
370
+ position: absolute;
371
+ top: 0;
372
+ bottom: 0;
373
+ width: 10000px;
374
+ }
375
+ .flexlayout__border_inner_tab_container_right {
376
+ transform-origin: top left;
377
+ transform: rotate(90deg);
378
+ }
379
+ .flexlayout__border_inner_tab_container_left {
380
+ flex-direction: row-reverse;
381
+ transform-origin: top right;
382
+ transform: rotate(-90deg);
383
+ }
384
+ .flexlayout__border_tab_divider {
385
+ width: 4px;
386
+ }
387
+ .flexlayout__border_button {
388
+ display: flex;
389
+ gap: 0.3em;
390
+ align-items: center;
391
+ cursor: pointer;
392
+ padding: 3px 0.5em;
393
+ margin: 2px 0px;
394
+ box-sizing: border-box;
395
+ white-space: nowrap;
396
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
397
+ border-radius: 3px;
398
+ }
399
+ .flexlayout__border_button--selected {
400
+ background-color: var(--color-border-tab-selected-background);
401
+ color: var(--color-border-tab-selected);
402
+ }
403
+ @media (hover: hover) {
404
+ .flexlayout__border_button:hover {
405
+ background-color: var(--color-border-tab-selected-background);
406
+ color: var(--color-border-tab-selected);
407
+ }
408
+ }
409
+ .flexlayout__border_button--unselected {
410
+ background-color: var(--color-border-tab-unselected-background);
411
+ color: var(--color-border-tab-unselected);
412
+ }
413
+ .flexlayout__border_button_leading {
414
+ display: flex;
415
+ }
416
+ .flexlayout__border_button_content {
417
+ display: flex;
418
+ }
419
+ .flexlayout__border_button_trailing {
420
+ display: flex;
421
+ border-radius: 4px;
422
+ visibility: hidden;
423
+ }
424
+ @media (hover: hover) {
425
+ .flexlayout__border_button:hover .flexlayout__border_button_trailing {
426
+ visibility: visible;
427
+ }
428
+ }
429
+ .flexlayout__border_button--selected .flexlayout__border_button_trailing {
430
+ visibility: visible;
431
+ }
432
+ .flexlayout__border_toolbar {
433
+ display: flex;
434
+ gap: 0.3em;
435
+ align-items: center;
436
+ }
437
+ .flexlayout__border_toolbar_left, .flexlayout__border_toolbar_right {
438
+ flex-direction: column;
439
+ padding-top: 0.5em;
440
+ padding-bottom: 0.3em;
441
+ }
442
+ .flexlayout__border_toolbar_top, .flexlayout__border_toolbar_bottom {
443
+ padding-left: 0.5em;
444
+ padding-right: 0.3em;
445
+ }
446
+ .flexlayout__border_toolbar_button {
447
+ border: none;
448
+ outline: none;
449
+ font-size: inherit;
450
+ background-color: transparent;
451
+ border-radius: 4px;
452
+ padding: 1px;
453
+ }
454
+ .flexlayout__border_toolbar_button_overflow {
455
+ display: flex;
456
+ align-items: center;
457
+ border: none;
458
+ color: var(--color-overflow);
459
+ font-size: inherit;
460
+ background-color: transparent;
461
+ }
462
+ .flexlayout__popup_menu {
463
+ font-size: var(--font-size);
464
+ font-family: var(--font-family);
465
+ }
466
+ .flexlayout__popup_menu_item {
467
+ padding: 2px 0.5em;
468
+ white-space: nowrap;
469
+ cursor: pointer;
470
+ border-radius: 2px;
471
+ }
472
+ @media (hover: hover) {
473
+ .flexlayout__popup_menu_item:hover {
474
+ background-color: var(--color-6);
475
+ }
476
+ }
477
+ .flexlayout__popup_menu_container {
478
+ box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.15);
479
+ border: 1px solid var(--color-popup-border);
480
+ color: var(--color-popup-unselected);
481
+ background: var(--color-popup-unselected-background);
482
+ border-radius: 3px;
483
+ position: absolute;
484
+ z-index: 1000;
485
+ max-height: 50%;
486
+ min-width: 100px;
487
+ overflow: auto;
488
+ padding: 2px;
489
+ }
490
+ .flexlayout__floating_window _body {
491
+ height: 100%;
492
+ }
493
+ .flexlayout__floating_window_content {
494
+ left: 0;
495
+ top: 0;
496
+ right: 0;
497
+ bottom: 0;
498
+ position: absolute;
499
+ }
500
+ .flexlayout__floating_window_tab {
501
+ overflow: auto;
502
+ left: 0;
503
+ top: 0;
504
+ right: 0;
505
+ bottom: 0;
506
+ position: absolute;
507
+ box-sizing: border-box;
508
+ background-color: var(--color-background);
509
+ color: var(--color-text);
510
+ }
511
+ .flexlayout__error_boundary_container {
512
+ left: 0;
513
+ top: 0;
514
+ right: 0;
515
+ bottom: 0;
516
+ position: absolute;
517
+ display: flex;
518
+ justify-content: center;
519
+ }
520
+ .flexlayout__error_boundary_content {
521
+ display: flex;
522
+ align-items: center;
523
+ }
524
+ .flexlayout__tabset_sizer {
525
+ padding-top: 5px;
526
+ padding-bottom: 3px;
527
+ font-size: var(--font-size);
528
+ font-family: var(--font-family);
529
+ }
530
+ .flexlayout__tabset_header_sizer {
531
+ padding-top: 3px;
532
+ padding-bottom: 3px;
533
+ font-size: var(--font-size);
534
+ font-family: var(--font-family);
535
+ }
536
+ .flexlayout__border_sizer {
537
+ padding-top: 6px;
538
+ padding-bottom: 5px;
539
+ font-size: var(--font-size);
540
+ font-family: var(--font-family);
541
+ }
542
+
543
+ /*# sourceMappingURL=gray.css.map */
@@ -0,0 +1 @@
1
+ {"version":3,"sourceRoot":"","sources":["gray.scss","_base.scss"],"names":[],"mappings":"AAiBI;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA;EAEA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EAEA;;;AClEJ;EARA;EACA;EACA;EACA;EACA;EAMI;;AAGJ;EACI;;AAGA;EACI;IACI;IACA;IACA;;;AAIR;EACI;;AAGJ;EACI;EACA;ED+HR;;AC5HI;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;EAEA;EACA;EACA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACI;;AAIJ;EACI;EACA;EACA;EACA;;AAGJ;EAEI;EACA;EACA;EACA;EACA;EACA;EACA;ED1BR;;AC6BQ;EACI;;AAKJ;EAEI;EACA;EACA;EACA;;AAIJ;EACI;;AAGJ;EACI;;AAGJ;EAEI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACI;;AAEJ;EACI;;AAMhB;EACI;ED7ER;;ACiFI;EACI;ED9ER;;ACmFA;EACI;EACA;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EAEA;;AAGA;EACI;EACA;;AAGJ;EACI;IACI;IACA;;;AAKR;EACI;EACA;;AAIJ;ED3HR;EACA;EACA;;AC6HQ;EDzHR;EACA;EACA;;AC2HQ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;;AASJ;EACI;IACI;;;AAIR;EACI;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAIR;EACI;EACA;EACA;EACA;EACA;;AAEA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;;AAoBJ;EACI;EACA;EACA;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;EACA;EACA;;AAGA;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;EACA;EACA;;AAEA;EACI;EACA;;AAEJ;EACI;EACA;EACA;;AAKZ;EACI;;AAIJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;ED3SR;EACA;;AC6SQ;EACI;EACA;;AAGJ;EACI;IACI;IACA;;;AAKR;EACI;EACA;;AAIJ;EACI;;AAGJ;EACI;;AAGJ;EACI;EACA;EACA;;AASJ;EACI;IACI;;;AAIR;EACI;;AAIR;EACI;EACA;EACA;;AAEA;EAEI;EACA;EACA;;AAGJ;EAEI;EACA;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;;AAUA;EACI;EACA;EACA;EACA;EACA;EACA;;AAchB;EACI;EACA;;AAEA;EACI;EACA;EACA;EACA;;AAGJ;EACI;IACI;;;AAIR;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKJ;EACI;;AAGJ;EArkBJ;EACA;EACA;EACA;EACA;;AAqkBI;EACI;EA1kBR;EACA;EACA;EACA;EACA;EAykBQ;EACA;EACA;;AAIR;EAnlBA;EACA;EACA;EACA;EACA;EAilBI;EACA;;AAEJ;EACI;EACA;;AAOJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA;;AAGJ;EACI;EACA;EACA;EACA","file":"gray.css"}