76 lines
2.4 KiB
Plaintext
76 lines
2.4 KiB
Plaintext
# Buttons Dropdown
|
|
# Button dropdown - Bootstrap 4
|
|
snippet btndd
|
|
<div class="btn-group">
|
|
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
Action
|
|
</button>
|
|
<div class="dropdown-menu">
|
|
<a class="dropdown-item" href="${1:#}">${2:Action}</a>
|
|
<a class="dropdown-item" href="${1:#}">${2:Another action}</a>
|
|
<a class="dropdown-item" href="${1:#}">${2:Something else here}</a>
|
|
<div class="dropdown-divider"></div>
|
|
<a class="dropdown-item" href="${1:#}">${2:Separated link}</a>
|
|
</div>
|
|
</div>
|
|
endsnippet
|
|
|
|
|
|
# Button dropdown (Split button) - Bootstrap 4
|
|
snippet btndds
|
|
<div class="btn-group">
|
|
<button type="button" class="btn btn-danger">Action</button>
|
|
<button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
<span class="sr-only">Toggle Dropdown</span>
|
|
</button>
|
|
<div class="dropdown-menu">
|
|
<a class="dropdown-item" href="${1:#}">${2:Action}</a>
|
|
<a class="dropdown-item" href="${1:#}">${2:Another action}</a>
|
|
<a class="dropdown-item" href="${1:#}">${2:Something else here}</a>
|
|
<div class="dropdown-divider"></div>
|
|
<a class="dropdown-item" href="${1:#}">${2:Separated link}</a>
|
|
</div>
|
|
</div>
|
|
endsnippet
|
|
|
|
|
|
# Button dropdown (Large) - Bootstrap 4
|
|
snippet btnddlg
|
|
<div class="btn-group">
|
|
<button class="btn btn-secondary btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
Large button
|
|
</button>
|
|
<div class="dropdown-menu">
|
|
${1:...}
|
|
</div>
|
|
</div>
|
|
endsnippet
|
|
|
|
|
|
# Button dropdown (Small) - Bootstrap 4
|
|
snippet btnddsm
|
|
<div class="btn-group">
|
|
<button class="btn btn-secondary btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
Small button
|
|
</button>
|
|
<div class="dropdown-menu">
|
|
${1:...}
|
|
</div>
|
|
</div>
|
|
endsnippet
|
|
|
|
|
|
# Button dropup - Bootstrap 4
|
|
snippet btndu
|
|
<div class="btn-group dropup">
|
|
<button type="button" class="btn btn-secondary">Dropup</button>
|
|
<button type="button" class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
<span class="sr-only">Toggle Dropdown</span>
|
|
</button>
|
|
<div class="dropdown-menu">
|
|
${1:<!-- Dropdown menu links -->}
|
|
</div>
|
|
</div>
|
|
endsnippet
|
|
|