1 module uim.bootstrap.bs5.demos.components.closebuttons; 2 3 import uim.bootstrap; 4 5 static this() { 6 demoBS5.pages("basic/components/closebuttons", new class DH5AppPage { 7 this() { 8 super(); 9 this 10 .created(DateTime(2020, 12, 20, 10, 10, 0)) 11 .changed(timeLastModified(__FILE_FULL_PATH__)) 12 .parameters([ 13 "pageTitle": "Close Buttons - Bootstrap 5 Demo", 14 ]); 15 } 16 17 override string content() { 18 19 auto defaultExample = demoBs5Example("default", "Default", 20 H5Div( 21 BS5Alert(["alert-success"], 22 H5Button(["btn-close"], ["type":"button", "aria-label":"Close"])) 23 ), 24 `BS5Alert(["alert-success"], 25 H5Button(["btn-close"], ["type":"button", "aria-label":"Close"]))`, 26 `H5Div(["alert alert-success" role="alert"] 27 H5Button(["type":"button" ["btn-close" "aria-label":"Close"]") 28 )`); 29 30 auto disabledExample = demoBs5Example("disabled", "Disabled", 31 H5Div( 32 BS5Alert(["alert-success"], 33 H5Button(["btn-close"], ["type":"button", "aria-label":"Close", "disabled":"disabled"])) 34 ), 35 `BS5Alert(["alert-success"], 36 H5Button(["btn-close"], ["type":"button", "aria-label":"Close", "disabled":"disabled"]))`, 37 `H5Div(["alert alert-success" role="alert"] 38 H5Button(["type":"button" ["btn-close" "aria-label":"Close" disabled=""]") 39 )`); 40 41 auto darkExample = demoBs5Example("dark", "Disabled", 42 H5Div( 43 BS5Alert(["bg-dark"], 44 H5Button(["btn-close", "btn-close-white"], ["type":"button", "aria-label":"Close", "disabled":"disabled"]), 45 H5Button(["btn-close", "btn-close-white"], ["type":"button", "aria-label":"Close", "disabled":"disabled"])) 46 ), 47 `BS5Alert(["bg-dark"], 48 H5Button(["btn-close", "btn-close-white"], ["type":"button", "aria-label":"Close", "disabled":"disabled"]), 49 H5Button(["btn-close", "btn-close-white"], ["type":"button", "aria-label":"Close", "disabled":"disabled"]))`, 50 `H5Div(["alert bg-dark" role="alert"] 51 H5Button(["type":"button" ["btn-close btn-close-white" "aria-label":"Close"]") 52 H5Button(["type":"button" ["btn-close btn-close-white" "aria-label":"Close" disabled=""]") 53 )`); 54 55 return 56 H5Main(["style":"margin-top:70px;"], 57 H5Div(["container-fluid", "mt-3", "bg-light"], 58 bs5Breadcrumbs(["/", "/demos", "/demos/uim-bootstrap", "/demos/uim-bootstrap/5/", "/demos/uim-bootstrap/5/basic/", "/demos/uim-bootstrap/5/basic/components"], 59 ["UI Manufaktur", "Demos", "uim-bootstrap", "Bootstrap 5", "Basic", "Components"], "Close Buttons")), 60 BS5Container(["mt-3"]).row( 61 H5Div(["col-12", "col-lg-2"], 62 listLevels("basic"), 63 listAreas("basic", "components"), 64 listSections("basic", "components", "closebuttons")), 65 H5Div(["col-12", "col-lg-8"], 66 dateInfo(this), 67 H5H2(["display-4"], "Close Buttons"), 68 H5Hr, 69 70 defaultExample, 71 disabledExample, 72 darkExample 73 74 ))).toString; 75 } 76 }); 77 }