Skip to main content

Django template styling for Girder-4 applications.

Project description

django-girder-style

PyPI

django-girder-style is a Django library providing Django template styling for Girder-4 applications.

Benefits

django-girder-style provides an extensible block-oriented base HTML template. This base template includes a pre-built Tailwind CSS (with some minor customizations) stylesheet, Remix Icon support, and the Nunito font.

Additionally, django-girder-style provides styled versions of all django-allauth view templates. This styling allows some limited branding customization as well.

Installation

Install django-girder-style:

pip install django-girder-style

Enable django-girder-style as an installed Django app:

# settings.py
INSTALLED_APPS = [
    # Any project-local apps should come before "girder_style",
    # so templates can be overridden as needed
    'my_django_app.apps.MyDjangoAppConfig',
    ...,
    'girder_style',
    ...,
    # If "allauth" is installed, it must come after "girder_style"
    'allauth',
    'allauth.account',
    'allauth.socialaccount',
]

Usage

Base Template

All project templates should extend girder_style/base.html. This provides the following blocks to inject content:

  • head_title: The content of the <title> tag.
  • head_extra: Additional HTML placed within the <head> tag.
  • body: The entire HTML body content, including the <body> tag itself.

For example, a template my_app/home.html may contain:

{% extends 'girder_style/base.html' %}

{% block head_title %}My App{% endblock %}

{% block head_extra %}
<script src="https://cdn.jsdelivr.net/npm/jquery@3.6.0/dist/jquery.min.js"></script>
{% endblock %}

{% block body %}
<body>
  <div style="font-bold">Hello World.</div>
  <i class="ri-hearts-fill"></i>
</body>
{% endblock %}

All basic Tailwind CSS classes are available for use in templates extending girder_style/base.html, as illustrated in the example above. No additional configuration of Tailwind CSS is required (or possible). For a full list of the additional Tailwind CSS customizations applied by django-girder-style, see the Tailwind CSS confile file and the stylesheet.

The Remix Icon library is also available in the same way. Icons are typically used by adding an <i class="ri-... element, but see the Remix Icon documentation for full usage information.

django-allauth Templates

When django-girder-style is properly installed with django-allauth, templates will automatically be overridden with styled alternatives.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Files for django-girder-style, version 0.6.0
Filename, size File type Python version Upload date Hashes
Filename, size django_girder_style-0.6.0-py3-none-any.whl (454.9 kB) File type Wheel Python version py3 Upload date Hashes View
Filename, size django-girder-style-0.6.0.tar.gz (432.1 kB) File type Source Python version None Upload date Hashes View

Supported by

AWS AWS Cloud computing Datadog Datadog Monitoring Facebook / Instagram Facebook / Instagram PSF Sponsor Fastly Fastly CDN Google Google Object Storage and Download Analytics Huawei Huawei PSF Sponsor Microsoft Microsoft PSF Sponsor NVIDIA NVIDIA PSF Sponsor Pingdom Pingdom Monitoring Salesforce Salesforce PSF Sponsor Sentry Sentry Error logging StatusPage StatusPage Status page