diff --git a/docroot/modules/custom/va_gov_form_builder/css/va_gov_form_builder.css b/docroot/modules/custom/va_gov_form_builder/css/va_gov_form_builder.css index 80bc63ece9..06d7e6515b 100644 --- a/docroot/modules/custom/va_gov_form_builder/css/va_gov_form_builder.css +++ b/docroot/modules/custom/va_gov_form_builder/css/va_gov_form_builder.css @@ -1,5 +1,8 @@ /* page container */ .form-builder-page-container { + --vads-color-divider: #a9aeb1; + --color-shadow: #00000040; + font-family: var(--font-family-serif); } @@ -42,7 +45,7 @@ /* layout container */ .form-builder-layout-container { - margin: 0 var(--units-7); + margin: var(--units-2p5) var(--units-7); } /* title */ @@ -90,3 +93,23 @@ .form-builder-navbar__tab--active .form-builder-navbar__link:hover { color: var(--uswds-system-color-gold-vivid-20); } + +/* two-column layout */ +.form-builder-two-column-layout { + display: flex; + gap: var(--units-5); + justify-content: space-between; + width: 100%; +} + +.form-builder-right-column { + padding-top: var(--units-2); +} + +/* sidebar */ +.form-builder-sidebar { + border: 1px solid var(--vads-color-divider); + box-shadow: 0 4px 4px 0 var(--color-shadow); + padding: var(--units-2p5); + width: 340px; +} diff --git a/docroot/modules/custom/va_gov_form_builder/templates/page--va-gov-form-builder.html.twig b/docroot/modules/custom/va_gov_form_builder/templates/page--va-gov-form-builder.html.twig index 0bc5004f56..221ac167e2 100644 --- a/docroot/modules/custom/va_gov_form_builder/templates/page--va-gov-form-builder.html.twig +++ b/docroot/modules/custom/va_gov_form_builder/templates/page--va-gov-form-builder.html.twig @@ -57,12 +57,21 @@
-
-
- - {# The form content #} - {{ page.content }} - -
+
+
+
+
+ +
+ {{ page.content }} +
+
+
+ +
+
+ diff --git a/tests/phpunit/va_gov_form_builder/functional/templates/FormBuilderPageTemplateTest.php b/tests/phpunit/va_gov_form_builder/functional/templates/FormBuilderPageTemplateTest.php index 34f201df60..79513d5432 100644 --- a/tests/phpunit/va_gov_form_builder/functional/templates/FormBuilderPageTemplateTest.php +++ b/tests/phpunit/va_gov_form_builder/functional/templates/FormBuilderPageTemplateTest.php @@ -51,6 +51,9 @@ public function testExpectedElementsExist() { $navbarElement = $this->cssSelect('.form-builder-navbar'); $this->assertCount(1, $navbarElement); + + $sidebarElement = $this->cssSelect('.form-builder-sidebar'); + $this->assertCount(1, $sidebarElement); } /**