Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Make all modal triggers anchor elements #1605

Closed
3 tasks
thekaveman opened this issue Aug 1, 2023 · 4 comments · Fixed by #1627
Closed
3 tasks

Make all modal triggers anchor elements #1605

thekaveman opened this issue Aug 1, 2023 · 4 comments · Fixed by #1627
Assignees
Labels
front-end HTML/CSS/JavaScript and Django templates

Comments

@thekaveman
Copy link
Member

thekaveman commented Aug 1, 2023

We want each of the modal triggers to be a represented as an anchor element <a>.

There are two instances of a modal trigger as a <button>:

  • the Index "Choose your Provider" modal button
  • the Eligibility Index "Login.gov" mode

Acceptance Criteria

  • All modal triggers use the core/includes/modal-trigger-link.html or implement a custom <a> element
  • The core/includes/modal-trigger.html is removed
  • core/includes/modal-trigger-link.html is renamed to core/includes/modal-trigger.html
@thekaveman thekaveman added the front-end HTML/CSS/JavaScript and Django templates label Aug 1, 2023
@thekaveman thekaveman added this to the Veterans milestone Aug 1, 2023
@machikoyasuda
Copy link
Member

When completing this PR, please watch out for extra whitespace being created between the modal icon and the period.

I believe there's a regression on dev right now, where there is an extra space between the Login.gov modal icon and the period (top window in screenshot). It should look like the bottom window in the screenshot. I believe this extra space can be rendered when there's extra white space or line breaks in the template code.
image

@thekaveman
Copy link
Member Author

@machikoyasuda I did notice this reformatting in my ID PR😞 https://github.com/cal-itp/benefits/pull/1612/files#diff-cb91e6639dcdc4ed11d637fe0faf0c45cd62e18bf75e28ee8a875318a4f56e4eR15

This change was from djLint, maybe we need to wrap some of these sections with a comment to turn it off? I don't think this is the specific example in your screenshot though.

@machikoyasuda
Copy link
Member

@thekaveman Ooo yea it's this line 15 on the radio input selection label for senior. https://github.com/cal-itp/benefits/pull/1612/files#diff-cb91e6639dcdc4ed11d637fe0faf0c45cd62e18bf75e28ee8a875318a4f56e4eR15

Since all modal triggers are at the end of the sentence, this PR could add the period to the trigger includes. That way we only have to override the djLint rule in one place.

@machikoyasuda
Copy link
Member

Would be good to test if this issue still arises after this refactor: #1526

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
front-end HTML/CSS/JavaScript and Django templates
Projects
No open projects
Development

Successfully merging a pull request may close this issue.

2 participants