update Button style

This commit is contained in:
梁灏 2019-09-12 15:21:37 +08:00
parent aaa7e9927c
commit df6bf15242
4 changed files with 122 additions and 60 deletions

View file

@ -1,14 +1,18 @@
<template>
<div>
<Button icon="logo-github" size="small" shape="circle"></Button>
<Button icon="logo-github" size="large" shape="circle"></Button>
<Button icon="logo-github" shape="circle"></Button>
<Button icon="logo-github" size="large" shape="circle"></Button>
<Button icon="logo-github" size="small"></Button>
<Button size="small">EN</Button>
<Button icon="logo-github"></Button>
<Button>EN</Button>
<Button icon="logo-github" size="large"></Button>
<Button size="large">EN</Button>
<ButtonGroup size="small">
<Button icon="logo-github"></Button>
<Button icon="logo-twitter"></Button>
@ -16,13 +20,15 @@
EN
</Button>
</ButtonGroup>
<ButtonGroup>
<Button icon="logo-github"></Button>
<Button icon="logo-twitter"></Button>
<Button>
EN
ENs
</Button>
</ButtonGroup>
<ButtonGroup size="large">
<Button icon="logo-github"></Button>
<Button icon="logo-twitter"></Button>
@ -155,8 +161,8 @@
</Button>
</Button-group>
<Button-group>
<Button type="primary" icon="ios-skipbackward"></Button>
<Button type="primary" icon="ios-skipforward"></Button>
<Button type="primary" icon="ios-skip-backward"></Button>
<Button type="primary" icon="ios-skip-forward"></Button>
</Button-group>
<Button-group>
<Button type="default" icon="ios-color-wand-outline"></Button>
@ -178,8 +184,8 @@
</Button>
</Button-group>
<Button-group shape="circle">
<Button type="primary" icon="ios-skipbackward"></Button>
<Button type="primary" icon="ios-skipforward"></Button>
<Button type="primary" icon="ios-skip-backward"></Button>
<Button type="primary" icon="ios-skip-forward"></Button>
</Button-group>
<Button-group shape="circle">
<Button type="default" icon="ios-color-wand-outline"></Button>
@ -223,6 +229,24 @@
<br><br>
<Button to="/icon">Open New Window</Button>
<br><br><br>
<ButtonGroup vertical size="small">
<Button icon="logo-facebook"></Button>
<Button icon="logo-twitter"></Button>
<Button icon="logo-googleplus"></Button>
<Button icon="logo-tumblr"></Button>
</ButtonGroup>
<ButtonGroup vertical>
<Button icon="logo-facebook"></Button>
<Button icon="logo-twitter"></Button>
<Button icon="logo-googleplus"></Button>
<Button icon="logo-tumblr"></Button>
</ButtonGroup>
<ButtonGroup vertical size="large">
<Button icon="logo-facebook"></Button>
<Button icon="logo-twitter"></Button>
<Button icon="logo-googleplus"></Button>
<Button icon="logo-tumblr"></Button>
</ButtonGroup>
</div>
</template>
<script>
@ -525,4 +549,4 @@
.i-icon-financial_fill:before { content: "\e765"; }
.i-icon-commodity:before { content: "\e766"; }
</style>
</style>