refactor(button): adds shape prop

This commit is contained in:
Manu Mtz.-Almeida
2018-05-11 17:50:53 +02:00
parent 34ae9045b7
commit 859ff45bb7
6 changed files with 56 additions and 53 deletions

View File

@@ -37,8 +37,8 @@
<ion-button expand="full" color="secondary" size="large">Full + Large</ion-button>
</p>
<p>
<ion-button expand="block" round>Block + Round</ion-button>
<ion-button expand="full" round>Full + Round</ion-button>
<ion-button expand="block" shape="round">Block + Round</ion-button>
<ion-button expand="full" shape="round">Full + Round</ion-button>
</p>
</ion-content>

View File

@@ -16,32 +16,32 @@
</ion-header>
<ion-content id="content" padding text-center no-bounce>
<ion-button round>Default</ion-button>
<ion-button round color="primary">Primary</ion-button>
<ion-button round color="secondary">Secondary</ion-button>
<ion-button round color="tertiary">Tertiary</ion-button>
<ion-button round color="success">Success</ion-button>
<ion-button round color="warning">Warning</ion-button>
<ion-button round color="danger">Danger</ion-button>
<ion-button round color="light">Light</ion-button>
<ion-button round color="medium">Medium</ion-button>
<ion-button round color="dark">Dark</ion-button>
<ion-button shape="round">Default</ion-button>
<ion-button shape="round" color="primary">Primary</ion-button>
<ion-button shape="round" color="secondary">Secondary</ion-button>
<ion-button shape="round" color="tertiary">Tertiary</ion-button>
<ion-button shape="round" color="success">Success</ion-button>
<ion-button shape="round" color="warning">Warning</ion-button>
<ion-button shape="round" color="danger">Danger</ion-button>
<ion-button shape="round" color="light">Light</ion-button>
<ion-button shape="round" color="medium">Medium</ion-button>
<ion-button shape="round" color="dark">Dark</ion-button>
<ion-button fill="outline" round>Default</ion-button>
<ion-button fill="outline" round color="primary">Primary</ion-button>
<ion-button fill="outline" round color="secondary">Secondary</ion-button>
<ion-button fill="outline" round color="tertiary">Tertiary</ion-button>
<ion-button fill="outline" round color="success">Success</ion-button>
<ion-button fill="outline" round color="warning">Warning</ion-button>
<ion-button fill="outline" round color="danger">Danger</ion-button>
<ion-button fill="outline" round color="light">Light</ion-button>
<ion-button fill="outline" round color="medium">Medium</ion-button>
<ion-button fill="outline" round color="dark">Dark</ion-button>
<ion-button fill="outline" shape="round">Default</ion-button>
<ion-button fill="outline" shape="round" color="primary">Primary</ion-button>
<ion-button fill="outline" shape="round" color="secondary">Secondary</ion-button>
<ion-button fill="outline" shape="round" color="tertiary">Tertiary</ion-button>
<ion-button fill="outline" shape="round" color="success">Success</ion-button>
<ion-button fill="outline" shape="round" color="warning">Warning</ion-button>
<ion-button fill="outline" shape="round" color="danger">Danger</ion-button>
<ion-button fill="outline" shape="round" color="light">Light</ion-button>
<ion-button fill="outline" shape="round" color="medium">Medium</ion-button>
<ion-button fill="outline" shape="round" color="dark">Dark</ion-button>
<ion-button round fill="clear">Clear</ion-button>
<ion-button round expand="block" color="danger">Block</ion-button>
<ion-button round expand="full" color="dark">Full</ion-button>
<ion-button round strong>Strong</ion-button>
<ion-button shape="round" fill="clear">Clear</ion-button>
<ion-button shape="round" expand="block" color="danger">Block</ion-button>
<ion-button shape="round" expand="full" color="dark">Full</ion-button>
<ion-button shape="round" strong>Strong</ion-button>
</ion-content>
</ion-app>

View File

@@ -21,7 +21,7 @@
<p><ion-button strong fill="clear">Clear</ion-button></p>
<p><ion-button strong expand="block" color="danger">Block</ion-button></p>
<p><ion-button strong expand="full" color="dark">Full</ion-button></p>
<p><ion-button strong round>Strong</ion-button></p>
<p><ion-button strong shape="round">Strong</ion-button></p>
</ion-content>
</ion-app>