ボタン
uc-btn
クラスを指定することで、ボタンを作成することができます。
1. 基本
基本となるボタンを作成します。
Button
<div class="uc-btn"><a href="#">Button</a></div>
<button class="uc-btn"><span>Button</span></button>
<!-- It can be used in `a` tag. -->
<div class="uc-btn"><span>Button</span></div>
2. カラーバリエーション
状況に応じて使い分けることができるよう、豊富なバリエーションを用意しています。
<div class="uc-btn _ghost"><a href="#">Ghost</a></div>
<div class="uc-btn _primary"><a href="#">Primary</a></div>
<div class="uc-btn _secondary"><a href="">Secondary</a></div>
<div class="uc-btn _success"><a href="">Success</a></div>
<div class="uc-btn _danger"><a href="">Danger</a></div>
<div class="uc-btn _warning"><a href="">Warning</a></div>
<div class="uc-btn _disabled"><span>Disabled</span></div>
3. ボタンの横幅を最大化
_full
クラスを指定することで、ボタンの横幅を最大値に指定することができます。
<div class="uc-btn _full"><a href="#">Button</a></div>