@bpmn-io/form-js-playground 0.10.0 → 0.11.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.
@@ -46,6 +46,8 @@
46
46
 
47
47
  --font-family: 'IBM Plex Sans', sans-serif;
48
48
  --font-family-monospace: 'IBM Plex Mono', monospace;
49
+
50
+ --modal-zindex: 100;
49
51
  }
50
52
 
51
53
  .fjs-pgl-root {
@@ -59,7 +61,7 @@
59
61
  }
60
62
 
61
63
  .fjs-pgl-main {
62
- width: calc(100% - 111px);
64
+ width: calc(100% - 361px);
63
65
  height: 100%;
64
66
 
65
67
  display: grid;
@@ -67,10 +69,6 @@
67
69
  grid-template-rows: 70% 30%;
68
70
  }
69
71
 
70
- .fjs-pgl-inline-editor-panel .fjs-pgl-main {
71
- grid-template-columns: 65% 35%;
72
- }
73
-
74
72
  /**
75
73
  * Palette
76
74
  */
@@ -79,7 +77,7 @@
79
77
  width: 110px;
80
78
  background-color: var(--color-palette-container-background);
81
79
  border-right: solid 1px var(--color-palette-container-border);
82
- overflow-y: scroll;
80
+ overflow-y: auto;
83
81
  flex-shrink: 0;
84
82
  }
85
83
 
@@ -113,9 +111,13 @@
113
111
  position: relative;
114
112
  display: flex;
115
113
  height: 100%;
114
+ width: 250px;
116
115
  overflow-y: auto;
117
116
  background-color: var(--color-properties-container-background);
118
- --properties-panel-width: 200px;
117
+ }
118
+
119
+ .fjs-pgl-properties-container .fjs-properties-container {
120
+ --properties-panel-width: 250px;
119
121
  }
120
122
 
121
123
  .fjs-pgl-properties-container .bio-properties-panel {
@@ -160,7 +162,7 @@
160
162
  }
161
163
 
162
164
  .fjs-pgl-modal {
163
- z-index: 5;
165
+ z-index: var(--modal-zindex);
164
166
  }
165
167
 
166
168
  .fjs-pgl-modal .fjs-pgl-modal-backdrop {
@@ -170,7 +172,7 @@
170
172
  left: 0;
171
173
  bottom: 0;
172
174
  right: 0;
173
- z-index: 5;
175
+ z-index: var(--modal-zindex);
174
176
  }
175
177
 
176
178
  .fjs-pgl-modal-content {
@@ -182,7 +184,7 @@
182
184
  overflow-y: auto;
183
185
  max-height: 80%;
184
186
  transform: translate(-40%, -50%);
185
- z-index: 5;
187
+ z-index: var(--modal-zindex);
186
188
 
187
189
  font-size: 14px;
188
190
 
@@ -205,10 +207,14 @@
205
207
 
206
208
  .fjs-pgl-form-container {
207
209
  height: 100%;
208
- height: 100%;
210
+ width: 100%;
209
211
  overflow: hidden;
210
212
  }
211
213
 
214
+ .fjs-pgl-form-container .fjs-form-editor {
215
+ width: 100%;
216
+ }
217
+
212
218
  .fjs-pgl-text-container {
213
219
  height: 100%;
214
220
  width: 100%;