Merge pull request #1093 from brave/view-sync-alignment

fix misalignment in view sync code modal
brave · Dec 14, 2018 · 3510e2b · 3510e2b
2 parents 1a2669f + 4d73cae
commit 3510e2b
Showing 1 changed file with 11 additions and 4 deletions.
diff --git a/components/brave_sync/ui/components/modals/viewSyncCode.tsx b/components/brave_sync/ui/components/modals/viewSyncCode.tsx
@@ -37,10 +37,6 @@ export default class ViewSyncCodeModal extends React.PureComponent<Props, {}> {
  return (
  <Modal id='viewSyncCodeModal' onClose={onClose} size='small'>
  <ViewSyncCodeGrid>
- <div style={{ textAlign: 'center' }}>
- <ModalTitle level={3}>{getLocale('qrCode')}</ModalTitle>
- <QRCode size='small' src={syncData.seedQRImageSource} />
- </div>
  <div>
  <ModalTitle level={3}>{getLocale('wordCode')}</ModalTitle>
  <TextAreaClipboard
@@ -50,6 +46,17 @@ export default class ViewSyncCodeModal extends React.PureComponent<Props, {}> {
  defaultValue={syncData.syncWords}
  />
  </div>
+ <div>
+ <ModalTitle level={3}>{getLocale('qrCode')}</ModalTitle>
+ <QRCode
+ size='small'
+ src={syncData.seedQRImageSource}
+ style={{
+ // TODO: @cezaraugusto fix this in brave-ui
+ border: '1px solid #DFDFE8'
+ }}
+ />
+ </div>
  </ViewSyncCodeGrid>
  <TwoColumnButtonGrid>
  <div>{getLocale('privateKey')}</div>