docs(): usage and examples

This commit is contained in:
mhartington
2018-06-18 12:45:06 -04:00
parent 518594bcc4
commit 96945b1ee1
66 changed files with 809 additions and 604 deletions

View File

@ -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).

View File

@ -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;

View File

@ -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>
```