Metadata-Version: 2.1
Name: django-messages-display
Version: 0.5.0
Summary: Display messages from django.contrib.messages as notifications in the browser.
Home-page: https://github.com/demestav/django-messages-display
Author: Demetris Stavrou
License: MIT
Classifier: Environment :: Web Environment
Classifier: Framework :: Django
Classifier: Framework :: Django :: 2.2
Classifier: Framework :: Django :: 3.0
Classifier: Framework :: Django :: 3.1
Classifier: Framework :: Django :: 3.2
Classifier: Framework :: Django :: 4.0
Classifier: Intended Audience :: Developers
Classifier: License :: OSI Approved :: MIT License
Classifier: Operating System :: OS Independent
Classifier: Programming Language :: Python
Classifier: Programming Language :: Python :: 3
Classifier: Programming Language :: Python :: 3 :: Only
Classifier: Programming Language :: Python :: 3.8
Classifier: Programming Language :: Python :: 3.9
Classifier: Topic :: Internet :: WWW/HTTP
Classifier: Topic :: Internet :: WWW/HTTP :: Dynamic Content
Requires-Python: >=3.7
Description-Content-Type: text/markdown
License-File: LICENCE
Requires-Dist: Django>=2.2

# django-messages-display
Display messages from django.contrib.messages as notifications in the browser.

## Setup
Install the package using `pip`:

```shell
python -m pip install django-messages-display
```

Add it to the installed apps of your project:
```python
INSTALLED_APPS = [
    ...
    "django_messages_display",
    ...
]
```

## How to use
1. Load the template tag in your template:
   ```
   {% load django_messages_display %}
   ```

2. Use the `django_messages_display` tag where you want the notifications to appear:
   ```
   {% django_messages_display %}
   ```
   A good place to add this is before the closing body tag `</body>`.

3. Load the CSS for the styling to apply:
   ```
   {% load static %}
   ...
   <head>
      ...
      <link rel="stylesheet" href="{% static 'django_messages_display/django_messages_display.css' %}">
   </head>
   ```

### Example
It is convenient to integrate django-messages-display in your base template:

```html
<!-- base.html -->
{% load static %}
{% load django_messages_display %}
...
<head>
   ...
   <link rel="stylesheet" href="{% static 'django_messages_display/django_messages_display.css' %}">
</head>
...
{% django_messages_display %}
</body>
...
```

## Configuration
To include a close button for each message, add the following to your Django settings:

```python
DJANGO_MESSAGES_DISPLAY_CLOSE_BUTTON = True
```

## Accessibility
The notifications have the relevant attributes so that screen readers announce each one without interrupting the user's flow.
Even though the notifications visually disappear after a certain amount of time, they remain in the document to be accessible by screen readers on demand.

The colors used for the notifications meet the WCAG 2.1 AA contrast levels.
