add possibility links to buttons
This commit is contained in:
parent
b0ac3dfc85
commit
319acb105d
@ -8,32 +8,59 @@ Layout Component:
|
|||||||
[CDB-Button][CDB-Button--primary | CDB-Button--secondary]
|
[CDB-Button][CDB-Button--primary | CDB-Button--secondary]
|
||||||
|
|
||||||
```
|
```
|
||||||
|
<a href="#" class="CDB-Button CDB-Button--primary CDB-Button--big">
|
||||||
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-medium">SAVE</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
<button class="CDB-Button CDB-Button--primary CDB-Button--big">
|
<button class="CDB-Button CDB-Button--primary CDB-Button--big">
|
||||||
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-medium">SAVE</span>
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-medium">SAVE</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
<a href="#" class="CDB-Button CDB-Button--primary CDB-Button--big is-disabled">
|
||||||
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-medium">SAVE</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
<button class="CDB-Button CDB-Button--primary CDB-Button--big is-disabled">
|
<button class="CDB-Button CDB-Button--primary CDB-Button--big is-disabled">
|
||||||
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-medium">SAVE</span>
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-medium">SAVE</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
|
||||||
|
<a href="#" class="CDB-Button CDB-Button--primary">
|
||||||
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
<button class="CDB-Button CDB-Button--primary">
|
<button class="CDB-Button CDB-Button--primary">
|
||||||
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
<a href="#" class="CDB-Button CDB-Button--primary is-disabled">
|
||||||
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
<button class="CDB-Button CDB-Button--primary is-disabled">
|
<button class="CDB-Button CDB-Button--primary is-disabled">
|
||||||
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
<a href="#" class="CDB-Button CDB-Button--primary CDB-Button--small">
|
||||||
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
<button class="CDB-Button CDB-Button--primary CDB-Button--small">
|
<button class="CDB-Button CDB-Button--primary CDB-Button--small">
|
||||||
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
<a href="#" class="CDB-Button CDB-Button--primary CDB-Button--small is-disabled">
|
||||||
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
|
</a>
|
||||||
|
|
||||||
<button class="CDB-Button CDB-Button--primary CDB-Button--small is-disabled">
|
<button class="CDB-Button CDB-Button--primary CDB-Button--small is-disabled">
|
||||||
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
<span class="CDB-Button-Text CDB-Text is-semibold CDB-Size-small">SAVE</span>
|
||||||
</button>
|
</button>
|
||||||
|
|
||||||
|
<a href="#" class="CDB-Button CDB-Button--primary CDB-Button--icon">
|
||||||
|
<i class="CDB-IconFont CDB-IconFont-ray CDB-Size-small"></i>
|
||||||
|
</a>
|
||||||
|
|
||||||
<button class="CDB-Button CDB-Button--primary CDB-Button--icon">
|
<button class="CDB-Button CDB-Button--primary CDB-Button--icon">
|
||||||
<i class="CDB-IconFont CDB-IconFont-ray CDB-Size-small"></i>
|
<i class="CDB-IconFont CDB-IconFont-ray CDB-Size-small"></i>
|
||||||
</button>
|
</button>
|
||||||
@ -83,6 +110,7 @@ Layout Component:
|
|||||||
|
|
||||||
|
|
||||||
.CDB-Button {
|
.CDB-Button {
|
||||||
|
display: inline-block;
|
||||||
padding: $baseSize + 1 $baseSize + 12;
|
padding: $baseSize + 1 $baseSize + 12;
|
||||||
border: 1px solid transparent;
|
border: 1px solid transparent;
|
||||||
border-radius: $baseSize / 2;
|
border-radius: $baseSize / 2;
|
||||||
@ -131,6 +159,14 @@ Layout Component:
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.CDB-Button--primary:link {
|
||||||
|
color: $cWhite;
|
||||||
|
}
|
||||||
|
|
||||||
|
.CDB-Button--primary:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
// Buttons styles
|
// Buttons styles
|
||||||
|
Loading…
Reference in New Issue
Block a user