From 2d409c15002fde61643ff8f2f049d93d4a6e4199 Mon Sep 17 00:00:00 2001 From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com> Date: Wed, 18 Dec 2024 19:06:50 -0500 Subject: [PATCH 1/3] docs(footer): update angular to standalone --- .../basic/angular/example_component_html.md | 10 +++ .../basic/angular/example_component_ts.md | 11 +++ static/usage/v7/footer/basic/index.md | 16 ++++- .../fade/angular/example_component_html.md | 67 +++++++++++++++++++ .../fade/angular/example_component_ts.md | 11 +++ static/usage/v7/footer/fade/index.md | 16 ++++- .../angular/example_component_html.md | 10 +++ .../no-border/angular/example_component_ts.md | 11 +++ static/usage/v7/footer/no-border/index.md | 16 ++++- .../angular/example_component_html.md | 67 +++++++++++++++++++ .../angular/example_component_ts.md | 11 +++ static/usage/v7/footer/translucent/index.md | 16 ++++- .../basic/angular/example_component_html.md | 10 +++ .../basic/angular/example_component_ts.md | 11 +++ static/usage/v8/footer/basic/index.md | 16 ++++- .../fade/angular/example_component_html.md | 67 +++++++++++++++++++ .../fade/angular/example_component_ts.md | 11 +++ static/usage/v8/footer/fade/index.md | 16 ++++- .../angular/example_component_html.md | 10 +++ .../no-border/angular/example_component_ts.md | 11 +++ static/usage/v8/footer/no-border/index.md | 16 ++++- .../angular/example_component_html.md | 67 +++++++++++++++++++ .../angular/example_component_ts.md | 11 +++ static/usage/v8/footer/translucent/index.md | 16 ++++- 24 files changed, 508 insertions(+), 16 deletions(-) create mode 100644 static/usage/v7/footer/basic/angular/example_component_html.md create mode 100644 static/usage/v7/footer/basic/angular/example_component_ts.md create mode 100644 static/usage/v7/footer/fade/angular/example_component_html.md create mode 100644 static/usage/v7/footer/fade/angular/example_component_ts.md create mode 100644 static/usage/v7/footer/no-border/angular/example_component_html.md create mode 100644 static/usage/v7/footer/no-border/angular/example_component_ts.md create mode 100644 static/usage/v7/footer/translucent/angular/example_component_html.md create mode 100644 static/usage/v7/footer/translucent/angular/example_component_ts.md create mode 100644 static/usage/v8/footer/basic/angular/example_component_html.md create mode 100644 static/usage/v8/footer/basic/angular/example_component_ts.md create mode 100644 static/usage/v8/footer/fade/angular/example_component_html.md create mode 100644 static/usage/v8/footer/fade/angular/example_component_ts.md create mode 100644 static/usage/v8/footer/no-border/angular/example_component_html.md create mode 100644 static/usage/v8/footer/no-border/angular/example_component_ts.md create mode 100644 static/usage/v8/footer/translucent/angular/example_component_html.md create mode 100644 static/usage/v8/footer/translucent/angular/example_component_ts.md diff --git a/static/usage/v7/footer/basic/angular/example_component_html.md b/static/usage/v7/footer/basic/angular/example_component_html.md new file mode 100644 index 00000000000..b0506781582 --- /dev/null +++ b/static/usage/v7/footer/basic/angular/example_component_html.md @@ -0,0 +1,10 @@ +```html + +

Content

+
+ + + Footer + + +``` diff --git a/static/usage/v7/footer/basic/angular/example_component_ts.md b/static/usage/v7/footer/basic/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v7/footer/basic/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/footer/basic/index.md b/static/usage/v7/footer/basic/index.md index d9abf47d787..c63e64ffa3a 100644 --- a/static/usage/v7/footer/basic/index.md +++ b/static/usage/v7/footer/basic/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'; +

Animal Facts

+ +

Rhinoceros

+ rhino standing near grass +

+ The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the + Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the + species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while + the Javan rhino and one-horned rhino have one horn. +

+ +

Sea Turtle

+ brown sea turtle in water +

+ Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, + sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for + swimming, so they are vulnerable while on land. +

+ +

Giraffe

+ giraffe sticking its tongue out +

+ Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a + spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the + giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. +

+ +

Elephant

+ two grey elephants on grass plains during sunset +

+ Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long + trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up + water for drinking or bathing. +

+ +

Dolphin

+ black and white dolphin in water +

+ Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, + and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth + and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a + pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. +

+ + + + Footer + + +``` diff --git a/static/usage/v7/footer/fade/angular/example_component_ts.md b/static/usage/v7/footer/fade/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v7/footer/fade/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/footer/fade/index.md b/static/usage/v7/footer/fade/index.md index 47248b6f35f..b088873b046 100644 --- a/static/usage/v7/footer/fade/index.md +++ b/static/usage/v7/footer/fade/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'; +

Content

+ + + + Footer + + +``` diff --git a/static/usage/v7/footer/no-border/angular/example_component_ts.md b/static/usage/v7/footer/no-border/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v7/footer/no-border/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/footer/no-border/index.md b/static/usage/v7/footer/no-border/index.md index 61152f09bf8..c255dcf6750 100644 --- a/static/usage/v7/footer/no-border/index.md +++ b/static/usage/v7/footer/no-border/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'; +

Animal Facts

+ +

Rhinoceros

+ rhino standing near grass +

+ The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the + Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the + species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while + the Javan rhino and one-horned rhino have one horn. +

+ +

Sea Turtle

+ brown sea turtle in water +

+ Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, + sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for + swimming, so they are vulnerable while on land. +

+ +

Giraffe

+ giraffe sticking its tongue out +

+ Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a + spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the + giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. +

+ +

Elephant

+ two grey elephants on grass plains during sunset +

+ Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long + trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up + water for drinking or bathing. +

+ +

Dolphin

+ black and white dolphin in water +

+ Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, + and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth + and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a + pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. +

+ + + + Footer + + +``` diff --git a/static/usage/v7/footer/translucent/angular/example_component_ts.md b/static/usage/v7/footer/translucent/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v7/footer/translucent/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/footer/translucent/index.md b/static/usage/v7/footer/translucent/index.md index 51e731fe97e..7dd30a2d211 100644 --- a/static/usage/v7/footer/translucent/index.md +++ b/static/usage/v7/footer/translucent/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'; +

Content

+ + + + Footer + + +``` diff --git a/static/usage/v8/footer/basic/angular/example_component_ts.md b/static/usage/v8/footer/basic/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v8/footer/basic/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/footer/basic/index.md b/static/usage/v8/footer/basic/index.md index 618e0377617..af3b571296f 100644 --- a/static/usage/v8/footer/basic/index.md +++ b/static/usage/v8/footer/basic/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'; +

Animal Facts

+ +

Rhinoceros

+ rhino standing near grass +

+ The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the + Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the + species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while + the Javan rhino and one-horned rhino have one horn. +

+ +

Sea Turtle

+ brown sea turtle in water +

+ Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, + sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for + swimming, so they are vulnerable while on land. +

+ +

Giraffe

+ giraffe sticking its tongue out +

+ Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a + spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the + giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. +

+ +

Elephant

+ two grey elephants on grass plains during sunset +

+ Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long + trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up + water for drinking or bathing. +

+ +

Dolphin

+ black and white dolphin in water +

+ Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, + and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth + and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a + pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. +

+ + + + Footer + + +``` diff --git a/static/usage/v8/footer/fade/angular/example_component_ts.md b/static/usage/v8/footer/fade/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v8/footer/fade/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/footer/fade/index.md b/static/usage/v8/footer/fade/index.md index 447e7df0714..1b4e7ae6cab 100644 --- a/static/usage/v8/footer/fade/index.md +++ b/static/usage/v8/footer/fade/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'; +

Content

+ + + + Footer + + +``` diff --git a/static/usage/v8/footer/no-border/angular/example_component_ts.md b/static/usage/v8/footer/no-border/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v8/footer/no-border/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/footer/no-border/index.md b/static/usage/v8/footer/no-border/index.md index 1a564d955fe..2f20d131d63 100644 --- a/static/usage/v8/footer/no-border/index.md +++ b/static/usage/v8/footer/no-border/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'; +

Animal Facts

+ +

Rhinoceros

+ rhino standing near grass +

+ The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the + Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the + species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while + the Javan rhino and one-horned rhino have one horn. +

+ +

Sea Turtle

+ brown sea turtle in water +

+ Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, + sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for + swimming, so they are vulnerable while on land. +

+ +

Giraffe

+ giraffe sticking its tongue out +

+ Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a + spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the + giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. +

