diff --git a/packages/design/sass/styles.scss b/packages/design/sass/styles.scss index 9661c79f..34058776 100644 --- a/packages/design/sass/styles.scss +++ b/packages/design/sass/styles.scss @@ -39,6 +39,14 @@ a, main { flex: 1; width: 100%; +/* + >section { + &.grid-container { + margin: 0; + padding: 0; + } + } +*/ } .usa-banner__inner, @@ -125,9 +133,50 @@ main { .usa-legend { max-width: 100%; + font-weight: 600; + width: -webkit-fill-available; +} + +nav { + background: #F7F9FD; + padding: 0 1.5rem; + + >ul { + padding-top: 2.6rem; + } } +.previewForm { + padding-left: 1rem; + + >fieldset { + margin-bottom: 10em; + + >legend { + border-bottom: 1px #DCDEE0 solid; + font-size: 2rem; + } + + >.usa-form-group { + margin-left: 3rem; + } + + .usa-form-group { + >fieldset { + border-bottom: 1px #DCDEE0 solid; + padding-bottom: 2rem; + + legend { + font-size: 1.5rem; + border-bottom: none; + } + + p { + font-weight: bold; + } + } + } + } -.previewForm { .usa-button { margin: 1rem 0 0 1rem; } diff --git a/packages/design/src/Form/index.tsx b/packages/design/src/Form/index.tsx index decb8d7e..aff390ed 100644 --- a/packages/design/src/Form/index.tsx +++ b/packages/design/src/Form/index.tsx @@ -86,10 +86,30 @@ export default function Form({ updatePrompt(allFormData); }, [allFormData]); */ + console.log(JSON.stringify(prompt)); return ( +
+
+ +
{ updatePrompt(data); if (onSubmit) { @@ -100,6 +120,68 @@ export default function Form({ } })} > +
+ Request to Change Name +
+
+
+ County where you live + + +
+
+
+ +
+
+
+ Your current name + + + + + + +
+
+

To ask the court to change your name, you must fill out this form, and:

+
    +
  • Attach a certified copy of your birth certificate and a copy of your photo ID, and
  • +
  • File your form and attachements in the same county where you live.
  • +
+
+
+
+
+
{prompt.parts .map((pattern, index) => { @@ -111,6 +193,9 @@ export default function Form({
+
+
+
); }