refactor(buttons): fix styles

This commit is contained in:
Alexander Zhukov 2017-06-02 16:05:11 +03:00
parent 59ef144716
commit 774fe48d65
11 changed files with 955 additions and 595 deletions

View file

@ -1,42 +1,42 @@
<div class="row">
<div class="btn-size-container col-md-4">
<div>
<div class="size-container">
<div class="header">
<span>Rectangle Button</span>
</div>
<div>
<div class="subheader">
<span>1.25rem 1.75rem</span>
</div>
<div>
<button class="btn btn-primary btn-lg">Large Button</button>
</div>
</div>
<div class="btn-size-container col-md-3">
<div>
<div class="size-container">
<div class="header">
<span>Medium Button</span>
</div>
<div>
<div class="subheader">
<span>1rem 1.5rem</span>
</div>
<div>
<button class="btn btn-primary btn-md">Medium Button</button>
</div>
</div>
<div class="btn-size-container col-md-3">
<div>
<div class="size-container">
<div class="header">
<span>Small Button</span>
</div>
<div>
<div class="subheader">
<span>0.875rem 1.5rem</span>
</div>
<div>
<button class="btn btn-primary btn-sm">Small Button</button>
</div>
</div>
<div class="btn-size-container col-md-2">
<div>
<div class="size-container">
<div class="header">
<span>Tiny Button</span>
</div>
<div>
<div class="subheader">
<span>0.625rem 1.25rem</span>
</div>
<div>

View file

@ -1,10 +1,18 @@
.btn-size-container {
div:nth-child(1) {
.row {
padding: 0 15px;
}
.size-container {
margin-right: 20px;
.header {
margin-bottom: 7px;
}
div:nth-child(2) {
.subheader {
color: #ffffff;
margin-bottom: 19px;
font-size: 0.875rem;
font-weight: 300;
}
}