+ +

Elephant

+ two grey elephants on grass plains during sunset +

+ Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long + trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up + water for drinking or bathing. +

+ +

Dolphin

+ black and white dolphin in water +

+ Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, + and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth + and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a + pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. +

+ + + + Footer + + +``` diff --git a/static/usage/v8/footer/translucent/angular/example_component_ts.md b/static/usage/v8/footer/translucent/angular/example_component_ts.md new file mode 100644 index 00000000000..ed6db8141a7 --- /dev/null +++ b/static/usage/v8/footer/translucent/angular/example_component_ts.md @@ -0,0 +1,11 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/footer/translucent/index.md b/static/usage/v8/footer/translucent/index.md index 9ae477d67f9..1127b89a620 100644 --- a/static/usage/v8/footer/translucent/index.md +++ b/static/usage/v8/footer/translucent/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'; Date: Fri, 20 Dec 2024 15:02:13 -0500 Subject: [PATCH 2/3] docs(footer): update angular to standalone --- static/usage/v7/footer/basic/angular/example_component_ts.md | 1 + static/usage/v7/footer/fade/angular/example_component_ts.md | 1 + static/usage/v7/footer/no-border/angular/example_component_ts.md | 1 + .../usage/v7/footer/translucent/angular/example_component_ts.md | 1 + static/usage/v8/footer/basic/angular/example_component_ts.md | 1 + static/usage/v8/footer/fade/angular/example_component_ts.md | 1 + static/usage/v8/footer/no-border/angular/example_component_ts.md | 1 + .../usage/v8/footer/translucent/angular/example_component_ts.md | 1 + 8 files changed, 8 insertions(+) diff --git a/static/usage/v7/footer/basic/angular/example_component_ts.md b/static/usage/v7/footer/basic/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v7/footer/basic/angular/example_component_ts.md +++ b/static/usage/v7/footer/basic/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} diff --git a/static/usage/v7/footer/fade/angular/example_component_ts.md b/static/usage/v7/footer/fade/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v7/footer/fade/angular/example_component_ts.md +++ b/static/usage/v7/footer/fade/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} diff --git a/static/usage/v7/footer/no-border/angular/example_component_ts.md b/static/usage/v7/footer/no-border/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v7/footer/no-border/angular/example_component_ts.md +++ b/static/usage/v7/footer/no-border/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} diff --git a/static/usage/v7/footer/translucent/angular/example_component_ts.md b/static/usage/v7/footer/translucent/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v7/footer/translucent/angular/example_component_ts.md +++ b/static/usage/v7/footer/translucent/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} diff --git a/static/usage/v8/footer/basic/angular/example_component_ts.md b/static/usage/v8/footer/basic/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v8/footer/basic/angular/example_component_ts.md +++ b/static/usage/v8/footer/basic/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} diff --git a/static/usage/v8/footer/fade/angular/example_component_ts.md b/static/usage/v8/footer/fade/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v8/footer/fade/angular/example_component_ts.md +++ b/static/usage/v8/footer/fade/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} diff --git a/static/usage/v8/footer/no-border/angular/example_component_ts.md b/static/usage/v8/footer/no-border/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v8/footer/no-border/angular/example_component_ts.md +++ b/static/usage/v8/footer/no-border/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} diff --git a/static/usage/v8/footer/translucent/angular/example_component_ts.md b/static/usage/v8/footer/translucent/angular/example_component_ts.md index ed6db8141a7..bcdf570e97b 100644 --- a/static/usage/v8/footer/translucent/angular/example_component_ts.md +++ b/static/usage/v8/footer/translucent/angular/example_component_ts.md @@ -5,6 +5,7 @@ import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/stan @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], imports: [IonContent, IonFooter, IonTitle, IonToolbar], }) export class ExampleComponent {} From 384b9d1085fed9397507afdf2605d0f87b137696 Mon Sep 17 00:00:00 2001 From: Brandy Carney <6577830+brandyscarney@users.noreply.github.com> Date: Mon, 23 Dec 2024 13:59:37 -0500 Subject: [PATCH 3/3] docs(footer): update angular to standalone --- static/usage/v7/footer/basic/angular.md | 10 --- .../angular/example_component_ts.md | 12 ++++ .../v7/footer/custom-scroll-target/index.md | 2 + static/usage/v7/footer/fade/angular.md | 67 ------------------- static/usage/v7/footer/no-border/angular.md | 10 --- static/usage/v7/footer/translucent/angular.md | 67 ------------------- static/usage/v8/footer/basic/angular.md | 10 --- .../angular/example_component_ts.md | 12 ++++ .../v8/footer/custom-scroll-target/index.md | 2 + static/usage/v8/footer/fade/angular.md | 67 ------------------- static/usage/v8/footer/no-border/angular.md | 10 --- static/usage/v8/footer/translucent/angular.md | 67 ------------------- 12 files changed, 28 insertions(+), 308 deletions(-) delete mode 100644 static/usage/v7/footer/basic/angular.md create mode 100644 static/usage/v7/footer/custom-scroll-target/angular/example_component_ts.md delete mode 100644 static/usage/v7/footer/fade/angular.md delete mode 100644 static/usage/v7/footer/no-border/angular.md delete mode 100644 static/usage/v7/footer/translucent/angular.md delete mode 100644 static/usage/v8/footer/basic/angular.md create mode 100644 static/usage/v8/footer/custom-scroll-target/angular/example_component_ts.md delete mode 100644 static/usage/v8/footer/fade/angular.md delete mode 100644 static/usage/v8/footer/no-border/angular.md delete mode 100644 static/usage/v8/footer/translucent/angular.md diff --git a/static/usage/v7/footer/basic/angular.md b/static/usage/v7/footer/basic/angular.md deleted file mode 100644 index b0506781582..00000000000 --- a/static/usage/v7/footer/basic/angular.md +++ /dev/null @@ -1,10 +0,0 @@ -```html - -

