User1342 commited on
Commit
dada16c
·
1 Parent(s): 2eea39d

Force the notice row to be the flex container it always claimed to be

Browse files
Files changed (1) hide show
  1. distinct_server/presentation.py +16 -2
distinct_server/presentation.py CHANGED
@@ -411,17 +411,31 @@ footer,.gradio-container footer{display:none !important;}
411
  floating above the text like a rendering fault. The mark and the sentence
412
  are now one non-breaking pair that shrinks together; only the "What is
413
  kept" toggle is allowed to drop to its own line. */
414
- .c-notice__summary{display:flex; align-items:flex-start; gap:var(--s3);
 
 
 
 
 
 
 
 
 
415
  flex-wrap:wrap; cursor:pointer; list-style:none;
416
  font-size:var(--t-label); color:var(--c-text-2);
417
  line-height:1.5;}
418
  .c-notice__summary>span:nth-child(2){flex:1 1 180px; min-width:0;}
419
  .c-notice__summary::-webkit-details-marker{display:none;}
420
  .c-notice__summary strong{color:var(--c-text); font-weight:600;}
 
 
 
 
421
  .c-notice__mark{flex:none; width:16px; height:16px; border-radius:50%;
422
  margin-top:2px;
423
  border:1.5px solid var(--c-warn-rule); color:var(--c-warn-rule);
424
- font-size:10px; font-weight:700; display:grid; place-items:center;}
 
425
  .c-notice__toggle{margin-left:auto; white-space:nowrap; font-size:var(--t-micro);
426
  color:var(--c-muted); text-decoration:underline;
427
  text-underline-offset:2px; padding-left:var(--s3);}
 
411
  floating above the text like a rendering fault. The mark and the sentence
412
  are now one non-breaking pair that shrinks together; only the "What is
413
  kept" toggle is allowed to drop to its own line. */
414
+ /* `display` IS `!important` HERE, AND THAT IS NOT LAZINESS.
415
+ Gradio ships `.gradio-container-6-24-0 summary{display:list-item}` — an
416
+ element selector inside a version-stamped class, which outranks any single
417
+ class of ours and whose name changes with every release, so it cannot be
418
+ matched or overridden by specificity that survives an upgrade. Until this
419
+ was forced, this rule had simply never applied: the row was never a flex
420
+ container at all. It went unnoticed while the children happened to be
421
+ inline, and became visible the moment the mark was given a box of its own,
422
+ which a non-flex parent then put on a line of its own. */
423
+ .c-notice__summary{display:flex !important; align-items:flex-start; gap:var(--s3);
424
  flex-wrap:wrap; cursor:pointer; list-style:none;
425
  font-size:var(--t-label); color:var(--c-text-2);
426
  line-height:1.5;}
427
  .c-notice__summary>span:nth-child(2){flex:1 1 180px; min-width:0;}
428
  .c-notice__summary::-webkit-details-marker{display:none;}
429
  .c-notice__summary strong{color:var(--c-text); font-weight:600;}
430
+ /* inline-grid, not grid: a block-level box in a row that failed to become a
431
+ flex container takes the whole line to itself, which is exactly how this
432
+ mark ended up stranded above its own sentence. Inline-grid centres the
433
+ glyph just as well and cannot claim a line. */
434
  .c-notice__mark{flex:none; width:16px; height:16px; border-radius:50%;
435
  margin-top:2px;
436
  border:1.5px solid var(--c-warn-rule); color:var(--c-warn-rule);
437
+ font-size:10px; font-weight:700;
438
+ display:inline-grid; place-items:center;}
439
  .c-notice__toggle{margin-left:auto; white-space:nowrap; font-size:var(--t-micro);
440
  color:var(--c-muted); text-decoration:underline;
441
  text-underline-offset:2px; padding-left:var(--s3);}