Skip to content

Commit 6dfecd2

Browse files
brandyscarneybrandyscarney
committed
docs(list-header): update angular to standalone
1 parent c5926f0 commit 6dfecd2

24 files changed

+428
-16
lines changed

‎static/usage/v7/list-header/basic/angular/example_component_html.md‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
```html
2+
<ion-list>
3+
<ion-list-header>
4+
<ion-label>Video Games</ion-label>
5+
</ion-list-header>
6+
<ion-item>
7+
<ion-label>Pokémon Yellow</ion-label>
8+
</ion-item>
9+
<ion-item>
10+
<ion-label>Mega Man X</ion-label>
11+
</ion-item>
12+
<ion-item>
13+
<ion-label>The Legend of Zelda</ion-label>
14+
</ion-item>
15+
<ion-item>
16+
<ion-label>Pac-Man</ion-label>
17+
</ion-item>
18+
<ion-item>
19+
<ion-label>Super Mario World</ion-label>
20+
</ion-item>
21+
</ion-list>
22+
```

‎static/usage/v7/list-header/basic/angular/example_component_ts.md‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonItem, IonLabel, IonList, IonListHeader } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonItem, IonLabel, IonList, IonListHeader],
9+
})
10+
export class ExampleComponent {}
11+
```

‎static/usage/v7/list-header/basic/index.md‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground';
33
import javascript from './javascript.md';
44
import react from './react.md';
55
import vue from './vue.md';
6-
import angular from './angular.md';
6+
7+
import angular_example_component_html from './angular/example_component_html.md';
8+
import angular_example_component_ts from './angular/example_component_ts.md';
79

810
<Playground
911
version="7"
10-
code={{ javascript, react, vue, angular }}
12+
code={{
13+
javascript,
14+
react,
15+
vue,
16+
angular: {
17+
files: {
18+
'src/app/example.component.html': angular_example_component_html,
19+
'src/app/example.component.ts': angular_example_component_ts,
20+
},
21+
},
22+
}}
1123
src="usage/v7/list-header/basic/demo.html"
1224
size="325px"
1325
/>

‎static/usage/v7/list-header/buttons/angular/example_component_html.md‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
```html
2+
<ion-list>
3+
<ion-list-header>
4+
<ion-label>Video Games</ion-label>
5+
<ion-button>See All</ion-button>
6+
</ion-list-header>
7+
<ion-item>
8+
<ion-label>Pokémon Yellow</ion-label>
9+
</ion-item>
10+
<ion-item>
11+
<ion-label>Mega Man X</ion-label>
12+
</ion-item>
13+
<ion-item>
14+
<ion-label>The Legend of Zelda</ion-label>
15+
</ion-item>
16+
<ion-item>
17+
<ion-label>Pac-Man</ion-label>
18+
</ion-item>
19+
<ion-item>
20+
<ion-label>Super Mario World</ion-label>
21+
</ion-item>
22+
</ion-list>
23+
```

‎static/usage/v7/list-header/buttons/angular/example_component_ts.md‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonButton, IonItem, IonLabel, IonList, IonListHeader } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonButton, IonItem, IonLabel, IonList, IonListHeader],
9+
})
10+
export class ExampleComponent {}
11+
```

‎static/usage/v7/list-header/buttons/index.md‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground';
33
import javascript from './javascript.md';
44
import react from './react.md';
55
import vue from './vue.md';
6-
import angular from './angular.md';
6+
7+
import angular_example_component_html from './angular/example_component_html.md';
8+
import angular_example_component_ts from './angular/example_component_ts.md';
79

810
<Playground
911
version="7"
10-
code={{ javascript, react, vue, angular }}
12+
code={{
13+
javascript,
14+
react,
15+
vue,
16+
angular: {
17+
files: {
18+
'src/app/example.component.html': angular_example_component_html,
19+
'src/app/example.component.ts': angular_example_component_ts,
20+
},
21+
},
22+
}}
1123
src="usage/v7/list-header/buttons/demo.html"
1224
size="325px"
1325
/>

‎static/usage/v7/list-header/lines/angular/example_component_html.md‎

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
```html
2+
<ion-list>
3+
<ion-list-header>
4+
<ion-label>Default</ion-label>
5+
</ion-list-header>
6+
<ion-item>
7+
<ion-label>Item</ion-label>
8+
</ion-item>
9+
<ion-item>
10+
<ion-label>Item</ion-label>
11+
</ion-item>
12+
</ion-list>
13+
14+
<ion-list>
15+
<ion-list-header lines="inset">
16+
<ion-label>Inset</ion-label>
17+
</ion-list-header>
18+
<ion-item>
19+
<ion-label>Item</ion-label>
20+
</ion-item>
21+
<ion-item>
22+
<ion-label>Item</ion-label>
23+
</ion-item>
24+
</ion-list>
25+
26+
<ion-list>
27+
<ion-list-header lines="full">
28+
<ion-label>Full</ion-label>
29+
</ion-list-header>
30+
<ion-item>
31+
<ion-label>Item</ion-label>
32+
</ion-item>
33+
<ion-item>
34+
<ion-label>Item</ion-label>
35+
</ion-item>
36+
</ion-list>
37+
```

‎static/usage/v7/list-header/lines/angular/example_component_ts.md‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonItem, IonLabel, IonList, IonListHeader } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonItem, IonLabel, IonList, IonListHeader],
9+
})
10+
export class ExampleComponent {}
11+
```

‎static/usage/v7/list-header/lines/index.md‎

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground';
33
import javascript from './javascript.md';
44
import react from './react.md';
55
import vue from './vue.md';
6-
import angular from './angular.md';
6+
7+
import angular_example_component_html from './angular/example_component_html.md';
8+
import angular_example_component_ts from './angular/example_component_ts.md';
79

810
<Playground
911
version="7"
10-
code={{ javascript, react, vue, angular }}
12+
code={{
13+
javascript,
14+
react,
15+
vue,
16+
angular: {
17+
files: {
18+
'src/app/example.component.html': angular_example_component_html,
19+
'src/app/example.component.ts': angular_example_component_ts,
20+
},
21+
},
22+
}}
1123
src="usage/v7/list-header/lines/demo.html"
1224
size="500px"
1325
/>

‎static/usage/v7/list-header/theming/colors/angular/example_component_html.md‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
```html
2+
<ion-list-header>
3+
<ion-label>Default</ion-label>
4+
</ion-list-header>
5+
<ion-list-header color="primary">
6+
<ion-label>Primary</ion-label>
7+
</ion-list-header>
8+
<ion-list-header color="secondary">
9+
<ion-label>Secondary</ion-label>
10+
</ion-list-header>
11+
<ion-list-header color="tertiary">
12+
<ion-label>Tertiary</ion-label>
13+
</ion-list-header>
14+
<ion-list-header color="success">
15+
<ion-label>Success</ion-label>
16+
</ion-list-header>
17+
<ion-list-header color="warning">
18+
<ion-label>Warning</ion-label>
19+
</ion-list-header>
20+
<ion-list-header color="danger">
21+
<ion-label>Danger</ion-label>
22+
</ion-list-header>
23+
<ion-list-header color="light">
24+
<ion-label>Light</ion-label>
25+
</ion-list-header>
26+
<ion-list-header color="medium">
27+
<ion-label>Medium</ion-label>
28+
</ion-list-header>
29+
<ion-list-header color="dark">
30+
<ion-label>Dark</ion-label>
31+
</ion-list-header>
32+
```

0 commit comments

Comments
 (0)