Skip to main content Skip to docs navigation
View on GitHub

Bootstrap Buttons

On this page

Simple Button

scala 
div.withContents {
  BSBtn().BtnPrimary.lbl("Example Button").onclick(JS.alert("clicked!")).btn
}

Button styles


scala 
div.withContents {
  (BSBtn().BtnPrimary.lbl("Style Primary").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnSecondary.lbl("Style Secondary").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnInfo.lbl("Style Info").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnDanger.lbl("Style Danger").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnDark.lbl("Style Dark").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnLight.lbl("Style Light").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnSuccess.lbl("Style Success").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnWarning.lbl("Style Warning").sm.btn.ms_2.mb_2 ++
    <br/> ++
    BSBtn().BtnOutlineDanger.lbl("Style Danger Outline").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnOutlineDark.lbl("Style Dark Outline").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnOutlineInfo.lbl("Style Info Outline").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnOutlineLight.lbl("Style Light Outline").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnOutlinePrimary.lbl("Style Primary Outline").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnOutlineSecondary.lbl("Style Secondary Outline").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnOutlineSuccess.lbl("Style Success Outline").sm.btn.ms_2.mb_2 ++
    BSBtn().BtnOutlineWarning.lbl("Style Warning Outline").sm.btn.ms_2.mb_2)
}

Button sizes

scala 
BSBtn().BtnPrimary.lbl("Size lg").lg.btn.ms_2 ++
  BSBtn().BtnPrimary.lbl("Size normal").btn.ms_2 ++
  BSBtn().BtnPrimary.lbl("Size sm").sm.btn.ms_2