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

Enrollment page: Space after Littlepay #2428

Closed
machikoyasuda opened this issue Oct 7, 2024 · 0 comments · Fixed by #2456
Closed

Enrollment page: Space after Littlepay #2428

machikoyasuda opened this issue Oct 7, 2024 · 0 comments · Fixed by #2456
Assignees
Labels
chore Chores and tasks for code cleanup, dev experience, admin/configuration settings, etc. front-end HTML/CSS/JavaScript and Django templates

Comments

@machikoyasuda
Copy link
Member

machikoyasuda commented Oct 7, 2024

Problem: There should not be an extra whitespace after the Littlepay icon link on the Eligibility confirmation page:

Image
Image


Should look like this:
Image

The linter doesn't allow this text to be on one line, but it needs to be on one line so the whitespace is eliminated:

I noticed that the rendered code in the text after the image has some whitespace built in: Image

Need to remove this whitespace: Image
Removing that whitespace manually removes the extra space, and makes the page look correct.

This ticket will involve investigating why this whitespace get rendered and figure out how to fix it.


These are similar kinds of links, and don't have the extra space:
Image

Possible fix:

I noticed that not using the modal trigger includes and using a djLint off ignore fixes it:

            <!-- djlint:off -->
            <a href="modal--littlepay" class="{{ classes }}" data-bs-toggle="modal" data-bs-target="#modal--littlepay">Littlepay</a>{% translate ", to enter your contactless card details." %}<!-- djlint:on -->
@machikoyasuda machikoyasuda added the front-end HTML/CSS/JavaScript and Django templates label Oct 7, 2024
@thekaveman thekaveman added the chore Chores and tasks for code cleanup, dev experience, admin/configuration settings, etc. label Oct 8, 2024
@thekaveman thekaveman moved this from Todo to Stretch in Digital Services Oct 8, 2024
@machikoyasuda machikoyasuda self-assigned this Oct 15, 2024
@machikoyasuda machikoyasuda moved this from Stretch to In progress in Digital Services Oct 15, 2024
@machikoyasuda machikoyasuda moved this from In progress to In review in Digital Services Oct 15, 2024
@github-project-automation github-project-automation bot moved this from In review to Done in Digital Services Oct 15, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
chore Chores and tasks for code cleanup, dev experience, admin/configuration settings, etc. front-end HTML/CSS/JavaScript and Django templates
Projects
Status: Done
Development

Successfully merging a pull request may close this issue.

2 participants