David-stout commited on
Commit
6867ac6
·
verified ·
1 Parent(s): c9929b0

Fix unclickable prompt: stop hiding the textbox label, keep send on the same row

Browse files
Files changed (1) hide show
  1. app.py +45 -17
app.py CHANGED
@@ -232,6 +232,7 @@ footer, .footer, .built-with, .settings, .settings-bar, .show-api,
232
  margin: 8px auto 0 !important;
233
  display: flex !important;
234
  flex-direction: row !important;
 
235
  align-items: center !important;
236
  gap: 10px !important;
237
  flex: 0 0 auto !important;
@@ -240,9 +241,9 @@ footer, .footer, .built-with, .settings, .settings-bar, .show-api,
240
  }
241
  #composer-row > .block:has(#twil-input),
242
  #twil-input {
243
- flex: 1 1 auto !important;
244
- min-width: 240px !important;
245
- width: 100% !important;
246
  height: 52px !important;
247
  min-height: 52px !important;
248
  max-height: 52px !important;
@@ -252,10 +253,24 @@ footer, .footer, .built-with, .settings, .settings-bar, .show-api,
252
  box-shadow: none !important;
253
  overflow: hidden !important;
254
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
255
  #twil-input textarea,
256
  #twil-input input,
257
  #twil-input .scroll-hide,
258
  #twil-input [data-testid="textbox"] {
 
259
  background: transparent !important;
260
  color: var(--weba-fg) !important;
261
  border: none !important;
@@ -272,11 +287,37 @@ footer, .footer, .built-with, .settings, .settings-bar, .show-api,
272
  resize: none !important;
273
  white-space: pre-wrap !important;
274
  field-sizing: fixed !important;
 
275
  }
276
  #twil-input button, #twil-input .show-count, #twil-input .icon-button,
277
- #composer-row label {
278
  display: none !important;
279
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
280
  #chips-row {
281
  max-width: 768px !important;
282
  width: 100% !important;
@@ -305,19 +346,6 @@ footer, .footer, .built-with, .settings, .settings-bar, .show-api,
305
  color: var(--weba-fg) !important;
306
  }
307
 
308
- #send-btn {
309
- min-width: 40px !important;
310
- width: 40px !important;
311
- height: 40px !important;
312
- border-radius: 999px !important;
313
- background: var(--weba-secondary) !important;
314
- color: var(--weba-fg) !important;
315
- border: none !important;
316
- box-shadow: none !important;
317
- align-self: center !important;
318
- flex: 0 0 40px !important;
319
- }
320
-
321
  @keyframes twil-pulse {
322
  0%, 100% { opacity: 0.4; }
323
  50% { opacity: 1; }
 
232
  margin: 8px auto 0 !important;
233
  display: flex !important;
234
  flex-direction: row !important;
235
+ flex-wrap: nowrap !important;
236
  align-items: center !important;
237
  gap: 10px !important;
238
  flex: 0 0 auto !important;
 
241
  }
242
  #composer-row > .block:has(#twil-input),
243
  #twil-input {
244
+ flex: 1 1 0% !important;
245
+ min-width: 0 !important;
246
+ width: auto !important;
247
  height: 52px !important;
248
  min-height: 52px !important;
249
  max-height: 52px !important;
 
253
  box-shadow: none !important;
254
  overflow: hidden !important;
255
  }
256
+ #twil-input label,
257
+ #twil-input .input-container {
258
+ display: flex !important;
259
+ align-items: stretch !important;
260
+ width: 100% !important;
261
+ height: 100% !important;
262
+ min-height: 52px !important;
263
+ margin: 0 !important;
264
+ padding: 0 !important;
265
+ border: none !important;
266
+ background: transparent !important;
267
+ box-sizing: border-box !important;
268
+ }
269
  #twil-input textarea,
270
  #twil-input input,
271
  #twil-input .scroll-hide,
272
  #twil-input [data-testid="textbox"] {
273
+ display: block !important;
274
  background: transparent !important;
275
  color: var(--weba-fg) !important;
276
  border: none !important;
 
287
  resize: none !important;
288
  white-space: pre-wrap !important;
289
  field-sizing: fixed !important;
290
+ pointer-events: auto !important;
291
  }
292
  #twil-input button, #twil-input .show-count, #twil-input .icon-button,
293
+ #twil-input .sr-only, #twil-input span[data-testid="block-info"] {
294
  display: none !important;
295
  }
296
+ #composer-row > .form,
297
+ #composer-row > .block:has(#send-btn) {
298
+ flex: 0 0 40px !important;
299
+ width: 40px !important;
300
+ min-width: 40px !important;
301
+ max-width: 40px !important;
302
+ background: transparent !important;
303
+ border: none !important;
304
+ padding: 0 !important;
305
+ box-shadow: none !important;
306
+ }
307
+ #send-btn {
308
+ flex: 0 0 40px !important;
309
+ width: 40px !important;
310
+ min-width: 40px !important;
311
+ max-width: 40px !important;
312
+ height: 40px !important;
313
+ border-radius: 999px !important;
314
+ background: var(--weba-secondary) !important;
315
+ color: var(--weba-fg) !important;
316
+ border: none !important;
317
+ box-shadow: none !important;
318
+ align-self: center !important;
319
+ padding: 0 !important;
320
+ }
321
  #chips-row {
322
  max-width: 768px !important;
323
  width: 100% !important;
 
346
  color: var(--weba-fg) !important;
347
  }
348
 
 
 
 
 
 
 
 
 
 
 
 
 
 
349
  @keyframes twil-pulse {
350
  0%, 100% { opacity: 0.4; }
351
  50% { opacity: 1; }