You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Add Materialize CSS to your project ([Official Documentation](https://materializecss.com/getting-started.html)):
33
28
34
29
In your base.html:
35
30
@@ -74,45 +69,54 @@ $(document).ready(function(){
74
69
75
70
## Usage
76
71
77
-
Use it like this, simple.
72
+
Import the module simply like this:
78
73
79
74
```html
80
75
{% load materializecss %}
81
76
```
82
77
83
78
### Full form
84
79
80
+
Format a whole form:
81
+
85
82
```html
86
83
{{ form|materializecss }}
87
84
```
88
85
89
86
### Individual field
90
87
88
+
Format only a specific field:
89
+
91
90
```html
92
91
{{ form.<fieldname>|materializecss }}
93
92
```
94
93
95
94
### Custom size (default is 's12')
96
95
96
+
Apply custom sizes in grid ([see Materialize CSS documentation](https://materializecss.com/grid.html)):
97
97
```html
98
98
{{ form|materializecss:'m6' }}
99
99
{{ form|materializecss:'custom_size=m6' }}
100
100
```
101
101
102
102
103
103
### Icons support
104
+
104
105
This is most useful for adding a descriptive icon when you are creating a custom layout by building the form one field at a time. Substitue FIELD_NAME below with one of the field names from your form.
If you're using optional icon sets you need to set `MATERIALIZECSS_ICON_SET` in your settings file:
112
115
113
116
```python
114
117
MATERIALIZECSS_ICON_SET='fontawesome'
115
118
```
119
+
116
120
Currently [Font Awesome](https://www.fontawesome.com/) and [GLYPHICONS](https://www.glyphicons.com) is supported, however you might need to modify your CSS for full support.
0 commit comments