Skip to content

Commit

Permalink
minor #1125 [TogglePasswordComponent] Update documentation example fo…
Browse files Browse the repository at this point in the history
…r usage without Symfony Forms (Damien Carrier)

This PR was merged into the 2.x branch.

Discussion
----------

[TogglePasswordComponent] Update documentation example for usage without Symfony Forms

| Q             | A
| ------------- | ---
| Bug fix?      | no
| New feature?  | no
| Tickets       | n/a
| License       | MIT

Update the example to use the component without Symfony Forms
before :
```html
    <div class="toggle-password-container"> // Add "toggle-password-container" or a class that applies position: relative to this container.
        <label for="password">Password</label>
        <input
            id="password"
            name="password"
            type="password"
            {{ stimulus_controller('symfony/ux-toggle-password/toggle-password', {
                    buttonClasses: ['toggle-password-button'], // Add as many classes as you wish. "toggle-password-button" is needed to activate the default CSS.
            }) }}
        >
    </div>
```

after:
```html
    <div class="toggle-password-container"> // Add "toggle-password-container" or a class that applies position: relative to this container.
        <label for="password">Password</label>
        <input
            id="password"
            name="password"
            type="password"
            {{ stimulus_controller('symfony/ux-toggle-password/toggle-password', {
                    {# visibleLabel: 'Show password', // If you want to modify this label. #}
                    {# visibleIcon: 'Some svg icon', // If you want to modify this icon. #}
                    {# hiddenLabel: 'Hide password', // If you want to modify this label. #}
                    {# hiddenIcon: 'Some svg icon', // If you want to modify this icon. #}
                    buttonClasses: ['toggle-password-button'], // Add as many classes as you wish. "toggle-password-button" is needed to activate the default CSS.
            }) }}
        >
    </div>
```

Commits
-------

b67bfc8 [TogglePasswordComponent] Update documentation example for usage without Symfony Forms
  • Loading branch information
weaverryan committed Sep 19, 2023
2 parents b9dd9b7 + b67bfc8 commit 6e6c903
Showing 1 changed file with 4 additions and 0 deletions.
4 changes: 4 additions & 0 deletions src/TogglePassword/doc/index.rst
Original file line number Diff line number Diff line change
Expand Up @@ -275,6 +275,10 @@ You can also use the TogglePassword with native HTML inputs:
name="password"
type="password"
{{ stimulus_controller('symfony/ux-toggle-password/toggle-password', {
{# visibleLabel: 'Show password', // If you want to modify this label. #}
{# visibleIcon: 'Some svg icon', // If you want to modify this icon. #}
{# hiddenLabel: 'Hide password', // If you want to modify this label. #}
{# hiddenIcon: 'Some svg icon', // If you want to modify this icon. #}
buttonClasses: ['toggle-password-button'], // Add as many classes as you wish. "toggle-password-button" is needed to activate the default CSS.
}) }}
>
Expand Down

0 comments on commit 6e6c903

Please # to comment.