source.uim.bootstrap.bs5.demos.forms.inputgroup source code

1 module source.uim.bootstrap.bs5.demos.forms.inputgroup;
2 
3 import uim.bootstrap;
4 
5 static this() {
6 	demoBS5.pages("basic/forms/inputgroup", 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": "Input Group - Bootstrap 5 Demo",
14           ]);
15 		} 
16 			
17     override string content() { 
18 auto defaultExample = demoBs5Example("default", "Default", 
19   H5Div(
20     H5Figure(["figure"],
21       H5Img(["figure-img", "img-fluid"], ["src":"/img/600x400.png", "alt":"Figure image"]),
22       H5Figcaption(["figure-caption"], "Caption for the figure.")
23     )
24   ), ``, ``);
25 
26 auto alignmentExample = demoBs5Example("alignment", "Alignment", 
27   H5Div(
28     H5H5(["text-muted", "mt-3"], "Center"),
29     H5Figure(["figure"],
30       H5Img(["figure-img", "img-fluid"], ["src":"/img/600x400.png", "alt":"Figure image"]),
31       H5Figcaption(["figure-caption", "text-center"], "Caption for the figure.")
32     ),
33     H5H5(["text-muted", "mt-3"], "Right"),
34     H5Figure(["figure"],
35       H5Img(["figure-img", "img-fluid"], ["src":"/img/600x400.png", "alt":"Figure image"]),
36       H5Figcaption(["figure-caption", "text-end"], "Caption for the figure.")
37     )  
38   ), ``, ``);
39 
40        return 
41 H5Main(["style":"margin-top:70px;"], 
42   H5Div(["container-fluid", "mt-3", "bg-light"],
43     bs5Breadcrumbs(["/", "/demos", "/demos/uim-bootstrap", "/demos/uim-bootstrap/5/", "/demos/uim-bootstrap/5/basic/", "/demos/uim-bootstrap/5/basic/forms"], 
44     ["UI Manufaktur", "Demos", "uim-bootstrap", "Bootstrap 5", "Basic", "Forms"], "Input Group")),
45 
46   BS5Container(["mt-3"]).row(
47     H5Div(["col-12", "col-lg-2"], 
48       listLevels("basic"),
49       listAreas("basic", "forms"),
50       listSections("basic", "forms", "inputgroup")),
51     H5Div(["col-12", "col-lg-8"], 
52       dateInfo(this),
53       H5H2(["display-4"], "Input Group"),
54       H5Hr,
55 
56       defaultExample, 
57       alignmentExample
58 
59     ),
60     H5Div(["col-12", "col-lg-2"]))).toString;
61     }
62   });
63 }