Update Django messages to reuse toast component used by htmx #4385
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
theskumar
commented
Feb 7, 2025
| @@ -10,7 +10,7 @@ | |||
| <script> | |||
| function toastHandler() { | |||
| "use strict"; | |||
| const AUTO_HIDE_TIMEOUT = 2500; | |||
| const AUTO_HIDE_TIMEOUT = 3000; | |||
There was a problem hiding this comment.
Give a generous time to reader of the notification.
This updates the full page load to use the same mechanism to display the messages from django.contrib.messages as used during htmx request
theskumar
force-pushed
the
enchancement/django-messages
branch
from
c31adb4 to
258377e
Compare
frjo
approved these changes
Feb 7, 2025
| @@ -103,7 +103,7 @@ | |||
| @click="remove(toast.id)" | |||
| @mouseenter="pause(toast.id)" | |||
| @mouseleave="resume(toast.id)" | |||
| class="relative py-3 px-4 mt-4 w-full max-w-full text-sm font-bold text-white rounded-md shadow-xl cursor-pointer sm:w-auto sm:max-w-sm group" | |||
| class="relative py-3 px-4 mt-4 w-full max-w-full text-sm font-bold text-white rounded-md shadow-xl cursor-pointer sm:w-auto sm:max-w-sm group sm:min-w-64" | |||
There was a problem hiding this comment.
What do you think of adding a "me-2" or similar here, just to get it a little out from the side.
wes-otf
approved these changes
Feb 7, 2025
frjo
added
Status: Needs testing
- handle long urls and words
|
@frjo Update to include more spaces near edges and also added a max-width for a very large screen. Add/update icons and color for different message types and handle long words and urls Screenshot added in the PR description. |
wes-otf
added
Status: Tested - approved for live ✅
and removed
Status: Needs testing
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This updates the full page load to use the same mechanism to display the messages from
django.contrib.messagesas used during htmx requestThis is achieved by generating a javascript custom event for toast component instead of rendering html content.
Add/update icons and color for different message types and handle long words and urls
The web accessibility is maintained as the toast component handles it when it's is initialized.
This is a further enhancement to #4374 to keep things DRY and consistent.