formulario consent embed: 3 columnas para inputs cortos + checkboxes más grandes
- Grid pasa de 2 a 3 columnas en modo compact; campo-full abarca las 3 - texto/textarea siguen en fila completa (campo-full) - numero, edad, fecha, hora ocupan 1/3 → caben 3 por fila - form-check-input 1.35em, min-height 2.2rem para área táctil cómoda en tablet Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
co-authored by
Claude Sonnet 4.6
parent
50446a3914
commit
0a09b07ea1
@@ -533,10 +533,32 @@ function _addExamWizardHtml(string $cid): string {
|
|||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
<?php if ($compact): ?>
|
<?php if ($compact): ?>
|
||||||
/* ── Modo compact (tablet, 2 columnas) ── */
|
/* ── Modo compact (3 columnas para inputs cortos) ── */
|
||||||
@media (min-width: 480px) {
|
@media (min-width: 480px) {
|
||||||
.campos-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 14px; align-items: start; }
|
.campos-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6px 14px; align-items: start; }
|
||||||
.campos-grid .campo-full { grid-column: span 2; }
|
.campos-grid .campo-full { grid-column: span 3; }
|
||||||
|
}
|
||||||
|
/* ── Checkboxes y radios con área táctil mayor ── */
|
||||||
|
.campo-edit .form-check {
|
||||||
|
padding-left: 2.2em;
|
||||||
|
min-height: 2.2rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0;
|
||||||
|
}
|
||||||
|
.campo-edit .form-check-input {
|
||||||
|
width: 1.35em;
|
||||||
|
height: 1.35em;
|
||||||
|
margin-top: 0;
|
||||||
|
margin-left: -2.2em;
|
||||||
|
cursor: pointer;
|
||||||
|
flex-shrink: 0;
|
||||||
|
}
|
||||||
|
.campo-edit .form-check-label {
|
||||||
|
font-size: 15px;
|
||||||
|
line-height: 1.4;
|
||||||
|
padding-left: 0.5em;
|
||||||
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
<?php endif; ?>
|
<?php endif; ?>
|
||||||
|
|
||||||
@@ -1060,7 +1082,7 @@ function _addExamWizardHtml(string $cid): string {
|
|||||||
<?php endif; continue; endif; // linked
|
<?php endif; continue; endif; // linked
|
||||||
if ($tipo === 'textarea'):
|
if ($tipo === 'textarea'):
|
||||||
?>
|
?>
|
||||||
<div class="campo-edit<?= $compact ? ' campo-full' : '' ?>" data-campo-id="<?= esc2($cid) ?>">
|
<div class="campo-edit campo-full" data-campo-id="<?= esc2($cid) ?>">
|
||||||
<label><?= $label ?></label>
|
<label><?= $label ?></label>
|
||||||
<textarea class="form-control form-control-sm" name="<?= esc2($cid) ?>"
|
<textarea class="form-control form-control-sm" name="<?= esc2($cid) ?>"
|
||||||
rows="3"<?= $req ?>><?= esc2($prefill) ?></textarea>
|
rows="3"<?= $req ?>><?= esc2($prefill) ?></textarea>
|
||||||
@@ -1138,8 +1160,10 @@ function _addExamWizardHtml(string $cid): string {
|
|||||||
'hora' => 'time',
|
'hora' => 'time',
|
||||||
default => 'text'
|
default => 'text'
|
||||||
};
|
};
|
||||||
|
// texto libre ocupa fila completa; tipos cortos caben 3 por fila
|
||||||
|
$inputFullClass = ($compact && $tipo === 'texto') ? ' campo-full' : '';
|
||||||
?>
|
?>
|
||||||
<div class="campo-edit" data-campo-id="<?= esc2($cid) ?>">
|
<div class="campo-edit<?= $inputFullClass ?>" data-campo-id="<?= esc2($cid) ?>">
|
||||||
<label><?= $label ?></label>
|
<label><?= $label ?></label>
|
||||||
<input type="<?= $inputType ?>" class="form-control form-control-sm"
|
<input type="<?= $inputType ?>" class="form-control form-control-sm"
|
||||||
name="<?= esc2($cid) ?>" value="<?= esc2($prefill) ?>"<?= $req ?>
|
name="<?= esc2($cid) ?>" value="<?= esc2($prefill) ?>"<?= $req ?>
|
||||||
|
|||||||
Reference in New Issue
Block a user