mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-11-08 23:58:13 +08:00
docs(): usage and examples
This commit is contained in:
@ -12,9 +12,8 @@ The text component is a simple component that can be used to style the text colo
|
||||
|
||||
string
|
||||
|
||||
The color to use from your Sass `$colors` map.
|
||||
The color to use for the text.
|
||||
Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
|
||||
For more information, see [Theming your App](/docs/theming/theming-your-app).
|
||||
|
||||
|
||||
#### mode
|
||||
@ -23,7 +22,6 @@ string
|
||||
|
||||
The mode determines which platform styles to use.
|
||||
Possible values are: `"ios"` or `"md"`.
|
||||
For more information, see [Platform Styles](/docs/theming/platform-specific-styles).
|
||||
|
||||
|
||||
## Attributes
|
||||
@ -32,9 +30,8 @@ For more information, see [Platform Styles](/docs/theming/platform-specific-styl
|
||||
|
||||
string
|
||||
|
||||
The color to use from your Sass `$colors` map.
|
||||
The color to use for the text.
|
||||
Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
|
||||
For more information, see [Theming your App](/docs/theming/theming-your-app).
|
||||
|
||||
|
||||
#### mode
|
||||
@ -43,7 +40,6 @@ string
|
||||
|
||||
The mode determines which platform styles to use.
|
||||
Possible values are: `"ios"` or `"md"`.
|
||||
For more information, see [Platform Styles](/docs/theming/platform-specific-styles).
|
||||
|
||||
|
||||
|
||||
|
||||
@ -15,16 +15,14 @@ import { Color, Mode } from '../../interface';
|
||||
export class Text {
|
||||
|
||||
/**
|
||||
* The color to use from your Sass `$colors` map.
|
||||
* The color to use for the text.
|
||||
* Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
|
||||
* For more information, see [Theming your App](/docs/theming/theming-your-app).
|
||||
*/
|
||||
@Prop() color?: Color;
|
||||
|
||||
/**
|
||||
* The mode determines which platform styles to use.
|
||||
* Possible values are: `"ios"` or `"md"`.
|
||||
* For more information, see [Platform Styles](/docs/theming/platform-specific-styles).
|
||||
*/
|
||||
@Prop() mode!: Mode;
|
||||
|
||||
|
||||
@ -1,29 +0,0 @@
|
||||
```html
|
||||
<ion-text color="secondary">
|
||||
<h1>H1: The quick brown fox jumps over the lazy dog</h1>
|
||||
</ion-text>
|
||||
|
||||
<ion-text color="primary">
|
||||
<h2>H2: The quick brown fox jumps over the lazy dog</h2>
|
||||
</ion-text>
|
||||
|
||||
<ion-text color="light">
|
||||
<h3>H3: The quick brown fox jumps over the lazy dog</h3>
|
||||
</ion-text>
|
||||
|
||||
<ion-text color="danger">
|
||||
<h4 >H4: The quick brown fox jumps over the lazy dog</h4>
|
||||
</ion-text>
|
||||
|
||||
<ion-text color="dark">
|
||||
<h5>H5: The quick brown fox jumps over the lazy dog</h5>
|
||||
</ion-text>
|
||||
|
||||
<p>
|
||||
I saw a werewolf with a Chinese menu in his hand.
|
||||
Walking through the <ion-text color="danger"><sub>streets</sub></ion-text> of Soho in the rain.
|
||||
He <ion-text color="primary"><i>was</i></ion-text> looking for a place called Lee Ho Fook's.
|
||||
Gonna get a <ion-text color="secondary"><a>big dish of beef chow mein.</a></ion-text>
|
||||
<ion-text color="danger"><ion-icon name="cut"></ion-icon></ion-text>
|
||||
</p>
|
||||
```
|
||||
Reference in New Issue
Block a user