Content

-
- - - Footer - - -``` diff --git a/static/usage/v7/footer/custom-scroll-target/angular/example_component_ts.md b/static/usage/v7/footer/custom-scroll-target/angular/example_component_ts.md new file mode 100644 index 00000000000..bcdf570e97b --- /dev/null +++ b/static/usage/v7/footer/custom-scroll-target/angular/example_component_ts.md @@ -0,0 +1,12 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v7/footer/custom-scroll-target/index.md b/static/usage/v7/footer/custom-scroll-target/index.md index df2b8f10214..2701ab18333 100644 --- a/static/usage/v7/footer/custom-scroll-target/index.md +++ b/static/usage/v7/footer/custom-scroll-target/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'; -

Animal Facts

- -

Rhinoceros

- rhino standing near grass -

- The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the - Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the - species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while - the Javan rhino and one-horned rhino have one horn. -

- -

Sea Turtle

- brown sea turtle in water -

- Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, - sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for - swimming, so they are vulnerable while on land. -

- -

Giraffe

- giraffe sticking its tongue out -

- Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a - spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the - giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. -

- -

Elephant

- two grey elephants on grass plains during sunset -

- Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long - trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up - water for drinking or bathing. -

- -

Dolphin

- black and white dolphin in water -

- Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, - and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth - and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a - pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. -

- - - - Footer - - -``` diff --git a/static/usage/v7/footer/no-border/angular.md b/static/usage/v7/footer/no-border/angular.md deleted file mode 100644 index 6b31b329d96..00000000000 --- a/static/usage/v7/footer/no-border/angular.md +++ /dev/null @@ -1,10 +0,0 @@ -```html - -

Content

-
- - - Footer - - -``` diff --git a/static/usage/v7/footer/translucent/angular.md b/static/usage/v7/footer/translucent/angular.md deleted file mode 100644 index a58f761cc8c..00000000000 --- a/static/usage/v7/footer/translucent/angular.md +++ /dev/null @@ -1,67 +0,0 @@ -```html - -

Animal Facts

- -

Rhinoceros

- rhino standing near grass -

- The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the - Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the - species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while - the Javan rhino and one-horned rhino have one horn. -

- -

Sea Turtle

- brown sea turtle in water -

- Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, - sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for - swimming, so they are vulnerable while on land. -

- -

Giraffe

- giraffe sticking its tongue out -

- Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a - spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the - giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. -

- -

Elephant

- two grey elephants on grass plains during sunset -

- Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long - trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up - water for drinking or bathing. -

- -

Dolphin

- black and white dolphin in water -

- Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, - and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth - and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a - pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. -

-
- - - Footer - - -``` diff --git a/static/usage/v8/footer/basic/angular.md b/static/usage/v8/footer/basic/angular.md deleted file mode 100644 index b0506781582..00000000000 --- a/static/usage/v8/footer/basic/angular.md +++ /dev/null @@ -1,10 +0,0 @@ -```html - -

Content

-
- - - Footer - - -``` diff --git a/static/usage/v8/footer/custom-scroll-target/angular/example_component_ts.md b/static/usage/v8/footer/custom-scroll-target/angular/example_component_ts.md new file mode 100644 index 00000000000..bcdf570e97b --- /dev/null +++ b/static/usage/v8/footer/custom-scroll-target/angular/example_component_ts.md @@ -0,0 +1,12 @@ +```ts +import { Component } from '@angular/core'; +import { IonContent, IonFooter, IonTitle, IonToolbar } from '@ionic/angular/standalone'; + +@Component({ + selector: 'app-example', + templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonContent, IonFooter, IonTitle, IonToolbar], +}) +export class ExampleComponent {} +``` diff --git a/static/usage/v8/footer/custom-scroll-target/index.md b/static/usage/v8/footer/custom-scroll-target/index.md index 77353e8b24c..167bab74e68 100644 --- a/static/usage/v8/footer/custom-scroll-target/index.md +++ b/static/usage/v8/footer/custom-scroll-target/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'; -

