From 92b2ee6d58d179056c177581f004d7dc3e020cd3 Mon Sep 17 00:00:00 2001 From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com> Date: Wed, 18 Dec 2024 19:06:47 -0500 Subject: [PATCH 1/3] docs(card): update angular to standalone --- .../basic/angular/example_component_html.md | 12 +++ .../basic/angular/example_component_ts.md | 11 +++ static/usage/v7/card/basic/index.md | 20 ++++- .../buttons/angular/example_component_html.md | 15 ++++ .../buttons/angular/example_component_ts.md | 18 ++++ static/usage/v7/card/buttons/index.md | 21 ++++- .../media/angular/example_component_html.md | 13 +++ .../media/angular/example_component_ts.md | 11 +++ static/usage/v7/card/media/index.md | 21 ++++- .../colors/angular/example_component_html.md | 82 +++++++++++++++++++ .../colors/angular/example_component_ts.md | 11 +++ static/usage/v7/card/theming/colors/index.md | 16 +++- .../basic/angular/example_component_html.md | 12 +++ .../basic/angular/example_component_ts.md | 11 +++ static/usage/v8/card/basic/index.md | 20 ++++- .../buttons/angular/example_component_html.md | 15 ++++ .../buttons/angular/example_component_ts.md | 18 ++++ static/usage/v8/card/buttons/index.md | 21 ++++- .../media/angular/example_component_html.md | 13 +++ .../media/angular/example_component_ts.md | 11 +++ static/usage/v8/card/media/index.md | 21 ++++- .../colors/angular/example_component_html.md | 82 +++++++++++++++++++ .../colors/angular/example_component_ts.md | 11 +++ static/usage/v8/card/theming/colors/index.md | 16 +++- 24 files changed, 486 insertions(+), 16 deletions(-) create mode 100644 static/usage/v7/card/basic/angular/example_component_html.md create mode 100644 static/usage/v7/card/basic/angular/example_component_ts.md create mode 100644 static/usage/v7/card/buttons/angular/example_component_html.md create mode 100644 static/usage/v7/card/buttons/angular/example_component_ts.md create mode 100644 static/usage/v7/card/media/angular/example_component_html.md create mode 100644 static/usage/v7/card/media/angular/example_component_ts.md create mode 100644 static/usage/v7/card/theming/colors/angular/example_component_html.md create mode 100644 static/usage/v7/card/theming/colors/angular/example_component_ts.md create mode 100644 static/usage/v8/card/basic/angular/example_component_html.md create mode 100644 static/usage/v8/card/basic/angular/example_component_ts.md create mode 100644 static/usage/v8/card/buttons/angular/example_component_html.md create mode 100644 static/usage/v8/card/buttons/angular/example_component_ts.md create mode 100644 static/usage/v8/card/media/angular/example_component_html.md create mode 100644 static/usage/v8/card/media/angular/example_component_ts.md create mode 100644 static/usage/v8/card/theming/colors/angular/example_component_html.md create mode 100644 static/usage/v8/card/theming/colors/angular/example_component_ts.md diff --git a/static/usage/v7/card/basic/angular/example_component_html.md b/static/usage/v7/card/basic/angular/example_component_html.md new file mode 100644 index 00000000000..d489fbc5e26 --- /dev/null +++ b/static/usage/v7/card/basic/angular/example_component_html.md @@ -0,0 +1,12 @@ +```html + + + Card Title + Card Subtitle + + + + Here's a small text description for the card content. Nothing more, nothing less. + + +``` diff --git a/static/usage/v7/card/basic/angular/example_component_ts.md b/static/usage/v7/card/basic/angular/example_component_ts.md new file mode 100644 index 00000000000..52fe14af463 --- /dev/null +++ b/static/usage/v7/card/basic/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/card/basic/index.md b/static/usage/v7/card/basic/index.md index 6c090f394bb..acb83e49696 100644 --- a/static/usage/v7/card/basic/index.md +++ b/static/usage/v7/card/basic/index.md @@ -3,6 +3,22 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; - +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; + + diff --git a/static/usage/v7/card/buttons/angular/example_component_html.md b/static/usage/v7/card/buttons/angular/example_component_html.md new file mode 100644 index 00000000000..c597c1dca7a --- /dev/null +++ b/static/usage/v7/card/buttons/angular/example_component_html.md @@ -0,0 +1,15 @@ +```html + + + Card Title + Card Subtitle + + + + Here's a small text description for the card content. Nothing more, nothing less. + + + Action 1 + Action 2 + +``` diff --git a/static/usage/v7/card/buttons/angular/example_component_ts.md b/static/usage/v7/card/buttons/angular/example_component_ts.md new file mode 100644 index 00000000000..7e328405c2d --- /dev/null +++ b/static/usage/v7/card/buttons/angular/example_component_ts.md @@ -0,0 +1,18 @@ +```ts +import { Component } from '@angular/core'; +import { + IonButton, + IonCard, + IonCardContent, + IonCardHeader, + IonCardSubtitle, + IonCardTitle, +} from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/card/buttons/index.md b/static/usage/v7/card/buttons/index.md index c19055f3a7f..2d837481dbe 100644 --- a/static/usage/v7/card/buttons/index.md +++ b/static/usage/v7/card/buttons/index.md @@ -3,6 +3,23 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; - +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; + + diff --git a/static/usage/v7/card/media/angular/example_component_html.md b/static/usage/v7/card/media/angular/example_component_html.md new file mode 100644 index 00000000000..2e074cd5c6d --- /dev/null +++ b/static/usage/v7/card/media/angular/example_component_html.md @@ -0,0 +1,13 @@ +```html + + Silhouette of mountains + + Card Title + Card Subtitle + + + + Here's a small text description for the card content. Nothing more, nothing less. + + +``` diff --git a/static/usage/v7/card/media/angular/example_component_ts.md b/static/usage/v7/card/media/angular/example_component_ts.md new file mode 100644 index 00000000000..52fe14af463 --- /dev/null +++ b/static/usage/v7/card/media/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/card/media/index.md b/static/usage/v7/card/media/index.md index 3d4cda0926e..a194c0c958a 100644 --- a/static/usage/v7/card/media/index.md +++ b/static/usage/v7/card/media/index.md @@ -3,6 +3,23 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; - +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; + + diff --git a/static/usage/v7/card/theming/colors/angular/example_component_html.md b/static/usage/v7/card/theming/colors/angular/example_component_html.md new file mode 100644 index 00000000000..8c3924e8365 --- /dev/null +++ b/static/usage/v7/card/theming/colors/angular/example_component_html.md @@ -0,0 +1,82 @@ +```html + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + +``` diff --git a/static/usage/v7/card/theming/colors/angular/example_component_ts.md b/static/usage/v7/card/theming/colors/angular/example_component_ts.md new file mode 100644 index 00000000000..52fe14af463 --- /dev/null +++ b/static/usage/v7/card/theming/colors/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/card/theming/colors/index.md b/static/usage/v7/card/theming/colors/index.md index 30ce310e99c..69f6a1a5d01 100644 --- a/static/usage/v7/card/theming/colors/index.md +++ b/static/usage/v7/card/theming/colors/index.md @@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; + +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; diff --git a/static/usage/v8/card/basic/angular/example_component_html.md b/static/usage/v8/card/basic/angular/example_component_html.md new file mode 100644 index 00000000000..d489fbc5e26 --- /dev/null +++ b/static/usage/v8/card/basic/angular/example_component_html.md @@ -0,0 +1,12 @@ +```html + + + Card Title + Card Subtitle + + + + Here's a small text description for the card content. Nothing more, nothing less. + + +``` diff --git a/static/usage/v8/card/basic/angular/example_component_ts.md b/static/usage/v8/card/basic/angular/example_component_ts.md new file mode 100644 index 00000000000..52fe14af463 --- /dev/null +++ b/static/usage/v8/card/basic/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/card/basic/index.md b/static/usage/v8/card/basic/index.md index 1f6c20f2705..dbd09a796c2 100644 --- a/static/usage/v8/card/basic/index.md +++ b/static/usage/v8/card/basic/index.md @@ -3,6 +3,22 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; - +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; + + diff --git a/static/usage/v8/card/buttons/angular/example_component_html.md b/static/usage/v8/card/buttons/angular/example_component_html.md new file mode 100644 index 00000000000..c597c1dca7a --- /dev/null +++ b/static/usage/v8/card/buttons/angular/example_component_html.md @@ -0,0 +1,15 @@ +```html + + + Card Title + Card Subtitle + + + + Here's a small text description for the card content. Nothing more, nothing less. + + + Action 1 + Action 2 + +``` diff --git a/static/usage/v8/card/buttons/angular/example_component_ts.md b/static/usage/v8/card/buttons/angular/example_component_ts.md new file mode 100644 index 00000000000..7e328405c2d --- /dev/null +++ b/static/usage/v8/card/buttons/angular/example_component_ts.md @@ -0,0 +1,18 @@ +```ts +import { Component } from '@angular/core'; +import { + IonButton, + IonCard, + IonCardContent, + IonCardHeader, + IonCardSubtitle, + IonCardTitle, +} from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/card/buttons/index.md b/static/usage/v8/card/buttons/index.md index 46e17cf4b1d..32789fcccbd 100644 --- a/static/usage/v8/card/buttons/index.md +++ b/static/usage/v8/card/buttons/index.md @@ -3,6 +3,23 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; - +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; + + diff --git a/static/usage/v8/card/media/angular/example_component_html.md b/static/usage/v8/card/media/angular/example_component_html.md new file mode 100644 index 00000000000..2e074cd5c6d --- /dev/null +++ b/static/usage/v8/card/media/angular/example_component_html.md @@ -0,0 +1,13 @@ +```html + + Silhouette of mountains + + Card Title + Card Subtitle + + + + Here's a small text description for the card content. Nothing more, nothing less. + + +``` diff --git a/static/usage/v8/card/media/angular/example_component_ts.md b/static/usage/v8/card/media/angular/example_component_ts.md new file mode 100644 index 00000000000..52fe14af463 --- /dev/null +++ b/static/usage/v8/card/media/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/card/media/index.md b/static/usage/v8/card/media/index.md index b8ed3cca563..c1a877371ac 100644 --- a/static/usage/v8/card/media/index.md +++ b/static/usage/v8/card/media/index.md @@ -3,6 +3,23 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; - +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; + + diff --git a/static/usage/v8/card/theming/colors/angular/example_component_html.md b/static/usage/v8/card/theming/colors/angular/example_component_html.md new file mode 100644 index 00000000000..8c3924e8365 --- /dev/null +++ b/static/usage/v8/card/theming/colors/angular/example_component_html.md @@ -0,0 +1,82 @@ +```html + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + + + + + Card Title + Card Subtitle + + + Card Content + +``` diff --git a/static/usage/v8/card/theming/colors/angular/example_component_ts.md b/static/usage/v8/card/theming/colors/angular/example_component_ts.md new file mode 100644 index 00000000000..52fe14af463 --- /dev/null +++ b/static/usage/v8/card/theming/colors/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/card/theming/colors/index.md b/static/usage/v8/card/theming/colors/index.md index 385e21c7c69..5afcf9e560a 100644 --- a/static/usage/v8/card/theming/colors/index.md +++ b/static/usage/v8/card/theming/colors/index.md @@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground'; import javascript from './javascript.md'; import react from './react.md'; import vue from './vue.md'; -import angular from './angular.md'; + +import angular_example_component_html from './angular/example_component_html.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; From 5dec361a0189818f2b5a09c3d5e11fd187731c6f Mon Sep 17 00:00:00 2001 From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com> Date: Fri, 20 Dec 2024 14:58:48 -0500 Subject: [PATCH 2/3] docs(card): update angular to standalone --- static/usage/v7/card/basic/angular/example_component_ts.md | 1 + static/usage/v7/card/buttons/angular/example_component_ts.md | 1 + static/usage/v7/card/media/angular/example_component_ts.md | 1 + .../usage/v7/card/theming/colors/angular/example_component_ts.md | 1 + static/usage/v8/card/basic/angular/example_component_ts.md | 1 + static/usage/v8/card/buttons/angular/example_component_ts.md | 1 + static/usage/v8/card/media/angular/example_component_ts.md | 1 + .../usage/v8/card/theming/colors/angular/example_component_ts.md | 1 + 8 files changed, 8 insertions(+) diff --git a/static/usage/v7/card/basic/angular/example_component_ts.md b/static/usage/v7/card/basic/angular/example_component_ts.md index 52fe14af463..d35351dd783 100644 --- a/static/usage/v7/card/basic/angular/example_component_ts.md +++ b/static/usage/v7/card/basic/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} diff --git a/static/usage/v7/card/buttons/angular/example_component_ts.md b/static/usage/v7/card/buttons/angular/example_component_ts.md index 7e328405c2d..74ee512cb4f 100644 --- a/static/usage/v7/card/buttons/angular/example_component_ts.md +++ b/static/usage/v7/card/buttons/angular/example_component_ts.md @@ -12,6 +12,7 @@ import { @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} diff --git a/static/usage/v7/card/media/angular/example_component_ts.md b/static/usage/v7/card/media/angular/example_component_ts.md index 52fe14af463..d35351dd783 100644 --- a/static/usage/v7/card/media/angular/example_component_ts.md +++ b/static/usage/v7/card/media/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} diff --git a/static/usage/v7/card/theming/colors/angular/example_component_ts.md b/static/usage/v7/card/theming/colors/angular/example_component_ts.md index 52fe14af463..d35351dd783 100644 --- a/static/usage/v7/card/theming/colors/angular/example_component_ts.md +++ b/static/usage/v7/card/theming/colors/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} diff --git a/static/usage/v8/card/basic/angular/example_component_ts.md b/static/usage/v8/card/basic/angular/example_component_ts.md index 52fe14af463..d35351dd783 100644 --- a/static/usage/v8/card/basic/angular/example_component_ts.md +++ b/static/usage/v8/card/basic/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} diff --git a/static/usage/v8/card/buttons/angular/example_component_ts.md b/static/usage/v8/card/buttons/angular/example_component_ts.md index 7e328405c2d..74ee512cb4f 100644 --- a/static/usage/v8/card/buttons/angular/example_component_ts.md +++ b/static/usage/v8/card/buttons/angular/example_component_ts.md @@ -12,6 +12,7 @@ import { @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonButton, IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} diff --git a/static/usage/v8/card/media/angular/example_component_ts.md b/static/usage/v8/card/media/angular/example_component_ts.md index 52fe14af463..d35351dd783 100644 --- a/static/usage/v8/card/media/angular/example_component_ts.md +++ b/static/usage/v8/card/media/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} diff --git a/static/usage/v8/card/theming/colors/angular/example_component_ts.md b/static/usage/v8/card/theming/colors/angular/example_component_ts.md index 52fe14af463..d35351dd783 100644 --- a/static/usage/v8/card/theming/colors/angular/example_component_ts.md +++ b/static/usage/v8/card/theming/colors/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], }) export class ExampleComponent {} From 866bb5ce2fdbd8daeb68361f5b4eb88d0f98c557 Mon Sep 17 00:00:00 2001 From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com> Date: Fri, 20 Dec 2024 16:11:22 -0500 Subject: [PATCH 3/3] docs(card): update angular to standalone --- static/usage/v7/card/basic/angular.md | 12 --- static/usage/v7/card/buttons/angular.md | 15 ---- .../card/list/angular/example_component_ts.md | 32 ++++++++ static/usage/v7/card/list/index.md | 2 + static/usage/v7/card/media/angular.md | 13 --- .../usage/v7/card/theming/colors/angular.md | 82 ------------------- .../angular/example_component_ts.md | 12 +++ .../v7/card/theming/css-properties/index.md | 2 + static/usage/v8/card/basic/angular.md | 12 --- static/usage/v8/card/buttons/angular.md | 15 ---- .../card/list/angular/example_component_ts.md | 32 ++++++++ static/usage/v8/card/list/index.md | 2 + static/usage/v8/card/media/angular.md | 13 --- .../usage/v8/card/theming/colors/angular.md | 82 ------------------- .../angular/example_component_ts.md | 12 +++ .../v8/card/theming/css-properties/index.md | 2 + 16 files changed, 96 insertions(+), 244 deletions(-) delete mode 100644 static/usage/v7/card/basic/angular.md delete mode 100644 static/usage/v7/card/buttons/angular.md create mode 100644 static/usage/v7/card/list/angular/example_component_ts.md delete mode 100644 static/usage/v7/card/media/angular.md delete mode 100644 static/usage/v7/card/theming/colors/angular.md create mode 100644 static/usage/v7/card/theming/css-properties/angular/example_component_ts.md delete mode 100644 static/usage/v8/card/basic/angular.md delete mode 100644 static/usage/v8/card/buttons/angular.md create mode 100644 static/usage/v8/card/list/angular/example_component_ts.md delete mode 100644 static/usage/v8/card/media/angular.md delete mode 100644 static/usage/v8/card/theming/colors/angular.md create mode 100644 static/usage/v8/card/theming/css-properties/angular/example_component_ts.md diff --git a/static/usage/v7/card/basic/angular.md b/static/usage/v7/card/basic/angular.md deleted file mode 100644 index d489fbc5e26..00000000000 --- a/static/usage/v7/card/basic/angular.md +++ /dev/null @@ -1,12 +0,0 @@ -```html - - - Card Title - Card Subtitle - - - - Here's a small text description for the card content. Nothing more, nothing less. - - -``` diff --git a/static/usage/v7/card/buttons/angular.md b/static/usage/v7/card/buttons/angular.md deleted file mode 100644 index c597c1dca7a..00000000000 --- a/static/usage/v7/card/buttons/angular.md +++ /dev/null @@ -1,15 +0,0 @@ -```html - - - Card Title - Card Subtitle - - - - Here's a small text description for the card content. Nothing more, nothing less. - - - Action 1 - Action 2 - -``` diff --git a/static/usage/v7/card/list/angular/example_component_ts.md b/static/usage/v7/card/list/angular/example_component_ts.md new file mode 100644 index 00000000000..204d500d316 --- /dev/null +++ b/static/usage/v7/card/list/angular/example_component_ts.md @@ -0,0 +1,32 @@ +```ts +import { Component } from '@angular/core'; +import { + IonCard, + IonCardContent, + IonCardHeader, + IonCardSubtitle, + IonCardTitle, + IonItem, + IonLabel, + IonList, + IonThumbnail, +} from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [ + IonCard, + IonCardContent, + IonCardHeader, + IonCardSubtitle, + IonCardTitle, + IonItem, + IonLabel, + IonList, + IonThumbnail, + ], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/card/list/index.md b/static/usage/v7/card/list/index.md index 3cc353476b8..6acc2c4d2a8 100644 --- a/static/usage/v7/card/list/index.md +++ b/static/usage/v7/card/list/index.md @@ -9,6 +9,7 @@ import vue from './vue.md'; import angular_example_component_html from './angular/example_component_html.md'; import angular_example_component_css from './angular/example_component_css.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; - Silhouette of mountains - - Card Title - Card Subtitle - - - - Here's a small text description for the card content. Nothing more, nothing less. - - -``` diff --git a/static/usage/v7/card/theming/colors/angular.md b/static/usage/v7/card/theming/colors/angular.md deleted file mode 100644 index 8c3924e8365..00000000000 --- a/static/usage/v7/card/theming/colors/angular.md +++ /dev/null @@ -1,82 +0,0 @@ -```html - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - -``` diff --git a/static/usage/v7/card/theming/css-properties/angular/example_component_ts.md b/static/usage/v7/card/theming/css-properties/angular/example_component_ts.md new file mode 100644 index 00000000000..d35351dd783 --- /dev/null +++ b/static/usage/v7/card/theming/css-properties/angular/example_component_ts.md @@ -0,0 +1,12 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/card/theming/css-properties/index.md b/static/usage/v7/card/theming/css-properties/index.md index cc473c03d32..2770079f8b3 100644 --- a/static/usage/v7/card/theming/css-properties/index.md +++ b/static/usage/v7/card/theming/css-properties/index.md @@ -9,6 +9,7 @@ import vue from './vue.md'; import angular_example_component_html from './angular/example_component_html.md'; import angular_example_component_css from './angular/example_component_css.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; - - Card Title - Card Subtitle - - - - Here's a small text description for the card content. Nothing more, nothing less. - - -``` diff --git a/static/usage/v8/card/buttons/angular.md b/static/usage/v8/card/buttons/angular.md deleted file mode 100644 index c597c1dca7a..00000000000 --- a/static/usage/v8/card/buttons/angular.md +++ /dev/null @@ -1,15 +0,0 @@ -```html - - - Card Title - Card Subtitle - - - - Here's a small text description for the card content. Nothing more, nothing less. - - - Action 1 - Action 2 - -``` diff --git a/static/usage/v8/card/list/angular/example_component_ts.md b/static/usage/v8/card/list/angular/example_component_ts.md new file mode 100644 index 00000000000..204d500d316 --- /dev/null +++ b/static/usage/v8/card/list/angular/example_component_ts.md @@ -0,0 +1,32 @@ +```ts +import { Component } from '@angular/core'; +import { + IonCard, + IonCardContent, + IonCardHeader, + IonCardSubtitle, + IonCardTitle, + IonItem, + IonLabel, + IonList, + IonThumbnail, +} from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [ + IonCard, + IonCardContent, + IonCardHeader, + IonCardSubtitle, + IonCardTitle, + IonItem, + IonLabel, + IonList, + IonThumbnail, + ], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/card/list/index.md b/static/usage/v8/card/list/index.md index b20109f53bb..76ad0a14e5a 100644 --- a/static/usage/v8/card/list/index.md +++ b/static/usage/v8/card/list/index.md @@ -9,6 +9,7 @@ import vue from './vue.md'; import angular_example_component_html from './angular/example_component_html.md'; import angular_example_component_css from './angular/example_component_css.md'; +import angular_example_component_ts from './angular/example_component_ts.md'; - Silhouette of mountains - - Card Title - Card Subtitle - - - - Here's a small text description for the card content. Nothing more, nothing less. - - -``` diff --git a/static/usage/v8/card/theming/colors/angular.md b/static/usage/v8/card/theming/colors/angular.md deleted file mode 100644 index 8c3924e8365..00000000000 --- a/static/usage/v8/card/theming/colors/angular.md +++ /dev/null @@ -1,82 +0,0 @@ -```html - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - - - - - Card Title - Card Subtitle - - - Card Content - -``` diff --git a/static/usage/v8/card/theming/css-properties/angular/example_component_ts.md b/static/usage/v8/card/theming/css-properties/angular/example_component_ts.md new file mode 100644 index 00000000000..d35351dd783 --- /dev/null +++ b/static/usage/v8/card/theming/css-properties/angular/example_component_ts.md @@ -0,0 +1,12 @@ +```ts +import { Component } from '@angular/core'; +import { IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonCard, IonCardContent, IonCardHeader, IonCardSubtitle, IonCardTitle], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/card/theming/css-properties/index.md b/static/usage/v8/card/theming/css-properties/index.md index 1181a8e4f6c..009a7bcddff 100644 --- a/static/usage/v8/card/theming/css-properties/index.md +++ b/static/usage/v8/card/theming/css-properties/index.md @@ -9,6 +9,7 @@ import vue from './vue.md'; import angular_example_component_html from './angular/example_component_html.md'; import angular_example_component_css from './angular/example_component_css.md'; +import angular_example_component_ts from './angular/example_component_ts.md';