Change position of path text to below the code word text area

[srirambv]

Description

Change position of path text to below the code word text area

Steps to Reproduce

1. Install 0.58.12
2. Create a sync chain
3. Add a computer using code words window
4. Path info text is right below the header which might confuse users to enter that instead of code words

Actual result:

Expected result:

Inside outer gradient box or below the text field

Reproduces how often:

Easy

Brave version (brave://version info)

Brave	0.58.12 Chromium: 71.0.3578.80 (Official Build) (64-bit)
Revision	2ac50e7249fbd55e6f517a28131605c9fb9fe897-refs/branch-heads/3578@{#860}
OS	Linux

Reproducible on current release:

• Does it reproduce on brave-browser dev/beta builds?
  No V2 UI isn't on beta/dev

Website problems only:

• Does the issue resolve itself when disabling Brave Shields?
  NO
• Is the issue reproducible on the latest version of Chrome?
  No

Additional Information

cc: @bradleyrichter @rossmoody

[rebron]

over to @bradleyrichter to rethink text.

[rossmoody]

The most up to date design spec for this screen which addresses the hierarchy and verbiage concerns can be found right here.

[GeetaSarvadnya]

Verification passed on

Brave	0.59.26 Chromium: 72.0.3626.64 (Official Build) beta (64-bit)
Revision	eaa9668e80ce5405e7f1902579558ea725c06ca1-refs/branch-heads/3626@{#708}
OS	Windows 10

• Verified the updated design spec from Change position of path text to below the code word text area #2525 (comment)

Verification PASSED on macOS 10.14.2 x64 using the following build:

Brave	0.59.28 Chromium: 72.0.3626.64 (Official Build) beta(64-bit)
Revision	eaa9668e80ce5405e7f1902579558ea725c06ca1-refs/branch-heads/3626@{#708}
OS	Mac OS X

Verification passed on

Brave	0.59.28 Chromium: 72.0.3626.64 (Official Build) beta(64-bit)
Revision	eaa9668e80ce5405e7f1902579558ea725c06ca1-refs/branch-heads/3626@{#708}
OS	Linux