Animal Facts

- -

Rhinoceros

- rhino standing near grass -

- The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the - Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the - species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while - the Javan rhino and one-horned rhino have one horn. -

- -

Sea Turtle

- brown sea turtle in water -

- Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, - sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for - swimming, so they are vulnerable while on land. -

- -

Giraffe

- giraffe sticking its tongue out -

- Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a - spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the - giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. -

- -

Elephant

- two grey elephants on grass plains during sunset -

- Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long - trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up - water for drinking or bathing. -

- -

Dolphin

- black and white dolphin in water -

- Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, - and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth - and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a - pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. -

- - - - Footer - - -``` diff --git a/static/usage/v8/footer/no-border/angular.md b/static/usage/v8/footer/no-border/angular.md deleted file mode 100644 index 6b31b329d96..00000000000 --- a/static/usage/v8/footer/no-border/angular.md +++ /dev/null @@ -1,10 +0,0 @@ -```html - -

Content

-
- - - Footer - - -``` diff --git a/static/usage/v8/footer/translucent/angular.md b/static/usage/v8/footer/translucent/angular.md deleted file mode 100644 index a58f761cc8c..00000000000 --- a/static/usage/v8/footer/translucent/angular.md +++ /dev/null @@ -1,67 +0,0 @@ -```html - -

Animal Facts

- -

Rhinoceros

- rhino standing near grass -

- The rhinoceros gets its name from one of its most notable features: its horns. The word rhinoceros come from the - Greek words rhino meaning “nose” and ceros meaning “horn.” The number of horns that a rhino has varies on the - species. The two African species (the black rhino and the white rhino) and the Sumatran rhino have two horns, while - the Javan rhino and one-horned rhino have one horn. -

- -

Sea Turtle

- brown sea turtle in water -

- Sea turtles are characterized by a large, streamlined shell and non-retractile head and limbs. Unlike other turtles, - sea turtles cannot pull their limbs and head inside their shells. Their limbs are flippers that are adapted for - swimming, so they are vulnerable while on land. -

- -

Giraffe

- giraffe sticking its tongue out -

- Giraffes are known for their long, tall appearance. They have a small hump on their back like a camel and have a - spotted pattern similar to that of a leopard. Because of the combination of these features, some people called the - giraffe a “camel-leopard.” That’s where the giraffe’s species name “camelopardalis” comes from. -

- -

Elephant

- two grey elephants on grass plains during sunset -

- Elephants are the largest existing land animal, with massive bodies, large ears, and long trunks. Elephants’ long - trunks are multifunctional. They are used to pick up objects, trumpet warnings, greet other elephants, or suck up - water for drinking or bathing. -

- -

Dolphin

- black and white dolphin in water -

- Dolphins range in color depending on the species, from white, pearl, and pink to darker shades of brown, gray, blue, - and black. They have smooth skin, flippers, and a dorsal fin. They have a long, slender snout with about 100 teeth - and a streamlined body. They have a single blowhole on top of their head, which has a flap that opens to reveal a - pair of nostrils. The dolphin uses these nostrils for breathing when it surfaces. -

-
- - - Footer - - -```