[OCaml] High Intensity Training Online
fix align correction buttons and keep the outline fill
The generic .button-group solid-fill rule tied on specificity with the Save-correction outline rule and, coming later, won — so Save correction rendered as a solid fill. Name both group classes so the outline wins. The buttons also stacked their own top margins on the group's, pushing the pair too far down; drop the per-button top margin so the group's margin is the only vertical spacing.
lib/web/assets/hito.css
@@ -482,16 +482,24 @@
482
482
}
483
483
/* Save correction reads as a primary outline: oxblood border and text on a
484
484
transparent field, filling oxblood on hover. It pairs with the Reset button
485
Removed:
beside it without competing as a solid fill. */
486
Removed:
.correction-actions input[type="submit"] {
485
Added:
beside it without competing as a solid fill. The selector names both group
486
Added:
classes so it beats the generic .button-group solid-fill rule, which ties on
487
Added:
specificity and would otherwise win by order. */
488
Added:
.button-group.correction-actions input[type="submit"] {
487
489
color: var(--oxblood);
488
490
background: transparent;
489
491
border: 2px solid var(--oxblood-dark);
490
492
}
491
Removed:
.correction-actions input[type="submit"]:hover {
493
Added:
.button-group.correction-actions input[type="submit"]:hover {
492
494
color: var(--on-primary);
493
495
background: var(--oxblood);
494
496
}
497
Added:
/* Both correction controls sit in one grid row, so neither carries its own top
498
Added:
margin — the group's top margin is the single source of vertical spacing. */
499
Added:
.button-group.correction-actions input[type="submit"],
500
Added:
.button-group.correction-actions button[type="reset"].secondary {
501
Added:
margin-top: 0;
502
Added:
}
495
503
/* A reset button styled to match a secondary submit. */
496
504
button[type="reset"].secondary {
497
505
min-height: 3rem;
@@ -584,6 +592,7 @@
584
592
justify-content: center;
585
593
width: 100%;
586
594
min-height: 3rem;
595
Added:
margin: 0;
587
596
border: 2px solid var(--oxblood-dark);
588
597
border-radius: var(--radius);
589
598
color: var(--on-primary);