This commit is contained in:
piensaenpixel 2016-01-26 12:16:40 +01:00
parent b5d5bc2a78
commit c1143441eb

View File

@ -5,19 +5,19 @@
# Buttons/Primary
```
<button class="CDB-Button CDB-Button--primary is-medium">
<button class="CDB-Button CDB-Button--primary">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary CDB-Button--small">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary is-mini">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary is-mini is-disabled">
<button class="CDB-Button CDB-Button--primary CDB-Button--small is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
@ -26,19 +26,19 @@
<br/>
<div style="background: #2E3C43; padding: 20px;">
<button class="CDB-Button CDB-Button--primary is-medium">
<button class="CDB-Button CDB-Button--primary">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary CDB-Button--small">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary is-mini">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--primary is-mini is-disabled">
<button class="CDB-Button CDB-Button--primary CDB-Button--small is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
</div>
@ -56,9 +56,6 @@
border-radius: 4px;
cursor: pointer;
&.is-mini {
padding: 5px 12px;
}
.CDB-Button-Text {
display: block;
}
@ -68,6 +65,10 @@
}
}
.CDB-Button--small {
padding: 5px 12px;
}
.CDB-Button--primary {
background: $cBlue;
color: $cWhite;
@ -98,19 +99,19 @@
# Buttons/Secondary
```
<button class="CDB-Button CDB-Button--secondary is-medium">
<button class="CDB-Button CDB-Button--secondary">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary CDB-Button--small">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary is-mini">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary is-mini is-disabled">
<button class="CDB-Button CDB-Button--secondary CDB-Button--small is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
@ -119,19 +120,19 @@
<br/>
<div style="background: #2E3C43; padding: 20px;">
<button class="CDB-Button CDB-Button--secondary is-medium">
<button class="CDB-Button CDB-Button--secondary">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-medium">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary CDB-Button--small">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary is-mini">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
<button class="CDB-Button CDB-Button--secondary is-mini is-disabled">
<button class="CDB-Button CDB-Button--secondary CDB-Button--small is-disabled">
<span class="CDB-Button-Text Text is-semibold Size-small">SAVE</span>
</button>
</div>