source.uim.bootstrap.bs5.demos.utilities.interactions source code

1 module source.uim.bootstrap.bs5.demos.utilities.interactions;
2 
3 import uim.bootstrap;
4 
5 static this() {
6 	demoBS5.pages("basic/utilities/interactions", 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": "Interactions - Bootstrap 5 Demo",
14           ]);
15 		} 
16 			
17     override string content() { 
18 
19 auto textExample = demoBs5Example("text", "Text selection", 
20   H5Div(
21     H5H5(["text-muted", "mt-3"], "All"),
22     H5P(["user-select-all"], "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In laoreet pellentesque lorem sed elementum. Suspendisse maximus convallis ex. Etiam eleifend velit leo."),
23     H5H5(["text-muted", "mt-3"], "Auto"),
24     H5P(["user-select-auto"], ["style":"user-select: none;"], "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In laoreet pellentesque lorem sed elementum. Suspendisse maximus convallis ex. Etiam eleifend velit leo."),
25     H5H5(["text-muted", "mt-3"], "None"),
26     H5P(["user-select-none"], "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In laoreet pellentesque lorem sed elementum. Suspendisse maximus convallis ex. Etiam eleifend velit leo.")
27   ), ``, ``);
28 
29 auto defaultExample = demoBs5Example("default", "Pointer events", 
30   H5Div(
31     H5H5(["text-muted", "mt-3"], "None"),
32     H5P(
33       H5A(["pe-none"], ["href":"#"], "Lorem ipsum dolor sit amet, consectetur adipiscing elit."), 
34       H5String("In laoreet pellentesque lorem sed elementum. Suspendisse maximus convallis ex. Etiam eleifend velit leo.")),
35     H5H5(["text-muted", "mt-3"], "Auto"),
36     H5P(
37       H5A(["pe-auto"], ["href":"#", "style":"pointer-events: none;"], "Lorem ipsum dolor sit amet, consectetur adipiscing elit"), 
38       H5String("In laoreet pellentesque lorem sed elementum. Suspendisse maximus convallis ex. Etiam eleifend velit leo.")),
39     H5H5(["text-muted", "mt-3"], "None for parent, auto for second child"),
40     H5P(["pe-none"], 
41       H5A(["href":"#"], "Lorem ipsum dolor sit amet, consectetur adipiscing elit."),
42       H5String("In laoreet pellentesque lorem sed elementum. Suspendisse maximus convallis ex."),
43       H5A(["pe-auto"], ["href":"#"], "Etiam eleifend velit leo),."))
44   ), ``, ``);
45 
46       return 
47 H5Main(["style":"margin-top:70px;"], 
48   H5Div(["container-fluid", "mt-3", "bg-light"],
49     bs5Breadcrumbs(["/", "/demos", "/demos/uim-bootstrap", "/demos/uim-bootstrap/5/", "/demos/uim-bootstrap/5/basic/", "/demos/uim-bootstrap/5/basic/utilities"], 
50     ["UI Manufaktur", "Demos", "uim-bootstrap", "Bootstrap 5", "Basic", "Utilities"], "Interactions")),
51   BS5Container(["mt-3"]).row(
52     H5Div(["col-12", "col-lg-2"], 
53       listLevels("basic"),
54       listAreas("basic", "utilities"),
55       listSections("basic", "utilities", "interactions")),
56     H5Div(["col-12", "col-lg-8"], 
57       dateInfo(this),
58       H5H2(["display-4"], "Interactions"),
59       H5Hr,
60 
61       textExample, 
62       defaultExample
63     
64     ),
65     H5Div(["col-12", "col-lg-2"]))).toString;
66     }
67   });
68 }