@qld-gov-au/qgds-bootstrap5 2.0.8 → 2.0.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/assets/components/bs5/head/head.hbs +1 -1
- package/dist/assets/components/bs5/image/image.hbs +8 -5
- package/dist/assets/components/bs5/pageLayout/templates/contentPageWithForm.hbs +112 -93
- package/dist/assets/components/bs5/pageLayout/templates/contentPageWithSideNavigation.hbs +57 -53
- package/dist/assets/css/qld.bootstrap.css +1 -1
- package/dist/assets/css/qld.bootstrap.css.map +2 -2
- package/dist/assets/css/qld.bootstrap.legacy.css +1 -1
- package/dist/assets/css/qld.bootstrap.legacy.css.map +2 -2
- package/dist/assets/js/handlebars.init.min.js +185 -158
- package/dist/assets/js/handlebars.init.min.js.map +2 -2
- package/dist/assets/js/handlebars.partials.js +185 -158
- package/dist/assets/js/handlebars.partials.js.map +2 -2
- package/dist/assets/node/handlebars.init.min.js +109 -90
- package/dist/assets/node/handlebars.init.min.js.map +2 -2
- package/dist/components/bs5/head/head.hbs +1 -1
- package/dist/components/bs5/image/image.hbs +8 -5
- package/dist/components/bs5/pageLayout/templates/contentPageWithForm.hbs +112 -93
- package/dist/components/bs5/pageLayout/templates/contentPageWithSideNavigation.hbs +57 -53
- package/dist/package.json +1 -1
- package/dist/sample-data/breadcrumbs/breadcrumbs.data.json +1 -1
- package/dist/sample-data/image/image.data.json +4 -2
- package/package.json +1 -1
- package/src/components/bs5/banner/banner.scss +28 -19
- package/src/components/bs5/banner/banner.stories.js +25 -16
- package/src/components/bs5/breadcrumbs/breadcrumbs.data.json +1 -1
- package/src/components/bs5/header/header.scss +4 -0
- package/src/components/bs5/image/image.data.json +4 -2
- package/src/components/bs5/image/image.hbs +8 -5
- package/src/components/bs5/image/image.scss +29 -7
- package/src/components/bs5/image/image.stories.js +77 -57
- package/src/components/bs5/pageLayout/pageLayout.stories.js +11 -45
- package/src/components/bs5/pageLayout/templates/contentPageWithForm.hbs +112 -93
- package/src/components/bs5/pageLayout/templates/contentPageWithSideNavigation.hbs +57 -53
- package/src/components/bs5/searchInput/searchInput.scss +4 -5
|
@@ -456,110 +456,129 @@ var init_contentPageWithForm = __esm({
|
|
|
456
456
|
<html lang="en">
|
|
457
457
|
|
|
458
458
|
<head>
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
459
|
+
<meta charset="UTF-8">
|
|
460
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
461
|
+
<title>{{title}}</title>
|
|
462
462
|
</head>
|
|
463
463
|
|
|
464
464
|
<body>
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
{{> navbar navbar}}
|
|
465
|
+
<!-- Global ALert -->
|
|
466
|
+
{{> globalAlert globalAlert}}
|
|
468
467
|
|
|
469
|
-
|
|
470
|
-
|
|
468
|
+
<!-- Header -->
|
|
469
|
+
{{> header header }}
|
|
470
|
+
|
|
471
|
+
<!-- Navbar -->
|
|
472
|
+
{{> navbar navbar}}
|
|
473
|
+
|
|
474
|
+
{{#if banner}}
|
|
475
|
+
{{> banner banner}}
|
|
476
|
+
{{/if}}
|
|
477
|
+
|
|
478
|
+
<div class="container mt-40 mt-lg-64">
|
|
479
|
+
|
|
480
|
+
{{#if breadcrumbs}}
|
|
481
|
+
<!-- breadcrumbs -->
|
|
482
|
+
{{> breadcrumbs breadcrumbs}}
|
|
471
483
|
{{/if}}
|
|
472
484
|
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
485
|
+
<!-- Start Main Content Body -->
|
|
486
|
+
<div class="row">
|
|
487
|
+
|
|
488
|
+
<!-- Start Side navigation column (span 3) -->
|
|
489
|
+
<div class="col-12 col-lg-3">
|
|
490
|
+
<!-- QGDS Side Navigation Component -->
|
|
491
|
+
{{> sidenav sidenav}}
|
|
492
|
+
</div>
|
|
493
|
+
<!-- End Side navigation column -->
|
|
494
|
+
|
|
495
|
+
<!-- Start Main Column (span 8) -->
|
|
496
|
+
<div class="col-12 col-lg-8 mt-40 mt-lg-0">
|
|
497
|
+
|
|
498
|
+
<!-- Main Content div, includes a 2rem/32px horizontal padding on large screens and up -->
|
|
499
|
+
<main class="px-lg-32">
|
|
500
|
+
|
|
501
|
+
<h1 id="section-heading">Single page form (H1)</h1>
|
|
502
|
+
|
|
503
|
+
<p>Your feedback is important to us. It tells us how we can improve and what we\u2019re doing well. Your feedback
|
|
504
|
+
is confidential.</p>
|
|
505
|
+
|
|
506
|
+
<h2 id="form-heading">Enquiry form (H2)</h2>
|
|
507
|
+
|
|
508
|
+
{{#if inpageAlert}}
|
|
509
|
+
<!-- Inpage Alert -->
|
|
510
|
+
<div class="mb-32">
|
|
511
|
+
{{> inpageAlert inpageAlert}}
|
|
512
|
+
</div>
|
|
513
|
+
{{/if}}
|
|
514
|
+
|
|
515
|
+
<!-- Example WYSIWYG content -->
|
|
516
|
+
<p>Any information submitted using this form will be used in line with our privacy statement.</p>
|
|
517
|
+
<p>Required fields are marked with an *</p>
|
|
518
|
+
|
|
519
|
+
|
|
520
|
+
{{#if form}}
|
|
521
|
+
<!-- Example Form, with 2rem vertical spacing -->
|
|
522
|
+
<form class="qld-form my-32">
|
|
523
|
+
{{#each form.fields1}}
|
|
524
|
+
<div class="form-group mb-32">
|
|
525
|
+
{{#ifCond type '==' 'textbox'}}
|
|
526
|
+
{{> textbox this}}
|
|
527
|
+
{{else ifCond type '==' 'textarea'}}
|
|
528
|
+
{{> textarea this}}
|
|
529
|
+
{{else ifCond type '==' 'radio'}}
|
|
530
|
+
{{> formcheck this}}
|
|
531
|
+
{{/ifCond}}
|
|
532
|
+
</div>
|
|
533
|
+
{{/each}}
|
|
534
|
+
|
|
535
|
+
<h3 id="contact-details">Contact details (H3)</h3>
|
|
536
|
+
|
|
537
|
+
{{#each form.fields2}}
|
|
538
|
+
<div class="form-group mb-32">
|
|
539
|
+
{{#ifCond type '==' 'textbox'}}
|
|
540
|
+
{{> textbox this}}
|
|
541
|
+
{{else ifCond type '==' 'select'}}
|
|
542
|
+
{{> select this}}
|
|
543
|
+
{{else ifCond type '==' 'checkbox'}}
|
|
544
|
+
{{> formcheck this}}
|
|
545
|
+
{{/ifCond}}
|
|
546
|
+
</div>
|
|
547
|
+
{{/each}}
|
|
548
|
+
|
|
549
|
+
{{#if form.buttons}}
|
|
550
|
+
<div class="form-actions d-flex mt-5 gap-4">
|
|
551
|
+
{{#each form.buttons}}
|
|
552
|
+
{{> button this}}
|
|
553
|
+
{{/each}}
|
|
480
554
|
</div>
|
|
481
555
|
{{/if}}
|
|
556
|
+
</form>
|
|
557
|
+
{{/if}}
|
|
482
558
|
|
|
483
|
-
|
|
484
|
-
{{#if sidenav}}
|
|
485
|
-
<!-- Side navigation Col -->
|
|
486
|
-
<div class="col-12 col-lg-3 mt-5 mt-lg-0 mb-32 mb-lg-0">
|
|
487
|
-
{{> sidenav sidenav}}
|
|
488
|
-
</div>
|
|
489
|
-
{{/if}}
|
|
559
|
+
</main>
|
|
490
560
|
|
|
491
|
-
|
|
492
|
-
|
|
561
|
+
</div>
|
|
562
|
+
<!-- End Column (span 8) -->
|
|
493
563
|
|
|
494
|
-
|
|
495
|
-
|
|
564
|
+
</div>
|
|
565
|
+
<!-- End Content Row -->
|
|
496
566
|
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
<h2 id="form-heading">Enquiry form (H2)</h2>
|
|
567
|
+
<!-- Start QGDS Content Footer -->
|
|
568
|
+
<div class="mt-64">
|
|
569
|
+
{{> contentFooter contentFooter}}
|
|
570
|
+
</div>
|
|
503
571
|
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
<div class="mb-32">
|
|
507
|
-
{{> inpageAlert inpageAlert}}
|
|
508
|
-
</div>
|
|
509
|
-
{{/if}}
|
|
572
|
+
</div>
|
|
573
|
+
<!-- End Main .container -->
|
|
510
574
|
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
</div>
|
|
515
|
-
|
|
516
|
-
{{#if form}}
|
|
517
|
-
<form class="qld-form mb-5">
|
|
518
|
-
{{#each form.fields1}}
|
|
519
|
-
<div class="form-group mb-32">
|
|
520
|
-
{{#ifCond type '==' 'textbox'}}
|
|
521
|
-
{{> textbox this}}
|
|
522
|
-
{{else ifCond type '==' 'textarea'}}
|
|
523
|
-
{{> textarea this}}
|
|
524
|
-
{{else ifCond type '==' 'radio'}}
|
|
525
|
-
{{> formcheck this}}
|
|
526
|
-
{{/ifCond}}
|
|
527
|
-
</div>
|
|
528
|
-
{{/each}}
|
|
529
|
-
|
|
530
|
-
<h3 id="form-heading">Contact details (H3)</h3>
|
|
531
|
-
|
|
532
|
-
{{#each form.fields2}}
|
|
533
|
-
<div class="form-group mb-32">
|
|
534
|
-
{{#ifCond type '==' 'textbox'}}
|
|
535
|
-
{{> textbox this}}
|
|
536
|
-
{{else ifCond type '==' 'select'}}
|
|
537
|
-
{{> select this}}
|
|
538
|
-
{{else ifCond type '==' 'checkbox'}}
|
|
539
|
-
{{> formcheck this}}
|
|
540
|
-
{{/ifCond}}
|
|
541
|
-
</div>
|
|
542
|
-
{{/each}}
|
|
543
|
-
|
|
544
|
-
{{#if form.buttons}}
|
|
545
|
-
<div class="form-actions d-flex mt-5 gap-4">
|
|
546
|
-
{{#each form.buttons}}
|
|
547
|
-
{{> button this}}
|
|
548
|
-
{{/each}}
|
|
549
|
-
</div>
|
|
550
|
-
{{/if}}
|
|
551
|
-
</form>
|
|
552
|
-
{{/if}}
|
|
575
|
+
<!-- Start QGDS Footer -->
|
|
576
|
+
{{> footer footer}}
|
|
577
|
+
<!-- End QGDS Footer -->
|
|
553
578
|
|
|
554
|
-
</div>
|
|
555
|
-
</div>
|
|
556
|
-
{{> contentFooter contentFooter}}
|
|
557
|
-
</div>
|
|
558
|
-
</div>
|
|
559
|
-
</main>
|
|
560
|
-
{{> footer footer}}
|
|
561
579
|
</body>
|
|
562
580
|
|
|
581
|
+
|
|
563
582
|
</html>`;
|
|
564
583
|
}
|
|
565
584
|
});
|
|
@@ -568,7 +587,7 @@ var init_contentPageWithForm = __esm({
|
|
|
568
587
|
var contentPageWithSideNavigation_default;
|
|
569
588
|
var init_contentPageWithSideNavigation = __esm({
|
|
570
589
|
"src/components/bs5/pageLayout/templates/contentPageWithSideNavigation.hbs?raw"() {
|
|
571
|
-
contentPageWithSideNavigation_default = '<!DOCTYPE html>\n<html lang="en">\n\n<head>\n <meta charset="UTF-8">\n <meta name="viewport" content="width=device-width, initial-scale=1.0">\n <title>{{title}}</title>\n</head>\n\n<body>\n <!-- Global ALert -->\n {{> globalAlert globalAlert}}\n\n <!-- Header -->\n {{> header header }}
|
|
590
|
+
contentPageWithSideNavigation_default = '<!DOCTYPE html>\n<html lang="en">\n\n<head>\n <meta charset="UTF-8">\n <meta name="viewport" content="width=device-width, initial-scale=1.0">\n <title>{{title}}</title>\n</head>\n\n<body>\n <!-- Global ALert -->\n {{> globalAlert globalAlert}}\n\n <!-- Header -->\n {{> header header }}\n\n <!-- Navbar -->\n {{> navbar navbar}}\n\n {{#if banner}}\n {{> banner banner}}\n {{/if}}\n\n <div class="container mt-40 mt-lg-64">\n\n {{#if breadcrumbs}}\n <!-- breadcrumbs -->\n {{> breadcrumbs breadcrumbs}}\n {{/if}}\n\n <!-- Start Main Content Body -->\n <div class="row">\n\n <!-- Start Side navigation column (span 3) -->\n <div class="col-12 col-lg-3">\n <!-- QGDS Side navigation Component -->\n {{> sidenav sidenav}}\n </div>\n <!-- End Side navigation column -->\n\n <!-- Start Main Column (span 8) -->\n <div class="col-12 col-lg-8 mt-40 mt-lg-0">\n\n <!-- Main Content div, includes a 2rem/32px horizontal padding on large screens and up -->\n <main class="px-lg-32">\n\n {{#if inpagenav}}\n <!-- QGDS Inpagenav Component -->\n {{> inpagenav inpagenav}}\n {{/if}}\n\n <!-- Content Section with top vertical spacer (2rem mobile, 4rem LG and above) -->\n <div class="mt-32 mt-lg-64">\n <h2 id="section-heading">Section heading (H2)</h2>\n <p>\n Lorem ipsum dolor sit amet consectetur. Sed facilisis purus eu convallis ut. Morbi condimentum volutpat\n feugiat pellentesque. Auctor amet auctor dolor metus eget diam. Facilisis vitae venenatis vestibulum\n libero ut. Luctus diam pellentesque ipsum accumsan amet commodo.\n </p>\n <p>\n Convallis et ullamcorper ac nisi ornare sed facilisis sem. Scelerisque malesuada vivamus tellus mi vitae\n amet ornare donec malesuada. Nascetur senectus aenean fames id turpis.\n </p>\n </div>\n\n\n <!-- Content Section with top vertical spacer (2rem mobile, 4rem LG and above) -->\n <div class="mt-32 mt-lg-64">\n\n <h2 id="content-heading">Content heading (H2)</h2>\n\n <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et\n dolore magna aliqua.</p>\n\n {{#if calloutdata}}\n <!-- QGDS Callout Component -->\n {{> callout calloutdata}}\n {{/if}}\n </div>\n\n\n\n <!-- Content Section with top vertical spacer (2rem mobile, 2.5rem LG and above) -->\n <div class="mt-32 mt-lg-40">\n <h3 id="inspection">Pre-registration inspection (H3)</h3>\n <p>Information about pre-registration inspection requirements.</p>\n\n <h4 id="fees-and-charges">Fees and charges (H4)</h4>\n <p>Details about fees and charges for vehicle registration.</p>\n\n\n {{#if accordionItems}}\n <!-- QGDS Accordion Component with 24px/1.5rem margin-top -->\n <div class="mt-24">\n {{> accordion accordionItems}}\n </div>\n {{/if}}\n </div>\n\n <!-- Top vertical spacer: 2rem default (mobile), 4rem LG and above -->\n <div class="mt-32 mt-lg-64">\n {{#if video}}\n <!-- QGDS Video Component -->\n {{> video video}}\n {{/if}}\n </div>\n\n <!-- Emphasis Container, with top vertical spacer: 2rem default (mobile), 4rem LG and above -->\n <div class="mt-40 mt-lg-64 bg-light content-emphasis">\n\n <h2 id="inspection">Section heading (H2) with emphasis</h2>\n\n <p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt\n ultrices commodo vestibulum non netus. </p>\n\n <!-- QGDS Call To Action button -->\n {{> callToAction callToAction}}\n\n </div>\n\n <!-- Top vertical spacer: 2rem default (mobile), 4rem LG and above -->\n <div class="mt-32 mt-lg-64">\n <h2 id="inspection">Section heading (H2)</h2>\n <p>Lorem ipsum dolor sit amet consectetur. Viverra eu pulvinar a eu mauris ac at ultricies est. Tincidunt\n ultrices commodo vestibulum non netus. </p>\n\n {{#if table}}\n <!-- QGDS Table Component -->\n <div class="mt-24">\n {{> table table}}\n </div>\n {{/if}}\n </div>\n\n </main>\n <!-- End Main Content div -->\n\n </div>\n <!-- End Column (8) -->\n\n </div>\n <!-- End Row -->\n\n\n <!-- Start QGDS Content Footer -->\n <div class="mt-64">\n {{> contentFooter contentFooter}}\n </div>\n\n </div>\n\n <!-- Start QGDS Footer -->\n {{> footer footer}}\n <!-- End QGDS Footer -->\n\n</body>\n\n\n</html>';
|
|
572
591
|
}
|
|
573
592
|
});
|
|
574
593
|
|
|
@@ -943,7 +962,7 @@ var head_default;
|
|
|
943
962
|
var init_head = __esm({
|
|
944
963
|
"src/components/bs5/head/head.hbs?raw"() {
|
|
945
964
|
head_default = `
|
|
946
|
-
<!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"2.0.
|
|
965
|
+
<!-- VERSION_DETAILS={"project_id":"@qld-gov-au/qgds-bootstrap5","version":"2.0.9","branch":"HEAD","tag":"v2.0.9","commit":"0f12969e32431b89a0e3a8c31cb7d6eb86d06886","majorVersion":"v2"} -->
|
|
947
966
|
|
|
948
967
|
{{! Select environment, used verbatium if not using predefind key
|
|
949
968
|
cdn := PROD|STAGING|BETA|TEST|DEV|???
|
|
@@ -993,7 +1012,7 @@ var init_icon = __esm({
|
|
|
993
1012
|
var image_default;
|
|
994
1013
|
var init_image = __esm({
|
|
995
1014
|
"src/components/bs5/image/image.hbs?raw"() {
|
|
996
|
-
image_default = '{{! Image template }}\n{{#*inline "imageTag"}}\n <img class="{{ ratioClass }} {{ otherClass }} {{ positionX }} {{ positionY }}"\n src="{{ src }}"\n alt="{{ alt }}"\n {{~#if width}} width="{{ width }}{{ widthUnit }}"{{/if~}}\n {{~#if height}} height="{{ height }}{{ heightUnit }}"{{/if~}}\n {{~#if lazy}} loading="lazy"{{/if~}}\n {{~#if style}} style="{{ style }}"{{/if~}}\n {{~#if tabindex}} tabindex="{{ tabindex }}"{{/if~}}\n {{~#if role}} role="{{ role }}"{{/if~}}\n />\n{{/inline}}\n\n{{#if src}}\n {{#
|
|
1015
|
+
image_default = '{{! Image template }}\n{{#*inline "imageTag"}}\n <img class="{{ ratioClass }} {{ otherClass }} {{ positionX }} {{ positionY }}"\n src="{{ src }}"\n alt="{{ alt }}"\n {{~#if width}} width="{{ width }}{{ widthUnit }}"{{/if~}}\n {{~#if height}} height="{{ height }}{{ heightUnit }}"{{/if~}}\n {{~#if lazy}} loading="lazy"{{/if~}}\n {{~#if style}} style="{{ style }}"{{/if~}}\n {{~#if tabindex}} tabindex="{{ tabindex }}"{{/if~}}\n {{~#if role}} role="{{ role }}"{{/if~}}\n />\n{{/inline}}\n\n{{#if src}}\n {{#ifAny caption credit }}\n <figure class="{{ figureClass }}" {{#if width}}style="width:{{ width }}{{ widthUnit }}"{{/if}}>\n {{> imageTag}}\n <figcaption>\n {{caption}}\n {{#if credit}}<span class="figure-credit">{{ credit }}</span>{{/if}}\n </figcaption>\n </figure>\n {{else}}\n {{>imageTag}}\n {{/ifAny}}\n{{/if}}\n';
|
|
997
1016
|
}
|
|
998
1017
|
});
|
|
999
1018
|
|