desy-html 4.1.2 → 5.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +0 -2
- package/docs/_include.template-header.njk +50 -49
- package/docs/ds/_ds.example.header.njk +1 -1
- package/docs/ds/_ds.example.menubar-en-uso.njk +6 -18
- package/docs/ds/_ds.example.menubar-variaciones.njk +51 -121
- package/docs/index.html +32 -2
- package/package.json +1 -1
- package/src/js/desy-html.js +63 -4
- package/src/templates/components/alert/_template.alert.njk +2 -2
- package/src/templates/components/checkboxes/_examples.checkboxes.njk +22 -0
- package/src/templates/components/checkboxes/_template.checkboxes.njk +4 -3
- package/src/templates/components/checkboxes/params.checkboxes.yaml +8 -0
- package/src/templates/components/dropdown/_styles.dropdown.css +1 -0
- package/src/templates/components/dropdown/params.dropdown.yaml +6 -6
- package/src/templates/components/header/_examples.header.njk +23 -3
- package/src/templates/components/header/_template.header.header__dropdown.njk +17 -18
- package/src/templates/components/header/_template.header.header__subnav.njk +20 -23
- package/src/templates/components/header/_template.header.njk +48 -40
- package/src/templates/components/header/params.header.yaml +44 -4
- package/src/templates/components/menu-horizontal/_examples.menu-horizontal.njk +2 -1
- package/src/templates/components/menu-horizontal/_template.menu-horizontal.njk +1 -1
- package/src/templates/components/menubar/_examples.menubar.njk +349 -143
- package/src/templates/components/menubar/_styles.menubar.css +1 -0
- package/src/templates/components/menubar/_template.menubar.njk +2 -2
- package/src/templates/components/menubar/params.menubar.yaml +8 -0
package/README.md
CHANGED
|
@@ -6,8 +6,6 @@ If you need a more powerful library based on this, use it's Angular port instead
|
|
|
6
6
|
|
|
7
7
|
See live examples of desy-html components: [https://desy.aragon.es/](https://desy.aragon.es/)
|
|
8
8
|
|
|
9
|
-
See live page templates using desy-html here: [https://desy.aragon.es/pages/desy-html-templates](https://desy.aragon.es/pages/desy-html-templates)
|
|
10
|
-
|
|
11
9
|
### How to set up? ###
|
|
12
10
|
|
|
13
11
|
* Run `npm install` first.
|
|
@@ -1,13 +1,14 @@
|
|
|
1
1
|
{% from "components/header/_macro.header.njk" import componentHeader %}
|
|
2
2
|
|
|
3
3
|
{% call componentHeader({
|
|
4
|
+
homepageUrl: "index.html",
|
|
4
5
|
classes: "relative z-40",
|
|
5
6
|
expandedLogo: true,
|
|
6
7
|
navigation: {
|
|
7
8
|
classes: "hidden lg:block",
|
|
8
9
|
items: [
|
|
9
10
|
{
|
|
10
|
-
text: "
|
|
11
|
+
text: "Inicio",
|
|
11
12
|
href: "index.html"
|
|
12
13
|
},
|
|
13
14
|
{
|
|
@@ -40,7 +41,7 @@
|
|
|
40
41
|
idPrefix: "navegacion-principal-offcanvas",
|
|
41
42
|
items: [
|
|
42
43
|
{
|
|
43
|
-
text: "
|
|
44
|
+
text: "Inicio",
|
|
44
45
|
href: "index.html"
|
|
45
46
|
},
|
|
46
47
|
{
|
|
@@ -66,191 +67,191 @@
|
|
|
66
67
|
idPrefix: "navegacion-ejemplos-offcanvas",
|
|
67
68
|
items: [
|
|
68
69
|
{
|
|
69
|
-
href: "
|
|
70
|
+
href: "examples-accordion.html",
|
|
70
71
|
text: "Accordion"
|
|
71
72
|
},
|
|
72
73
|
{
|
|
73
|
-
href: "
|
|
74
|
+
href: "examples-alert.html",
|
|
74
75
|
text: "Alert"
|
|
75
76
|
},
|
|
76
77
|
{
|
|
77
|
-
href: "
|
|
78
|
+
href: "examples-breadcrumbs.html",
|
|
78
79
|
text: "Breadcrumbs"
|
|
79
80
|
},
|
|
80
81
|
{
|
|
81
|
-
href: "
|
|
82
|
+
href: "examples-button.html",
|
|
82
83
|
text: "Button"
|
|
83
84
|
},
|
|
84
85
|
{
|
|
85
|
-
href: "
|
|
86
|
+
href: "examples-button-loader.html",
|
|
86
87
|
text: "Button loader"
|
|
87
88
|
},
|
|
88
89
|
{
|
|
89
|
-
href: "
|
|
90
|
+
href: "examples-character-count.html",
|
|
90
91
|
text: "Character count"
|
|
91
92
|
},
|
|
92
93
|
{
|
|
93
|
-
href: "
|
|
94
|
+
href: "examples-checkboxes.html",
|
|
94
95
|
text: "Checkboxes"
|
|
95
96
|
},
|
|
96
97
|
{
|
|
97
|
-
href: "
|
|
98
|
+
href: "examples-collapsible.html",
|
|
98
99
|
text: "Collapsible"
|
|
99
100
|
},
|
|
100
101
|
{
|
|
101
|
-
href: "
|
|
102
|
+
href: "examples-dialog.html",
|
|
102
103
|
text: "Dialog"
|
|
103
104
|
},
|
|
104
105
|
{
|
|
105
|
-
href: "
|
|
106
|
+
href: "examples-date-input.html",
|
|
106
107
|
text: "Date input"
|
|
107
108
|
},
|
|
108
109
|
{
|
|
109
|
-
href: "
|
|
110
|
+
href: "examples-description-list.html",
|
|
110
111
|
text: "Description list"
|
|
111
112
|
},
|
|
112
113
|
{
|
|
113
|
-
href: "
|
|
114
|
+
href: "examples-details.html",
|
|
114
115
|
text: "Details"
|
|
115
116
|
},
|
|
116
117
|
{
|
|
117
|
-
href: "
|
|
118
|
+
href: "examples-dropdown.html",
|
|
118
119
|
text: "Dropdown"
|
|
119
120
|
},
|
|
120
121
|
{
|
|
121
|
-
href: "
|
|
122
|
+
href: "examples-error-message.html",
|
|
122
123
|
text: "Error message"
|
|
123
124
|
},
|
|
124
125
|
{
|
|
125
|
-
href: "
|
|
126
|
+
href: "examples-error-summary.html",
|
|
126
127
|
text: "Error summary"
|
|
127
128
|
},
|
|
128
129
|
{
|
|
129
|
-
href: "
|
|
130
|
+
href: "examples-fieldset.html",
|
|
130
131
|
text: "Fieldset"
|
|
131
132
|
},
|
|
132
133
|
{
|
|
133
|
-
href: "
|
|
134
|
+
href: "examples-file-upload.html",
|
|
134
135
|
text: "File upload"
|
|
135
136
|
},
|
|
136
137
|
{
|
|
137
|
-
href: "
|
|
138
|
+
href: "examples-footer.html",
|
|
138
139
|
text: "Footer"
|
|
139
140
|
},
|
|
140
141
|
{
|
|
141
|
-
href: "
|
|
142
|
+
href: "examples-header.html",
|
|
142
143
|
text: "Header"
|
|
143
144
|
},
|
|
144
145
|
{
|
|
145
|
-
href: "
|
|
146
|
+
href: "examples-hint.html",
|
|
146
147
|
text: "Hint"
|
|
147
148
|
},
|
|
148
149
|
{
|
|
149
|
-
href: "
|
|
150
|
+
href: "examples-input.html",
|
|
150
151
|
text: "Input"
|
|
151
152
|
},
|
|
152
153
|
{
|
|
153
|
-
href: "
|
|
154
|
+
href: "examples-input-group.html",
|
|
154
155
|
text: "Input group"
|
|
155
156
|
},
|
|
156
157
|
{
|
|
157
|
-
href: "
|
|
158
|
+
href: "examples-item.html",
|
|
158
159
|
text: "Item"
|
|
159
160
|
},
|
|
160
161
|
{
|
|
161
|
-
href: "
|
|
162
|
+
href: "examples-label.html",
|
|
162
163
|
text: "Label"
|
|
163
164
|
},
|
|
164
165
|
{
|
|
165
|
-
href: "
|
|
166
|
+
href: "examples-listbox.html",
|
|
166
167
|
text: "Listbox"
|
|
167
168
|
},
|
|
168
169
|
{
|
|
169
|
-
href: "
|
|
170
|
+
href: "examples-listbox.html",
|
|
170
171
|
text: "Listbox"
|
|
171
172
|
},
|
|
172
173
|
{
|
|
173
|
-
href: "
|
|
174
|
+
href: "examples-media-object.html",
|
|
174
175
|
text: "Media object"
|
|
175
176
|
},
|
|
176
177
|
{
|
|
177
|
-
href: "
|
|
178
|
+
href: "examples-menu-horizontal.html",
|
|
178
179
|
text: "Menu horizontal"
|
|
179
180
|
},
|
|
180
181
|
{
|
|
181
|
-
href: "
|
|
182
|
+
href: "examples-menu-vertical.html",
|
|
182
183
|
text: "Menu vertical"
|
|
183
184
|
},
|
|
184
185
|
{
|
|
185
|
-
href: "
|
|
186
|
+
href: "examples-menubar.html",
|
|
186
187
|
text: "Menubar"
|
|
187
188
|
},
|
|
188
189
|
{
|
|
189
|
-
href: "
|
|
190
|
+
href: "examples-modal.html",
|
|
190
191
|
text: "Modal"
|
|
191
192
|
},
|
|
192
193
|
{
|
|
193
|
-
href: "
|
|
194
|
+
href: "examples-nav.html",
|
|
194
195
|
text: "Nav"
|
|
195
196
|
},
|
|
196
197
|
{
|
|
197
|
-
href: "
|
|
198
|
+
href: "examples-notification.html",
|
|
198
199
|
text: "Notification"
|
|
199
200
|
},
|
|
200
201
|
{
|
|
201
|
-
href: "
|
|
202
|
+
href: "examples-pagination.html",
|
|
202
203
|
text: "Pagination"
|
|
203
204
|
},
|
|
204
205
|
{
|
|
205
|
-
href: "
|
|
206
|
+
href: "examples-pill.html",
|
|
206
207
|
text: "Pill"
|
|
207
208
|
},
|
|
208
209
|
{
|
|
209
|
-
href: "
|
|
210
|
+
href: "examples-radios.html",
|
|
210
211
|
text: "Radios"
|
|
211
212
|
},
|
|
212
213
|
{
|
|
213
|
-
href: "
|
|
214
|
+
href: "examples-searchbar.html",
|
|
214
215
|
text: "Searchbar"
|
|
215
216
|
},
|
|
216
217
|
{
|
|
217
|
-
href: "
|
|
218
|
+
href: "examples-select.html",
|
|
218
219
|
text: "Select"
|
|
219
220
|
},
|
|
220
221
|
{
|
|
221
|
-
href: "
|
|
222
|
+
href: "examples-skip-link.html",
|
|
222
223
|
text: "Skip link"
|
|
223
224
|
},
|
|
224
225
|
{
|
|
225
|
-
href: "
|
|
226
|
+
href: "examples-spinner.html",
|
|
226
227
|
text: "Spinner"
|
|
227
228
|
},
|
|
228
229
|
{
|
|
229
|
-
href: "
|
|
230
|
+
href: "examples-status.html",
|
|
230
231
|
text: "Status"
|
|
231
232
|
},
|
|
232
233
|
{
|
|
233
|
-
href: "
|
|
234
|
+
href: "examples-status-item.html",
|
|
234
235
|
text: "Status item"
|
|
235
236
|
},
|
|
236
237
|
{
|
|
237
|
-
href: "
|
|
238
|
+
href: "examples-table.html",
|
|
238
239
|
text: "Table"
|
|
239
240
|
},
|
|
240
241
|
{
|
|
241
|
-
href: "
|
|
242
|
+
href: "examples-table-advanced.html",
|
|
242
243
|
text: "Table advanced"
|
|
243
244
|
},
|
|
244
245
|
{
|
|
245
|
-
href: "
|
|
246
|
+
href: "examples-tabs.html",
|
|
246
247
|
text: "Tabs"
|
|
247
248
|
},
|
|
248
249
|
{
|
|
249
|
-
href: "
|
|
250
|
+
href: "examples-textarea.html",
|
|
250
251
|
text: "Textarea"
|
|
251
252
|
},
|
|
252
253
|
{
|
|
253
|
-
href: "
|
|
254
|
+
href: "examples-tooltip.html",
|
|
254
255
|
text: "Tooltip"
|
|
255
256
|
}],
|
|
256
257
|
attributes: {
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
{{ componentMenubar({
|
|
10
10
|
"id": "filter-items",
|
|
11
11
|
"idPrefix": "filter-example",
|
|
12
|
-
"ariaLabel":"
|
|
12
|
+
"ariaLabel":"Filtrar y ordenar items de la lista",
|
|
13
13
|
"items": [
|
|
14
14
|
{
|
|
15
15
|
"text": "Estados y trámites",
|
|
@@ -101,10 +101,7 @@
|
|
|
101
101
|
}
|
|
102
102
|
]
|
|
103
103
|
}
|
|
104
|
-
]
|
|
105
|
-
"attributes": {
|
|
106
|
-
"aria-labelledby": "filter-example-item-2"
|
|
107
|
-
}
|
|
104
|
+
]
|
|
108
105
|
}
|
|
109
106
|
},
|
|
110
107
|
{
|
|
@@ -197,10 +194,7 @@
|
|
|
197
194
|
"role": "menuitemcheckbox",
|
|
198
195
|
"text": "Tramitación íntegra digital"
|
|
199
196
|
}
|
|
200
|
-
]
|
|
201
|
-
"attributes": {
|
|
202
|
-
"aria-labelledby": "filter-example-item-3"
|
|
203
|
-
}
|
|
197
|
+
]
|
|
204
198
|
}
|
|
205
199
|
},
|
|
206
200
|
{
|
|
@@ -218,7 +212,7 @@
|
|
|
218
212
|
"items": [
|
|
219
213
|
{
|
|
220
214
|
"role": "group",
|
|
221
|
-
"
|
|
215
|
+
"ariaLabel": "Tipo de ordenación",
|
|
222
216
|
"items": [
|
|
223
217
|
{
|
|
224
218
|
"role": "menuitemradio",
|
|
@@ -239,18 +233,12 @@
|
|
|
239
233
|
}
|
|
240
234
|
]
|
|
241
235
|
}
|
|
242
|
-
]
|
|
243
|
-
"attributes": {
|
|
244
|
-
"aria-labelledby": "filter-example-item-4"
|
|
245
|
-
}
|
|
236
|
+
]
|
|
246
237
|
},
|
|
247
238
|
"classes": "c-menubar__button--sm mb-sm"
|
|
248
239
|
}
|
|
249
240
|
],
|
|
250
|
-
"classes": "c-menubar--last-right"
|
|
251
|
-
"attributes": {
|
|
252
|
-
"aria-label": "Filtrar items de la lista de Servicios"
|
|
253
|
-
}
|
|
241
|
+
"classes": "c-menubar--last-right"
|
|
254
242
|
}) }}
|
|
255
243
|
</div>
|
|
256
244
|
</div>
|