Skip to content

Commit cb3fb19

Browse files
committed
feat(html): add new snippets for ion-item, ion-list and ion-menu
1 parent 42c7ec0 commit cb3fb19

File tree

2 files changed

+151
-6
lines changed

2 files changed

+151
-6
lines changed

Diff for: README.md

+9
Original file line numberDiff line numberDiff line change
@@ -51,6 +51,14 @@ Type part of a snippet, press enter, and the snippet unfolds.
5151
| `i-form-input-error` | `<ion-item>` w/ `<ion-input>` and formControlName including error text |
5252
| `i-icon` | `<ion-icon>` |
5353
| `i-item` | `<ion-item>` w/ `<ion-label>` |
54+
| `i-item-checkbox` | `<ion-item>` w/ `<ion-checkbox>` |
55+
| `i-item-input` | `<ion-item>` w/ `<ion-input>` |
56+
| `i-item-toggle` | `<ion-item>` w/ `<ion-toggle>` |
57+
| `i-item-radio` | `<ion-item>` w/ `<ion-radio>` |
58+
| `i-list` | `<ion-item>` w/ two `<ion-item>` |
59+
| `i-list-input` | `<ion-item>` w/ two `<ion-item>` |
60+
| `i-menu` | `<ion-menu>` w/ `<ion-header>` and `<ion-content>` |
61+
| `i-menu-advanced` | `<ion-menu>` w/ `<ion-header>`, `<ion-content>` and `<ion-footer>` |
5462
| `i-menu-button` | `<ion-menu-button>` |
5563
| `i-row` | `<ion-row>` w/ `<ion-col>` |
5664
| `i-select` | `<ion-select>` w/ `<ion-select-option>` |
@@ -64,6 +72,7 @@ Type part of a snippet, press enter, and the snippet unfolds.
6472
| `i-slides` | `<ion-slides>` w/ `<ion-slide>` |
6573
| `i-spinner` | `<ion-spinner>` |
6674
| `i-split-pane` | `<ion-split-pane>` |
75+
| `i-split-pane-advanced` | `<ion-split-pane>` w/ a menu including `<ion-header>`, `<ion-content>` and `<ion-footer>` |
6776
| `i-tab` | `<ion-tab>` |
6877
| `i-tabs` | `<ion-tabs>` |
6978
| `i-text` | `<ion-text>` |

Diff for: snippets/html.json

