| Name | django-simple-bulma JSON |
| Version |
3.0.0
JSON |
| download |
| home_page | None |
| Summary | Django application to add the Bulma CSS framework and its extensions |
| upload_time | 2025-07-29 23:09:21 |
| maintainer | None |
| docs_url | None |
| author | None |
| requires_python | >=3.12 |
| license | MIT |
| keywords |
|
| VCS |
 |
| bugtrack_url |
|
| requirements |
No requirements were recorded.
|
| Travis-CI |
No Travis.
|
| coveralls test coverage |
|
django-simple-bulma
===================
`django-simple-bulma` is a Django application that makes [Bulma](https://bulma.io)
and [Bulma-Extensions](https://wikiki.github.io/) available to use in your Django project with as little setup as
possible. The goal of this project is to make it as easy as possible to use Bulma with Django.
This project currently uses **Bulma v1.0.4**, and is automatically updated with every new release. **Version 3.0** represents a major upgrade that focuses on actively maintained extensions and Bulma 1.0+ compatibility. If a new version has come out with features you'd like to make use of, please [create an issue](https://github.com/python-discord/django-simple-bulma/issues), and we will be happy to make a release to update it.
Installation
------------
To get `django-simple-bulma`, up and running for your Django project, follow these simple steps:
- Install it from PyPI with `pip install django-simple-bulma` (or add it to
your [Pipfile](https://pipenv.readthedocs.io/en/latest/))
- In your Django projects `settings.py` file:
- Add `django_simple_bulma` to your `INSTALLED_APPS`
```python
INSTALLED_APPS = [
# ...
'django_simple_bulma',
# ...
]
```
- Add `django_simple_bulma.finders.SimpleBulmaFinder` to your `STATICFILES_FINDERS`. This normally holds two default
handlers that you will probably want to keep, so unless you have any other custom Finders, it should look like this:
```python
STATICFILES_FINDERS = [
# First add the two default Finders, since this will overwrite the default.
'django.contrib.staticfiles.finders.FileSystemFinder',
'django.contrib.staticfiles.finders.AppDirectoriesFinder',
# Now add our custom SimpleBulma one.
'django_simple_bulma.finders.SimpleBulmaFinder',
]
```
- Run `python manage.py collectstatic` command in order to build Bulma and move it to your `staticfiles` folder. Please
note that you will need to use this command every time you make a change to the configuration, as this is the only way
to rebuild the Bulma css file. If you are not using `collectstatic`
, [read up on it](https://stackoverflow.com/questions/34586114/whats-the-point-of-djangos-collectstatic)
and [start using it](https://docs.djangoproject.com/en/2.1/ref/contrib/staticfiles/).
This app works fine with [Whitenoise](http://whitenoise.evans.io/en/stable/), which is a great way to serve static
files without needing to mess with your webserver.
`django-simple-bulma` should now be working! In order to import it into your template, first load the app
with `{% load django_simple_bulma %}`, and then use the `{% bulma %}` template tag. If you're planning on using icons,
you might also want to import FontAwesome by using `{% font_awesome %}`.
```html
<head>
<!-- ... -->
{% load django_simple_bulma %}
{% bulma %}
{% font_awesome %}
<!-- ... -->
</head>
```
- You're all set! Any Bulma classes you apply should now be working!
Customization
-------------
Bulma looks nice by default, but most users will want to customize its look and feel. For this, we've provided a super
simple way to change the [Bulma variables](https://bulma.io/documentation/customize/list-of-sass-variables/) and to choose
which [Bulma extensions](https://wikiki.github.io/) you want to load into your project.
In order to do this, we'll simply create a dictionary inside your `settings.py` called `BULMA_SETTINGS`, and configure
it there. Here's an example of what that looks like:
```python
# Custom settings for django-simple-bulma
BULMA_SETTINGS = {
"extensions": [
"bulma-calendar",
"bulma-tooltip",
],
"variables": {
"primary": "#000000",
"size-1": "6rem",
},
"alt_variables": {
"primary": "#fff",
"scheme-main": "#000",
},
"output_style": "compressed",
"fontawesome_token": "e761a01be3",
}
```
You may here define any variable found on the [Bulma variables](https://bulma.io/documentation/customize/variables/)
page, and you may use any valid SASS or CSS as the value. For example, `hsl(217, 71%, 53%)` would be a valid value for a
color variable, as would `#ffff00`. Please note that any syntactically incorrect values may prevent Bulma from building
correctly, so be careful what you add here unless you know exactly what you're doing.
#### Multiple themes
If you want multiple different configurations of variables, then you should define them as separate themes. Define a new
theme by providing a key that matches the regex `\w+_variables` (e.g. `alt_variables` or `dark_variables`), unique
stylesheets will then be generated using the variables at that key.
To use these stylesheets in a template, pass the theme name to the `{% bulma %}` tag either as a
string `{% bulma 'alt' %}` or as a template variable `{% bulma theme %}`. When calling the `bulma` template
more than once in the same document (for example for implementing a dark theme switch), you will want to pass `include_js=False` to
at least one of these to prevent duplicate loading of JavaScript resources.
#### Extensions
If the `extensions` key is not found, it will default to not loading any extensions. If you want all extensions, simply
set it to the string `"all"`.
We currently support these actively maintained extensions compatible with Bulma 1.0+:
- [bulma-calendar](https://github.com/michael-hack/bulma-calendar) - Calendar and datepicker components (v7.1.1+)
- [bulma-tooltip](https://github.com/CreativeBulma/bulma-tooltip) - Tooltip components (v1.2.0+)
- [bulma-responsive-tables](https://github.com/justboil/bulma-responsive-tables) - Responsive table components for mobile-friendly tables
- [bulma-switch-control](https://github.com/justboil/bulma-switch-control) - Switch/toggle control components
- [bulma-radio](https://github.com/justboil/bulma-radio) - Enhanced radio button components
- [bulma-checkbox](https://github.com/justboil/bulma-checkbox) - Enhanced checkbox components
- [bulma-upload-control](https://github.com/justboil/bulma-upload-control) - File upload control components
**Note**: As of this version, we have streamlined our extension support to focus only on actively maintained, Bulma 1.0+ compatible extensions. Many of the previously supported extensions are no longer maintained or compatible with modern Bulma versions.
If an extension you want to use is missing, feel free
to [create an issue](https://github.com/python-discord/django-simple-bulma/issues) and we will be happy to add it.
Alternatively, add it yourself and create a pull request (
see [this pr](https://github.com/python-discord/django-simple-bulma/pull/55) for some context on how to go about doing
that).
#### CSS style
The `output_style` parameter determines the style of the resulting CSS file. It can be any of `"nested"` (default)
, `"expanded"`, `"compact"`, and `"compressed"`. It is recommended to use `"compressed"` in production as to reduce the
final file size.
#### FontAwesome
The optional `fontawesome_token` parameter allows you to specify your personal FontAwesome kit, which is necessary for
FontAwesome v6 and up. This should be set to the identifier part of your FontAwesome kit script src parameter. For
example, if your FontAwesome kit looks like this:
```html
<script src="https://kit.fontawesome.com/e761a01be3.js" crossorigin="anonymous"></script>
```
Then your `fontawesome_token` should be **e761a01be3**.
This is used by the `{% font_awesome %}` template tag to set up FontAwesome for you. If you don't specify
a `fontawesome_token`, **the template tag will still work**, but will then use an older version of FontAwesome (v5.14.0)
.
Compiling custom SCSS
------------------------
If you're writing custom SCSS for your application, `django-simple-bulma` provides a mechanism for compiling it for you.
This is provided mainly because `django-simple-bulma` may cause conflicts and issues with other tools to compile SCSS
for you.
To use this feature, please specify the `custom_scss` key when defining your `BULMA_SETTINGS`. This should be a list of
strings, containing _relative paths_ to `.scss` files to be compiled.
```python
BULMA_SETTINGS = {
"custom_scss": [
"css/base/base.scss", # This is okay
"my_app/static/css/base/base.scss", # This also is okay
"C:\Users\MainDawg\my_app\static\..." # Don't do this, though.
],
}
```
The default Django behavior when collecting static files is to keep the containing file structure for them when they're
copied over to the final staticfiles directory. We do the same thing, so all directories and subdirectories will still
be intact in your staticfiles folder after they've been collected.
Here's the strategy the finder uses:
* If your path contains `static/`, assume that the base path ends there and use the rest of the path as a relative path
to the resource.
* Use whatever Finders you have enabled in your `settings.py` to search for the file using that relative path.
* If the path is found using one of these Finders, compile it to css and collect it.
* Otherwise, raise a `ValueException` asking you to double-check the filepath.
Migration Guide: v2.x to v3.0
------------------------------
**django-simple-bulma v3.0** includes significant changes to support Bulma 1.0+ and focuses on actively maintained extensions only. This is a **breaking change** that requires migration steps.
### What's Changed
- **Bulma version**: Upgraded from v0.9.4 to v1.0+
- **Extension support**: Streamlined from 18+ extensions to 2 actively maintained extensions
- **Compatibility**: All extensions are now Bulma 1.0+ compatible and actively maintained
### Removed Extensions
The following extensions have been **removed** due to being unmaintained or incompatible with Bulma 1.0+:
- `bulma-badge`
- `bulma-carousel`
- `bulma-checkradio`
- `bulma-collapsible`
- `bulma-coolcheckboxes`
- `bulma-divider`
- `bulma-megamenu`
- `bulma-pageloader`
- `bulma-pricingtable`
- `bulma-quickview`
- `bulma-ribbon`
- `bulma-slider`
- `bulma-steps`
- `bulma-switch`
- `bulma-tagsinput`
- `bulma-timeline`
### Supported Extensions (v3.0+)
Only actively maintained, Bulma 1.0+ compatible extensions are now supported:
- **[bulma-calendar](https://github.com/michael-hack/bulma-calendar)**: Calendar and datepicker components (v7.1.1+)
- **[bulma-tooltip](https://github.com/CreativeBulma/bulma-tooltip)**: Tooltip components (v1.2.0+)
- **[bulma-responsive-tables](https://github.com/justboil/bulma-responsive-tables)**: Responsive table components for mobile-friendly tables
- **[bulma-switch-control](https://github.com/justboil/bulma-switch-control)**: Switch/toggle control components
- **[bulma-radio](https://github.com/justboil/bulma-radio)**: Enhanced radio button components
- **[bulma-checkbox](https://github.com/justboil/bulma-checkbox)**: Enhanced checkbox components
- **[bulma-upload-control](https://github.com/justboil/bulma-upload-control)**: File upload control components
## Migration Steps
### Update Your BULMA_SETTINGS
Remove any unsupported extensions from your configuration:
```python
# Before (v2.x)
BULMA_SETTINGS = {
"extensions": [
"bulma-collapsible", # ❌ No longer supported
"bulma-calendar", # ✅ Still supported (new maintained version)
"bulma-tooltip", # ✅ Still supported
"bulma-tagsinput", # ❌ No longer supported
"bulma-badge", # ❌ No longer supported
# ... other removed extensions
],
# ... other settings remain the same
}
# After (v3.0+)
BULMA_SETTINGS = {
"extensions": [
"bulma-calendar", # ✅ Updated to maintained version
"bulma-tooltip", # ✅ Updated to maintained version
"bulma-responsive-tables", # ✅ New JustBoil extension
"bulma-switch-control", # ✅ New JustBoil extension
"bulma-radio", # ✅ New JustBoil extension
"bulma-checkbox", # ✅ New JustBoil extension
"bulma-upload-control", # ✅ New JustBoil extension
],
# ... other settings remain the same
}
```
### Alternative Solutions for Removed Extensions
If you were using removed extensions, here are specific, modern alternatives that work well with Bulma:
**For form controls (checkradio, switch, slider):**
- **Custom CSS Solutions**: Use [Pretty Checkbox](https://lokesh-coder.github.io/pretty-checkbox/) (pure CSS library) or [CSS-Tricks custom checkboxes guide](https://css-tricks.com/zero-trickery-custom-radios-and-checkboxes/)
- **Modern HTML5**: Native `<input type="range">` for sliders, styled with CSS custom properties
- **Accessibility-first**: [Modern CSS Solutions for radio buttons](https://moderncss.dev/pure-css-custom-styled-radio-buttons/) with built-in accessibility
**For carousel components:**
- **[Swiper](https://swiperjs.com/)**: Modern, performant carousel with Bulma CSS compatibility
- **[Embla Carousel](https://www.embla-carousel.com/)**: Lightweight, framework-agnostic carousel library
- **[Glider.js](https://nickpiscitelli.github.io/Glider.js/)**: Fast, dependency-free carousel with responsive breakpoints
**For layout components (collapsible, steps, timeline):**
- **Collapsible**: Use Bulma's [`is-hidden` modifier](https://bulma.io/documentation/modifiers/display-responsive/) with custom JavaScript toggle functions
- **Steps**: Build with Bulma's [breadcrumb component](https://bulma.io/documentation/components/breadcrumb/) styling or custom flexbox layouts
- **Timeline**: CSS-only solutions using [flexbox utilities](https://bulma.io/documentation/helpers/flexbox-helpers/) and [Bulma's spacing helpers](https://bulma.io/documentation/helpers/spacing-helpers/)
**For UI elements (badge, ribbon, divider):**
- **Badge**: Use Bulma's [`tag` component](https://bulma.io/documentation/elements/tag/) or [`notification is-small`](https://bulma.io/documentation/elements/notification/) for badge-like elements
- **Ribbon**: CSS-only ribbon effects using `::before`/`::after` pseudo-elements with [Bulma colors](https://bulma.io/documentation/overview/colors/)
- **Divider**: Use [`hr` element](https://bulma.io/documentation/elements/other/#horizontal-rule) with custom CSS or [title component](https://bulma.io/documentation/elements/title/) styling
**For advanced components:**
- **Modal/Dropdown**: Use the built-in JavaScript helpers already included in django-simple-bulma or Bulma's [`modal`](https://bulma.io/documentation/components/modal/)/[`dropdown`](https://bulma.io/documentation/components/dropdown/) components
- **Pageloader**: CSS-only loading animations using Bulma's [`loader` mixin](https://bulma.io/documentation/elements/button/#loading-button) and custom positioning
- **Quickview**: Implement with Bulma's [`modal` component](https://bulma.io/documentation/components/modal/) and custom JavaScript
### Test Your Application
After updating your settings:
1. Run `python manage.py collectstatic` to rebuild your CSS
2. Test that your forms and UI components still work as expected
3. Verify that only supported extensions are being loaded
4. Check for any styling regressions
### Update Custom CSS (if needed)
If you have custom CSS that depends on removed extensions:
1. Remove any `@import` statements referencing removed extensions
2. Replace extension-specific classes with custom implementations
3. Test your styling changes across different screen sizes
Development
-----------
This project uses [UV](https://github.com/astral-sh/uv) for dependency management and development workflows. UV is a fast Python package manager that simplifies development setup.
### Setting up your development environment
1. **Install UV** (if you haven't already):
```bash
# On macOS and Linux
curl -LsSf https://astral.sh/uv/install.sh | sh
# On Windows
powershell -c "irm https://astral.sh/uv/install.ps1 | iex"
# Or using pip
pip install uv
```
2. **Clone the repository**:
```bash
git clone https://github.com/python-discord/django-simple-bulma.git
cd django-simple-bulma
```
3. **Install dependencies**:
```bash
# Install all dependencies including dev dependencies
uv sync --all-extras
```
### Pre-commit hooks
We use pre-commit hooks to ensure code quality. Install them with:
```bash
uv run pre-commit install
```
This will run our linting checks automatically before each commit.
Troubleshooting
---------------
- If you have the module `sass` installed, please note that it is incompatible with this project. There is a namespace
conflict between `sass` and `libsass` which will make `django-simple-bulma` crash when you attempt to do
a `collectstatic`. To solve this, just uninstall `sass` and use `libsass` instead.
If you run into any other problems with this app,
please [create an issue](https://github.com/python-discord/django-simple-bulma/issues), and I will be happy to help
you with it. You can also find me on Discord as `lemon#0001` at https://discord.gg/python.
Raw data
{
"_id": null,
"home_page": null,
"name": "django-simple-bulma",
"maintainer": null,
"docs_url": null,
"requires_python": ">=3.12",
"maintainer_email": "Python Discord <staff@pythondiscord.com>",
"keywords": null,
"author": null,
"author_email": "Python Discord <staff@pythondiscord.com>",
"download_url": "https://files.pythonhosted.org/packages/35/c9/32673432991308c8f737a6fc64405cf159225a921d414deabd632942d573/django_simple_bulma-3.0.0.tar.gz",
"platform": null,
"description": "django-simple-bulma\n===================\n`django-simple-bulma` is a Django application that makes [Bulma](https://bulma.io)\nand [Bulma-Extensions](https://wikiki.github.io/) available to use in your Django project with as little setup as\npossible. The goal of this project is to make it as easy as possible to use Bulma with Django.\n\nThis project currently uses **Bulma v1.0.4**, and is automatically updated with every new release. **Version 3.0** represents a major upgrade that focuses on actively maintained extensions and Bulma 1.0+ compatibility. If a new version has come out with features you'd like to make use of, please [create an issue](https://github.com/python-discord/django-simple-bulma/issues), and we will be happy to make a release to update it.\n\nInstallation\n------------\nTo get `django-simple-bulma`, up and running for your Django project, follow these simple steps:\n\n- Install it from PyPI with `pip install django-simple-bulma` (or add it to\n your [Pipfile](https://pipenv.readthedocs.io/en/latest/))\n- In your Django projects `settings.py` file:\n - Add `django_simple_bulma` to your `INSTALLED_APPS`\n ```python\n INSTALLED_APPS = [\n # ...\n 'django_simple_bulma',\n # ...\n ]\n ```\n - Add `django_simple_bulma.finders.SimpleBulmaFinder` to your `STATICFILES_FINDERS`. This normally holds two default\n handlers that you will probably want to keep, so unless you have any other custom Finders, it should look like this:\n ```python\n STATICFILES_FINDERS = [\n # First add the two default Finders, since this will overwrite the default.\n 'django.contrib.staticfiles.finders.FileSystemFinder',\n 'django.contrib.staticfiles.finders.AppDirectoriesFinder',\n\n # Now add our custom SimpleBulma one.\n 'django_simple_bulma.finders.SimpleBulmaFinder',\n ]\n ```\n- Run `python manage.py collectstatic` command in order to build Bulma and move it to your `staticfiles` folder. Please\n note that you will need to use this command every time you make a change to the configuration, as this is the only way\n to rebuild the Bulma css file. If you are not using `collectstatic`\n , [read up on it](https://stackoverflow.com/questions/34586114/whats-the-point-of-djangos-collectstatic)\n and [start using it](https://docs.djangoproject.com/en/2.1/ref/contrib/staticfiles/).\n\n This app works fine with [Whitenoise](http://whitenoise.evans.io/en/stable/), which is a great way to serve static\n files without needing to mess with your webserver.\n\n`django-simple-bulma` should now be working! In order to import it into your template, first load the app\nwith `{% load django_simple_bulma %}`, and then use the `{% bulma %}` template tag. If you're planning on using icons,\nyou might also want to import FontAwesome by using `{% font_awesome %}`.\n\n ```html\n<head>\n <!-- ... -->\n {% load django_simple_bulma %}\n {% bulma %}\n {% font_awesome %}\n <!-- ... -->\n</head>\n ```\n\n- You're all set! Any Bulma classes you apply should now be working!\n\nCustomization\n-------------\nBulma looks nice by default, but most users will want to customize its look and feel. For this, we've provided a super\nsimple way to change the [Bulma variables](https://bulma.io/documentation/customize/list-of-sass-variables/) and to choose\nwhich [Bulma extensions](https://wikiki.github.io/) you want to load into your project.\n\nIn order to do this, we'll simply create a dictionary inside your `settings.py` called `BULMA_SETTINGS`, and configure\nit there. Here's an example of what that looks like:\n\n```python\n# Custom settings for django-simple-bulma\nBULMA_SETTINGS = {\n \"extensions\": [\n \"bulma-calendar\",\n \"bulma-tooltip\",\n ],\n \"variables\": {\n \"primary\": \"#000000\",\n \"size-1\": \"6rem\",\n },\n \"alt_variables\": {\n \"primary\": \"#fff\",\n \"scheme-main\": \"#000\",\n },\n \"output_style\": \"compressed\",\n \"fontawesome_token\": \"e761a01be3\",\n}\n```\n\nYou may here define any variable found on the [Bulma variables](https://bulma.io/documentation/customize/variables/)\npage, and you may use any valid SASS or CSS as the value. For example, `hsl(217, 71%, 53%)` would be a valid value for a\ncolor variable, as would `#ffff00`. Please note that any syntactically incorrect values may prevent Bulma from building\ncorrectly, so be careful what you add here unless you know exactly what you're doing.\n\n#### Multiple themes\n\nIf you want multiple different configurations of variables, then you should define them as separate themes. Define a new\ntheme by providing a key that matches the regex `\\w+_variables` (e.g. `alt_variables` or `dark_variables`), unique\nstylesheets will then be generated using the variables at that key.\n\nTo use these stylesheets in a template, pass the theme name to the `{% bulma %}` tag either as a\nstring `{% bulma 'alt' %}` or as a template variable `{% bulma theme %}`. When calling the `bulma` template\nmore than once in the same document (for example for implementing a dark theme switch), you will want to pass `include_js=False` to\nat least one of these to prevent duplicate loading of JavaScript resources.\n\n#### Extensions\n\nIf the `extensions` key is not found, it will default to not loading any extensions. If you want all extensions, simply\nset it to the string `\"all\"`.\n\nWe currently support these actively maintained extensions compatible with Bulma 1.0+:\n\n- [bulma-calendar](https://github.com/michael-hack/bulma-calendar) - Calendar and datepicker components (v7.1.1+)\n- [bulma-tooltip](https://github.com/CreativeBulma/bulma-tooltip) - Tooltip components (v1.2.0+)\n- [bulma-responsive-tables](https://github.com/justboil/bulma-responsive-tables) - Responsive table components for mobile-friendly tables\n- [bulma-switch-control](https://github.com/justboil/bulma-switch-control) - Switch/toggle control components\n- [bulma-radio](https://github.com/justboil/bulma-radio) - Enhanced radio button components\n- [bulma-checkbox](https://github.com/justboil/bulma-checkbox) - Enhanced checkbox components \n- [bulma-upload-control](https://github.com/justboil/bulma-upload-control) - File upload control components\n\n**Note**: As of this version, we have streamlined our extension support to focus only on actively maintained, Bulma 1.0+ compatible extensions. Many of the previously supported extensions are no longer maintained or compatible with modern Bulma versions.\n\nIf an extension you want to use is missing, feel free\nto [create an issue](https://github.com/python-discord/django-simple-bulma/issues) and we will be happy to add it.\nAlternatively, add it yourself and create a pull request (\nsee [this pr](https://github.com/python-discord/django-simple-bulma/pull/55) for some context on how to go about doing\nthat).\n\n#### CSS style\n\nThe `output_style` parameter determines the style of the resulting CSS file. It can be any of `\"nested\"` (default)\n, `\"expanded\"`, `\"compact\"`, and `\"compressed\"`. It is recommended to use `\"compressed\"` in production as to reduce the\nfinal file size.\n\n#### FontAwesome\n\nThe optional `fontawesome_token` parameter allows you to specify your personal FontAwesome kit, which is necessary for\nFontAwesome v6 and up. This should be set to the identifier part of your FontAwesome kit script src parameter. For\nexample, if your FontAwesome kit looks like this:\n\n```html\n<script src=\"https://kit.fontawesome.com/e761a01be3.js\" crossorigin=\"anonymous\"></script>\n```\n\nThen your `fontawesome_token` should be **e761a01be3**.\n\nThis is used by the `{% font_awesome %}` template tag to set up FontAwesome for you. If you don't specify\na `fontawesome_token`, **the template tag will still work**, but will then use an older version of FontAwesome (v5.14.0)\n.\n\n\nCompiling custom SCSS\n------------------------\n\nIf you're writing custom SCSS for your application, `django-simple-bulma` provides a mechanism for compiling it for you.\nThis is provided mainly because `django-simple-bulma` may cause conflicts and issues with other tools to compile SCSS\nfor you.\n\nTo use this feature, please specify the `custom_scss` key when defining your `BULMA_SETTINGS`. This should be a list of\nstrings, containing _relative paths_ to `.scss` files to be compiled.\n\n```python\nBULMA_SETTINGS = {\n \"custom_scss\": [\n \"css/base/base.scss\", # This is okay\n \"my_app/static/css/base/base.scss\", # This also is okay\n \"C:\\Users\\MainDawg\\my_app\\static\\...\" # Don't do this, though.\n ],\n}\n```\n\nThe default Django behavior when collecting static files is to keep the containing file structure for them when they're\ncopied over to the final staticfiles directory. We do the same thing, so all directories and subdirectories will still\nbe intact in your staticfiles folder after they've been collected.\n\nHere's the strategy the finder uses:\n\n* If your path contains `static/`, assume that the base path ends there and use the rest of the path as a relative path\n to the resource.\n* Use whatever Finders you have enabled in your `settings.py` to search for the file using that relative path.\n* If the path is found using one of these Finders, compile it to css and collect it.\n* Otherwise, raise a `ValueException` asking you to double-check the filepath.\n\nMigration Guide: v2.x to v3.0\n------------------------------\n\n**django-simple-bulma v3.0** includes significant changes to support Bulma 1.0+ and focuses on actively maintained extensions only. This is a **breaking change** that requires migration steps.\n\n### What's Changed\n\n- **Bulma version**: Upgraded from v0.9.4 to v1.0+\n- **Extension support**: Streamlined from 18+ extensions to 2 actively maintained extensions\n- **Compatibility**: All extensions are now Bulma 1.0+ compatible and actively maintained\n\n### Removed Extensions\n\nThe following extensions have been **removed** due to being unmaintained or incompatible with Bulma 1.0+:\n\n- `bulma-badge`\n- `bulma-carousel`\n- `bulma-checkradio`\n- `bulma-collapsible`\n- `bulma-coolcheckboxes`\n- `bulma-divider`\n- `bulma-megamenu`\n- `bulma-pageloader`\n- `bulma-pricingtable`\n- `bulma-quickview`\n- `bulma-ribbon`\n- `bulma-slider`\n- `bulma-steps`\n- `bulma-switch`\n- `bulma-tagsinput`\n- `bulma-timeline`\n\n### Supported Extensions (v3.0+)\n\nOnly actively maintained, Bulma 1.0+ compatible extensions are now supported:\n\n- **[bulma-calendar](https://github.com/michael-hack/bulma-calendar)**: Calendar and datepicker components (v7.1.1+)\n- **[bulma-tooltip](https://github.com/CreativeBulma/bulma-tooltip)**: Tooltip components (v1.2.0+)\n- **[bulma-responsive-tables](https://github.com/justboil/bulma-responsive-tables)**: Responsive table components for mobile-friendly tables\n- **[bulma-switch-control](https://github.com/justboil/bulma-switch-control)**: Switch/toggle control components\n- **[bulma-radio](https://github.com/justboil/bulma-radio)**: Enhanced radio button components\n- **[bulma-checkbox](https://github.com/justboil/bulma-checkbox)**: Enhanced checkbox components \n- **[bulma-upload-control](https://github.com/justboil/bulma-upload-control)**: File upload control components\n\n\n## Migration Steps\n\n### Update Your BULMA_SETTINGS\n\nRemove any unsupported extensions from your configuration:\n\n```python\n# Before (v2.x)\nBULMA_SETTINGS = {\n \"extensions\": [\n \"bulma-collapsible\", # \u274c No longer supported\n \"bulma-calendar\", # \u2705 Still supported (new maintained version)\n \"bulma-tooltip\", # \u2705 Still supported \n \"bulma-tagsinput\", # \u274c No longer supported\n \"bulma-badge\", # \u274c No longer supported\n # ... other removed extensions\n ],\n # ... other settings remain the same\n}\n\n# After (v3.0+)\nBULMA_SETTINGS = {\n \"extensions\": [\n \"bulma-calendar\", # \u2705 Updated to maintained version\n \"bulma-tooltip\", # \u2705 Updated to maintained version\n \"bulma-responsive-tables\", # \u2705 New JustBoil extension\n \"bulma-switch-control\", # \u2705 New JustBoil extension\n \"bulma-radio\", # \u2705 New JustBoil extension\n \"bulma-checkbox\", # \u2705 New JustBoil extension\n \"bulma-upload-control\", # \u2705 New JustBoil extension\n ],\n # ... other settings remain the same\n}\n```\n\n### Alternative Solutions for Removed Extensions\n\nIf you were using removed extensions, here are specific, modern alternatives that work well with Bulma:\n\n**For form controls (checkradio, switch, slider):**\n- **Custom CSS Solutions**: Use [Pretty Checkbox](https://lokesh-coder.github.io/pretty-checkbox/) (pure CSS library) or [CSS-Tricks custom checkboxes guide](https://css-tricks.com/zero-trickery-custom-radios-and-checkboxes/)\n- **Modern HTML5**: Native `<input type=\"range\">` for sliders, styled with CSS custom properties\n- **Accessibility-first**: [Modern CSS Solutions for radio buttons](https://moderncss.dev/pure-css-custom-styled-radio-buttons/) with built-in accessibility\n\n**For carousel components:**\n- **[Swiper](https://swiperjs.com/)**: Modern, performant carousel with Bulma CSS compatibility\n- **[Embla Carousel](https://www.embla-carousel.com/)**: Lightweight, framework-agnostic carousel library \n- **[Glider.js](https://nickpiscitelli.github.io/Glider.js/)**: Fast, dependency-free carousel with responsive breakpoints\n\n**For layout components (collapsible, steps, timeline):**\n- **Collapsible**: Use Bulma's [`is-hidden` modifier](https://bulma.io/documentation/modifiers/display-responsive/) with custom JavaScript toggle functions\n- **Steps**: Build with Bulma's [breadcrumb component](https://bulma.io/documentation/components/breadcrumb/) styling or custom flexbox layouts\n- **Timeline**: CSS-only solutions using [flexbox utilities](https://bulma.io/documentation/helpers/flexbox-helpers/) and [Bulma's spacing helpers](https://bulma.io/documentation/helpers/spacing-helpers/)\n\n**For UI elements (badge, ribbon, divider):**\n- **Badge**: Use Bulma's [`tag` component](https://bulma.io/documentation/elements/tag/) or [`notification is-small`](https://bulma.io/documentation/elements/notification/) for badge-like elements\n- **Ribbon**: CSS-only ribbon effects using `::before`/`::after` pseudo-elements with [Bulma colors](https://bulma.io/documentation/overview/colors/)\n- **Divider**: Use [`hr` element](https://bulma.io/documentation/elements/other/#horizontal-rule) with custom CSS or [title component](https://bulma.io/documentation/elements/title/) styling\n\n**For advanced components:**\n- **Modal/Dropdown**: Use the built-in JavaScript helpers already included in django-simple-bulma or Bulma's [`modal`](https://bulma.io/documentation/components/modal/)/[`dropdown`](https://bulma.io/documentation/components/dropdown/) components\n- **Pageloader**: CSS-only loading animations using Bulma's [`loader` mixin](https://bulma.io/documentation/elements/button/#loading-button) and custom positioning\n- **Quickview**: Implement with Bulma's [`modal` component](https://bulma.io/documentation/components/modal/) and custom JavaScript\n\n### Test Your Application\n\nAfter updating your settings:\n\n1. Run `python manage.py collectstatic` to rebuild your CSS\n2. Test that your forms and UI components still work as expected\n3. Verify that only supported extensions are being loaded\n4. Check for any styling regressions\n\n### Update Custom CSS (if needed)\n\nIf you have custom CSS that depends on removed extensions:\n\n1. Remove any `@import` statements referencing removed extensions\n2. Replace extension-specific classes with custom implementations\n3. Test your styling changes across different screen sizes\n\n\nDevelopment\n-----------\n\nThis project uses [UV](https://github.com/astral-sh/uv) for dependency management and development workflows. UV is a fast Python package manager that simplifies development setup.\n\n### Setting up your development environment\n\n1. **Install UV** (if you haven't already):\n ```bash\n # On macOS and Linux\n curl -LsSf https://astral.sh/uv/install.sh | sh\n\n # On Windows\n powershell -c \"irm https://astral.sh/uv/install.ps1 | iex\"\n\n # Or using pip\n pip install uv\n ```\n\n2. **Clone the repository**:\n ```bash\n git clone https://github.com/python-discord/django-simple-bulma.git\n cd django-simple-bulma\n ```\n\n3. **Install dependencies**:\n ```bash\n # Install all dependencies including dev dependencies\n uv sync --all-extras\n ```\n\n### Pre-commit hooks\n\nWe use pre-commit hooks to ensure code quality. Install them with:\n\n```bash\nuv run pre-commit install\n```\n\nThis will run our linting checks automatically before each commit.\n\nTroubleshooting\n---------------\n\n- If you have the module `sass` installed, please note that it is incompatible with this project. There is a namespace\n conflict between `sass` and `libsass` which will make `django-simple-bulma` crash when you attempt to do\n a `collectstatic`. To solve this, just uninstall `sass` and use `libsass` instead.\n\nIf you run into any other problems with this app,\nplease [create an issue](https://github.com/python-discord/django-simple-bulma/issues), and I will be happy to help\nyou with it. You can also find me on Discord as `lemon#0001` at https://discord.gg/python.\n",
"bugtrack_url": null,
"license": "MIT",
"summary": "Django application to add the Bulma CSS framework and its extensions",
"version": "3.0.0",
"project_urls": {
"Homepage": "https://github.com/python-discord/django-simple-bulma",
"Issues": "https://github.com/python-discord/django-simple-bulma/issues",
"Repository": "https://github.com/python-discord/django-simple-bulma"
},
"split_keywords": [],
"urls": [
{
"comment_text": null,
"digests": {
"blake2b_256": "dfbe220b2e0343c05d6a9ee1bc57b390f3900514ffd0f02f94bdc38b2a124db2",
"md5": "e12f231dacf8528dd08a13fe5f88bd02",
"sha256": "8ccb008abc06118aff9c8a10fc3d0c13d3bca02ff7644b0ca6b0d49a5d28f2f2"
},
"downloads": -1,
"filename": "django_simple_bulma-3.0.0-py3-none-any.whl",
"has_sig": false,
"md5_digest": "e12f231dacf8528dd08a13fe5f88bd02",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": ">=3.12",
"size": 61817648,
"upload_time": "2025-07-29T23:09:15",
"upload_time_iso_8601": "2025-07-29T23:09:15.474423Z",
"url": "https://files.pythonhosted.org/packages/df/be/220b2e0343c05d6a9ee1bc57b390f3900514ffd0f02f94bdc38b2a124db2/django_simple_bulma-3.0.0-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": null,
"digests": {
"blake2b_256": "35c932673432991308c8f737a6fc64405cf159225a921d414deabd632942d573",
"md5": "73c0a3e0fd755d332693160aa6c7c747",
"sha256": "3769c45ac3f33d9ee2cb65f5cfca3b717c89009f431554ef19d6b17cdaf23e3e"
},
"downloads": -1,
"filename": "django_simple_bulma-3.0.0.tar.gz",
"has_sig": false,
"md5_digest": "73c0a3e0fd755d332693160aa6c7c747",
"packagetype": "sdist",
"python_version": "source",
"requires_python": ">=3.12",
"size": 58433139,
"upload_time": "2025-07-29T23:09:21",
"upload_time_iso_8601": "2025-07-29T23:09:21.098403Z",
"url": "https://files.pythonhosted.org/packages/35/c9/32673432991308c8f737a6fc64405cf159225a921d414deabd632942d573/django_simple_bulma-3.0.0.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2025-07-29 23:09:21",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "python-discord",
"github_project": "django-simple-bulma",
"travis_ci": false,
"coveralls": true,
"github_actions": true,
"lcname": "django-simple-bulma"
}
