Misaligned UI elements on view sync code modal

[btlechowski]

Steps to Reproduce

1. Sync two devices
2. In Desktop Browser click view sync code

Actual result:

Misaligned UI elements

Expected result:

The UI elements are properly aligned

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	Windows 7

cc @brave/legacy_qa

[kjozwiak]

Lets try getting this fixed in 0.58.x if possible as it looks pretty bad... Doesn't look professional and users will question if we even noticed something that obvious as the above.

[rebron]

@petemill @cezaraugusto can you guys take a look at this one?

[bradleyrichter]

We can't ship this as is. Must fix please.

[btlechowski]

Verification passed on

Brave	0.58.14 Chromium: 71.0.3578.98 (Official Build) (64-bit)
Revision	15234034d19b85dcd9a03b164ae89d04145d8368-refs/branch-heads/3578@{#897}
OS	Windows 7

Looks better

Padding between Word Code and QR Code could be improved. Reported #2591

Verified passed with

Brave	0.58.14 Chromium: 71.0.3578.98 (Official Build) (64-bit)
Revision	15234034d19b85dcd9a03b164ae89d04145d8368-refs/branch-heads/3578@{#897}
OS	Mac OS X

• Verified STR from description.

Verification PASSED on Ubuntu 18.04.1 x64 using the following build:

Brave	0.58.14 Chromium: 71.0.3578.98 (Official Build) (64-bit)
Revision	15234034d19b85dcd9a03b164ae89d04145d8368-refs/branch-heads/3578@{#897}
OS	Linux