+142-6
Original file line numberDiff line numberDiff line change
@@ -240,18 +240,129 @@
240240
"prefix": "i-item",
241241
"body": [
242242
"<ion-item>",
243-
"\t<ion-label>",
244-
"\t\t${1:Awesome Label}",
245-
"\t</ion-label>",
243+
"\t<ion-label>${1:Awesome Label}</ion-label>",
246244
"</ion-item>"
247245
],
248246
"description": "<ion-item>"
249247
},
248+
"ion-item-checkbox": {
249+
"prefix": "i-item-checkbox",
250+
"body": [
251+
"<ion-item>",
252+
"\t<ion-label>${1:Checkbox}</ion-label>",
253+
"\t<ion-checkbox slot=\"${2|start,end|}\"></ion-checkbox>",
254+
"</ion-item>"
255+
],
256+
"description": "<ion-item> w/ <ion-checkbox>"
257+
},
258+
"ion-item-input": {
259+
"prefix": "i-item-input",
260+
"body": [
261+
"<ion-item>",
262+
"\t<ion-label>${1:Input}</ion-label>",
263+
"\t<ion-input></ion-input>",
264+
"</ion-item>"
265+
],
266+
"description": "<ion-item> w/ <ion-input>"
267+
},
268+
"ion-item-toggle": {
269+
"prefix": "i-item-toggle",
270+
"body": [
271+
"<ion-item>",
272+
"\t<ion-label>${1:Toggle}</ion-label>",
273+
"\t<ion-toggle slot=\"${2|end,start|}\"></ion-toggle>",
274+
"</ion-item>"
275+
],
276+
"description": "<ion-item> w/ <ion-toggle>"
277+
},
278+
"ion-item-radio": {
279+
"prefix": "i-item-radio",
280+
"body": [
281+
"<ion-item>",
282+
"\t<ion-label>${1:Radio}</ion-label>",
283+
"\t<ion-radio slot=\"${2|end,start|}\"></ion-radio>",
284+
"</ion-item>"
285+
],
286+
"description": "<ion-item> w/ <ion-radio>"
287+
},
288+
"ion-list": {
289+
"prefix": "i-list",
290+
"body": [
291+
"<ion-list>",
292+
"\t<ion-item>",
293+
"\t\t<ion-label>${1:Peperoni}</ion-label>",
294+
"\t</ion-item>",
295+
"\t<ion-item>",
296+
"\t\t<ion-label>${1:Hawaii}</ion-label>",
297+
"\t</ion-item>",
298+
"</ion-list>"
299+
],
300+
"description": "<ion-list>"
301+
},
302+
"ion-list-input": {
303+
"prefix": "i-list-input",
304+
"body": [
305+
"<ion-list>",
306+
"\t<ion-item>",
307+
"\t\t<ion-label>${1:Input}</ion-label>",
308+
"\t\t<ion-input></ion-input>",
309+
"\t</ion-item>",
310+
"\t<ion-item>",
311+
"\t\t<ion-label>${2:Toggle}</ion-label>",
312+
"\t\t<ion-toggle slot=\"${4|end,start|}\"></ion-toggle>",
313+
"\t</ion-item>",
314+
"\t<ion-item>",
315+
"\t\t<ion-label>${5:Radio}</ion-label>",
316+
"\t\t<ion-radio slot=\"${6|end,start|}\"></ion-radio>",
317+
"\t</ion-item>",
318+
"\t<ion-item>",
319+
"\t\t<ion-label>${7:Checkbox}</ion-label>",
320+
"\t\t<ion-checkbox slot=\"${8|start,end|}\"></ion-checkbox>",
321+
"\t</ion-item>",
322+
"</ion-list>"
323+
],
324+
"description": "<ion-list>"
325+
},
326+
"ion-menu": {
327+
"prefix": "i-menu",
328+
"body": [
329+
"<ion-menu menuId=\"${1:avocadoMenu}\" side=\"${2|start,end|}\" type=\"${3|overlay,push,reveal|}\">",
330+
"\t<ion-header>",
331+
"\t\t<ion-toolbar>",
332+
"\t\t\t<ion-title>${4:Awesome avocado menu}</ion-title>",
333+
"\t\t</ion-toolbar>",
334+
"\t</ion-header>",
335+
"\t<ion-content>",
336+
"\t\t${5:Awesome avocado content}",
337+
"\t</ion-content>",
338+
"</ion-menu>"
339+
],
340+
"description": "<ion-menu> w/ <ion-header> and <ion-content>"
341+
},
342+
"ion-menu-advanced": {
343+
"prefix": "i-menu-advanced",
344+
"body": [
345+
"<ion-menu menuId=\"${1:pizzaMenu}\" side=\"${2|start,end|}\" type=\"${3|overlay,push,reveal|}\">",
346+
"\t<ion-header>",
347+
"\t\t<ion-toolbar>",
348+
"\t\t\t<ion-title>${4:Awesome pizza menu}</ion-title>",
349+
"\t\t</ion-toolbar>",
350+
"\t</ion-header>",
351+
"\t<ion-content>",
352+
"\t\t${5:Awesome pizza content}",
353+
"\t</ion-content>",
354+
"\t<ion-footer>",
355+
"\t\t${6:Awesome pizza footer}",
356+
"\t</ion-footer>",
357+
"</ion-menu>"
358+
],
359+
"description": "<ion-menu> w/ <ion-header>, <ion-content> and <ion-footer>"
360+
},
250361
"ion-menu-button": {
251362
"prefix": "i-menu-button",
252363
"body": [
253364
"<ion-buttons slot=\"${1|start,end,primary,secondary|\">",
254-
"\t<ion-menu-button></ion-menu-button>",
365+
"\t<ion-menu-button menu=\"${2|menuId,start,end|}\"></ion-menu-button>",
255366
"</ion-buttons>"
256367
],
257368
"description": "<ion-menu-button>"
@@ -356,18 +467,43 @@
356467
"prefix": "i-split-pane",
357468
"body": [
358469
"<ion-split-pane>",
359-
"\t<ion-menu>",
470+
"\t<ion-menu menuId=\"${1:avocadoMenu}\" side=\"${2|start,end|}\" type=\"${3|overlay,push,reveal|}\">",
360471
"\t\t<ion-header>",
361472
"\t\t\t<ion-toolbar>",
362-
"\t\t\t\t<ion-title>${1:Awesome Title}</ion-title>",
473+
"\t\t\t\t<ion-title>${4:Awesome avocado menu}</ion-title>",
363474
"\t\t\t</ion-toolbar>",
364475
"\t\t</ion-header>",
476+
"\t\t<ion-content>",
477+
"\t\t\t${5:Awesome avocado content}",
478+
"\t\t</ion-content>",
365479
"\t</ion-menu>",
366480
"\t<ion-router-outlet main></ion-router-outlet>",
367481
"</ion-split-pane>"
368482
],
369483
"description": "<ion-split-pane>"
370484
},
485+
"ion-split-pane-advanced": {
486+
"prefix": "i-split-pane-advanced",
487+
"body": [
488+
"<ion-split-pane>",
489+
"\t<ion-menu menuId=\"${1:avocadoMenu}\" side=\"${2|start,end|}\" type=\"${3|overlay,push,reveal|}\">",
490+
"\t\t<ion-header>",
491+
"\t\t\t<ion-toolbar>",
492+
"\t\t\t\t<ion-title>${4:Awesome avocado menu}</ion-title>",
493+
"\t\t\t</ion-toolbar>",
494+
"\t\t</ion-header>",
495+
"\t\t<ion-content>",
496+
"\t\t\t${5:Awesome avocado content}",
497+
"\t\t</ion-content>",
498+
"\t\t<ion-footer>",
499+
"\t\t\t${6:Awesome avocado footer}",
500+
"\t\t</ion-footer>",
501+
"\t</ion-menu>",
502+
"\t<ion-router-outlet main></ion-router-outlet>",
503+
"</ion-split-pane>"
504+
],
505+
"description": "<ion-split-pane> w/ one complete menu"
506+
},
371507
"ion-tab": {
372508
"prefix": "i-tab",
373509
"body": [

0 commit comments

Comments
 (0)