javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-10 00:27:41 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs(): update usage and examples

Browse Source
This commit is contained in:
mhartington
2018-05-30 16:51:54 -04:00
parent 62755f3824
commit 89a7d169e9
31 changed files with 694 additions and 445 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
core/src/components/item-divider/item-divider.tsx
View File

@ -1,7 +1,6 @@
import { Component, Element, Prop } from '@stencil/core';
import { Color, Mode } from '../../interface';
@Component({
tag: 'ion-item-divider',
styleUrls: {
@ -16,16 +15,13 @@ export class ItemDivider {
@Element() el!: HTMLElement;
/**
* The color to use from your Sass `$colors` map.
* 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).
* The color to use for the item-divider
*/
@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;
@ -42,12 +38,12 @@ export class ItemDivider {
render() {
return [
<slot name="start"></slot>,
<slot name="start" />,
<div class="item-divider-inner">
<div class="item-divider-wrapper">
<slot></slot>
<slot />
</div>
<slot name="end"></slot>
<slot name="end" />
</div>
];
}

12
core/src/components/item-divider/readme.md
View File

@ -1,6 +1,6 @@
# ion-item-divider
Item Divider is divider component for list items.
<!-- Auto Generated Below -->
@ -11,9 +11,7 @@
string
The color to use from your Sass `$colors` map.
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).
The color to use for the item-divider
#### mode
@ -22,7 +20,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
@ -31,9 +28,7 @@ For more information, see [Platform Styles](/docs/theming/platform-specific-styl
string
The color to use from your Sass `$colors` map.
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).
The color to use for the item-divider
#### mode
@ -42,7 +37,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).

16
core/src/components/item-divider/usage/javascript.md Normal file
View File

@ -0,0 +1,16 @@
```html
<ion-list>
<ion-item-divider>Section A</ion-item-divider>
<ion-item>A1</ion-item>
<ion-item>A2</ion-item>
<ion-item>A3</ion-item>
<ion-item>A4</ion-item>
<ion-item>A5</ion-item>
<ion-item-divider>Section B</ion-item-divider>
<ion-item>B1</ion-item>
<ion-item>B2</ion-item>
<ion-item>B3</ion-item>
<ion-item>B4</ion-item>
<ion-item>B5</ion-item>
</ion-list>
```