Skip to content

Commit

Permalink
Simplify HTML for help text block.
Browse files Browse the repository at this point in the history
Use "div" instead of "small" to avoid use of "d-block".
Remove "text-muted" as "form-text" already applies the secondary color.
  • Loading branch information
ADmad committed Nov 30, 2024
1 parent 22ddde4 commit 495c731
Show file tree
Hide file tree
Showing 31 changed files with 358 additions and 363 deletions.
47 changes: 21 additions & 26 deletions src/View/Helper/FormHelper.php
Original file line number Diff line number Diff line change
Expand Up @@ -141,7 +141,7 @@ class FormHelper extends CoreFormHelper
'label' =>
'<label{{attrs}}>{{text}}{{tooltip}}</label>',
'help' =>
'<small{{attrs}}>{{content}}</small>',
'<div{{attrs}}>{{content}}</div>',
'tooltip' =>
'<span data-bs-toggle="tooltip" title="{{content}}" class="bi bi-info-circle-fill"></span>',
'formGroupFloatingLabel' =>
Expand Down Expand Up @@ -980,36 +980,31 @@ protected function _placeholderOptions(string $fieldName, array $options): array
*/
protected function _helpOptions(string $fieldName, array $options): array
{
if ($options['help']) {
if (!is_array($options['help'])) {
$options['help'] = [
'content' => $options['help'],
];
}
if ($options['help'] === null) {
return $options;
}

if (!isset($options['help']['id'])) {
$options['help']['id'] = $this->_domId($fieldName . '-help');
}
if (!is_array($options['help'])) {
$options['help'] = [
'content' => $options['help'],
];
}

$helpClasses = [];
if ($this->_align === static::ALIGN_INLINE) {
$helpClasses[] = 'visually-hidden';
} else {
$helpClasses[] = 'd-block';
}
if (!isset($options['help']['id'])) {
$options['help']['id'] = $this->_domId($fieldName . '-help');
}

$helpClasses[] = 'form-text';
if ($this->_align !== static::ALIGN_INLINE) {
$helpClasses[] = 'text-muted';
}
$helpClasses = ['form-text'];
if ($this->_align === static::ALIGN_INLINE) {
$helpClasses[] = 'visually-hidden';
}

$options['help'] = $this->injectClasses($helpClasses, $options['help']);
$options['help'] = $this->injectClasses($helpClasses, $options['help']);

$options['help'] = $this->templater()->format('help', [
'content' => $options['help']['content'],
'attrs' => $this->templater()->formatAttributes($options['help'], ['content']),
]);
}
$options['help'] = $this->templater()->format('help', [
'content' => $options['help']['content'],
'attrs' => $this->templater()->formatAttributes($options['help'], ['content']),
]);

return $options;
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -157,9 +157,9 @@ public function testDefaultAlignCheckboxControlWithHelp()
['label' => ['class' => 'form-check-label', 'for' => 'users']],
'Users',
'/label',
['small' => ['id' => 'users-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'users-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -196,13 +196,13 @@ public function testDefaultAlignCheckboxControlWithHelpOptions()
['label' => ['class' => 'form-check-label', 'for' => 'users']],
'Users',
'/label',
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -347,9 +347,9 @@ public function testDefaultAlignCheckboxControlWithErrorAndHelp()
['div' => ['id' => 'users-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => ['id' => 'users-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'users-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -394,13 +394,13 @@ public function testDefaultAlignCheckboxControlWithErrorAndHelpAndOptions()
['div' => ['id' => 'users-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -750,9 +750,9 @@ public function testDefaultAlignCheckboxControlInlineWithHelp()
['label' => ['class' => 'form-check-label', 'for' => 'users']],
'Users',
'/label',
['small' => ['id' => 'users-help','class' => 'd-block form-text text-muted']],
['div' => ['id' => 'users-help','class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -790,13 +790,13 @@ public function testDefaultAlignCheckboxControlInlineWithHelpOptions()
['label' => ['class' => 'form-check-label', 'for' => 'users']],
'Users',
'/label',
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -133,9 +133,9 @@ public function testDefaultAlignColorControlWithHelp()
'aria-describedby' => 'color-help',
'value' => '#ffffff',
],
['small' => ['id' => 'color-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'color-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -168,13 +168,13 @@ public function testDefaultAlignColorControlWithHelpOptions()
'aria-describedby' => 'custom-help',
'value' => '#ffffff',
],
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -300,9 +300,9 @@ public function testDefaultAlignColorControlWithErrorAndHelp()
['div' => ['id' => 'color-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => ['id' => 'color-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'color-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -342,13 +342,13 @@ public function testDefaultAlignColorControlWithErrorAndHelpOptions()
['div' => ['id' => 'color-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -159,9 +159,9 @@ public function testDefaultAlignDateTimeControlWithHelp()
'step' => '1',
'value' => date('H:i:s', $now),
],
['small' => ['id' => 'created-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'created-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -197,13 +197,13 @@ public function testDefaultAlignDateTimeControlWithHelpOptions()
'step' => '1',
'value' => date('H:i:s', $now),
],
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -346,9 +346,9 @@ public function testDefaultAlignDateTimeControlWithErrorAndHelp()
['div' => ['id' => 'created-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => ['id' => 'created-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'created-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -393,13 +393,13 @@ public function testDefaultAlignDateTimeControlWithErrorAndHelpOptions()
['div' => ['id' => 'created-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -127,9 +127,9 @@ public function testDefaultAlignFileControlWithHelp()
'class' => 'form-control',
'aria-describedby' => 'file-help',
]],
['small' => ['id' => 'file-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'file-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -160,13 +160,13 @@ public function testDefaultAlignFileControlWithHelpOptions()
'class' => 'form-control',
'aria-describedby' => 'custom-help',
]],
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -284,9 +284,9 @@ public function testDefaultAlignFileControlWithErrorAndHelp()
['div' => ['id' => 'file-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => ['id' => 'file-help', 'class' => 'd-block form-text text-muted']],
['div' => ['id' => 'file-help', 'class' => 'form-text']],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down Expand Up @@ -324,13 +324,13 @@ public function testDefaultAlignFileControlWithErrorAndHelpOptions()
['div' => ['id' => 'file-error', 'class' => 'ms-0 invalid-feedback']],
'error message',
'/div',
['small' => [
['div' => [
'id' => 'custom-help',
'foo' => 'bar',
'class' => 'help-class d-block form-text text-muted',
'class' => 'help-class form-text',
]],
'Help text',
'/small',
'/div',
'/div',
];
$this->assertHtml($expected, $result);
Expand Down
Loading

0 comments on commit 495c731

Please sign in to comment.