diff --git a/packages/fether-react/src/Scanner/Scanner.js b/packages/fether-react/src/Scanner/Scanner.js
index a56e50cbf..edbb801b6 100644
--- a/packages/fether-react/src/Scanner/Scanner.js
+++ b/packages/fether-react/src/Scanner/Scanner.js
@@ -5,6 +5,7 @@
import React from 'react';
import QrSigner from '@parity/qr-signer';
+import { ExternalLink } from 'fether-ui';
import loading from '../assets/img/icons/loading.svg';
@@ -46,18 +47,17 @@ export default class Scanner extends React.PureComponent {
switch (e.name) {
case 'NotAllowedError':
case 'SecurityError':
- errorMessage = 'Access to the webcam was refused.';
+ errorMessage = 'Webcam access was refused.';
break;
case 'NotFoundError':
case 'OverconstrainedError':
- errorMessage = 'No webcam found on the device.';
+ errorMessage = 'Webcam not found on the device.';
break;
case 'NotReadableError':
- errorMessage =
- 'Webcam hardware error. Try restarting your computer';
+ errorMessage = 'Webcam permissions or hardware error.';
break;
default:
- errorMessage = 'Unknown error.';
+ errorMessage = 'Webcam unknown error.';
}
this.setState({
webcamError: errorMessage,
@@ -77,7 +77,16 @@ export default class Scanner extends React.PureComponent {
{isLoading ? (
) : webcamError ? (
-
{webcamError}
+
+ {webcamError} Visit the
+
{label}
diff --git a/packages/fether-react/src/assets/sass/shared/_basics.scss b/packages/fether-react/src/assets/sass/shared/_basics.scss index e3265ee8a..7f10e9898 100644 --- a/packages/fether-react/src/assets/sass/shared/_basics.scss +++ b/packages/fether-react/src/assets/sass/shared/_basics.scss @@ -32,6 +32,10 @@ a:visited { } } +.external-link { + color: $blue !important; +} + button, input[type='text'], input[type='number'], diff --git a/packages/fether-ui/src/ExternalLink/ExternalLink.js b/packages/fether-ui/src/ExternalLink/ExternalLink.js new file mode 100644 index 000000000..9485a0895 --- /dev/null +++ b/packages/fether-ui/src/ExternalLink/ExternalLink.js @@ -0,0 +1,17 @@ +// Copyright 2015-2019 Parity Technologies (UK) Ltd. +// This file is part of Parity. +// +// SPDX-License-Identifier: BSD-3-Clause + +import React from 'react'; + +export const ExternalLink = ({ name, href }) => ( + + {name} + +); diff --git a/packages/fether-ui/src/ExternalLink/index.js b/packages/fether-ui/src/ExternalLink/index.js new file mode 100644 index 000000000..950b54df1 --- /dev/null +++ b/packages/fether-ui/src/ExternalLink/index.js @@ -0,0 +1,6 @@ +// Copyright 2015-2019 Parity Technologies (UK) Ltd. +// This file is part of Parity. +// +// SPDX-License-Identifier: BSD-3-Clause + +export * from './ExternalLink'; diff --git a/packages/fether-ui/src/index.js b/packages/fether-ui/src/index.js index 195646e20..64d43d200 100644 --- a/packages/fether-ui/src/index.js +++ b/packages/fether-ui/src/index.js @@ -9,6 +9,7 @@ export * from './AddressShort'; export * from './Card'; export * from './Clickable'; export * from './ClickToCopy'; +export * from './ExternalLink'; export * from './Form'; export * from './Header'; export * from './Modal';