uim.bootstrap.bs5.demos.components.breadcrumbs source code

1 module uim.bootstrap.bs5.demos.components.breadcrumbs;
2 
3 import uim.bootstrap;
4 
5 static this() {
6 	demoBS5.pages("basic/components/breadcrumbs", 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": "Breadcrumbs - Bootstrap 5 Demo",
14           ]);
15 		} 
16 			
17     override string content() { 
18       return 
19 H5Main(["style":"margin-top:70px;"], 
20   H5Div(["container-fluid", "mt-3", "bg-light"],
21     bs5Breadcrumbs(["/", "/demos", "/demos/uim-bootstrap", "/demos/uim-bootstrap/5/", "/demos/uim-bootstrap/5/basic/", "/demos/uim-bootstrap/5/basic/components"], 
22     ["UI Manufaktur", "Demos", "uim-bootstrap", "Bootstrap 5", "Basic", "Components"], "Breadcrumbs")),
23 
24   BS5Container(["mt-3"]).row(
25     H5Div(["col-12", "col-lg-2"], 
26       listLevels("basic"),
27       listAreas("basic", "components"),
28       listSections("basic", "components", "breadcrumbs")),
29     H5Div(["col-12", "col-lg-8"], 
30       dateInfo(this),
31       H5H2(["display-4"], "Breadcrumbs"),
32       H5Hr,
33 
34 demoBs5Example("default", "Default", 
35 BS5Breadcrumb.list(  
36   BS5BreadcrumbItem.link(["href":"#"], "Start"),
37   BS5BreadcrumbItem.link(["href":"#"], "Engineering"),
38   BS5BreadcrumbItem.link(["href":"#"], "Robots"),
39   BS5BreadcrumbItem(["active"], ["aria-current":"page"], "R2D2")), 
40 `BS5Breadcrumb(
41   BS5BreadcrumbList(  
42     BS5BreadcrumbItem(
43       H5A(["href":"#"], "Start")),
44     BS5BreadcrumbItem(
45       H5A(["href":"#"], "Engineering")),
46     BS5BreadcrumbItem(
47       H5A(["href":"#"], "Robots")),
48     BS5BreadcrumbItem(["active"], ["aria-current":"page"], "R2D2")))
49 
50 </code></pre><p>Weitere (kompaktere) Möglichkeit")<pre><code>
51 
52 BS5Breadcrumb.list(  
53   BS5BreadcrumbItem.link(["href":"#"], "Start"),
54   BS5BreadcrumbItem.link(["href":"#"], "Engineering"),
55   BS5BreadcrumbItem.link(["href":"#"], "Robots"),
56   BS5BreadcrumbItem(["active"], ["aria-current":"page"], "R2D2"))
57 `,
58 `<nav "aria-label":"Breadcrumb"]
59   H5Ol(["breadcrumb"]
60     H5Li(["breadcrumb-item"]H5A(["href":"#", >Start</a>")
61     H5Li(["breadcrumb-item"]H5A(["href":"#", >Engineering</a>")
62     H5Li(["breadcrumb-item"]H5A(["href":"#", >Robots</a>")
63     H5Li(["breadcrumb-item active" aria-current="page"]R2D2")
64   )
65 </nav>`
66 )
67     )
68   )
69 ).toString;
70     }
71   });
72 }