diff --git a/res/css/structures/ErrorView.scss b/res/css/structures/ErrorView.scss new file mode 100644 index 0000000000..008799b8a5 --- /dev/null +++ b/res/css/structures/ErrorView.scss @@ -0,0 +1,97 @@ +/* +Copyright 2020 New Vector Ltd + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. +*/ + +.mx_ErrorView { + background: #c5e0f7; + background: -moz-linear-gradient(top, #c5e0f7 0%, #ffffff 100%); + background: -webkit-linear-gradient(top, #c5e0f7 0%, #ffffff 100%); + background: linear-gradient(to bottom, #c5e0f7 0%, #ffffff 100%); + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c5e0f7', endColorstr='#ffffff',GradientType=0 ); + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; + width: 100%; + height: 100%; + color: #000; + + .mx_ErrorView_container { + max-width: 680px; + margin: auto; + } + + .mx_Button { + border: 0; + border-radius: 4px; + font-size: 18px; + margin-left: 4px; + margin-right: 4px; + min-width: 80px; + background-color: #03B381; + color: #fff; + cursor: pointer; + padding: 12px 22px; + word-break: break-word; + text-decoration: none; + } + + .mx_Center { + justify-content: center; + } + + .mx_HomePage_header { + color: #2E2F32; + display: flex; + align-items: center; + justify-content: center; + } + + font-size: 1.067rem; // 16px + h1 { + font-size: 2.133rem; // 32px + } + h2 { + font-size: 1.600rem; // 24px + color: #000; + } + + .mx_HomePage_col { + display: flex; + flex-direction: row; + } + + .mx_HomePage_row { + flex: 1 1 0; + display: flex; + flex-direction: row; + flex-wrap: wrap; + } + + .mx_HomePage_logo { + margin: auto 20px auto 0; + } + + h1, h2 { + font-weight: 600; + margin-bottom: 32px; + } + + .mx_Spacer { + margin-top: 24px; + } + + .mx_FooterLink { + color: #368BD6; + text-decoration: none; + } +} diff --git a/src/components/structures/ErrorView.tsx b/src/components/structures/ErrorView.tsx index 6941dbf16a..3196ba6263 100644 --- a/src/components/structures/ErrorView.tsx +++ b/src/components/structures/ErrorView.tsx @@ -17,21 +17,41 @@ limitations under the License. import * as React from "react"; import * as PropTypes from "prop-types"; -import { _t } from "matrix-react-sdk/src/languageHandler"; +// directly import the style here as this layer does not support rethemedex at this time so no matrix-react-sdk +// scss variables will be accessible. +import "../../../res/css/structures/ErrorView.scss"; interface IProps { + // both of these should already be internationalised title: string; messages?: string[]; } const ErrorView: React.FC = ({title, messages}) => { - return
-
-

{title}

-
- {messages && messages.map(msg =>

- { _t(msg) } -

)} + return
+
+
+ + Riot + +

Failed to start

+
+
+
+
+

{ title }

+ {messages && messages.map(msg =>

+ { msg } +

)} +
+
+
+
; diff --git a/src/vector/incompatible_browser/index.html b/src/vector/incompatible_browser/index.html new file mode 100644 index 0000000000..f7a63518b2 --- /dev/null +++ b/src/vector/incompatible_browser/index.html @@ -0,0 +1,486 @@ + + + + + + + + + + +
+
+ +

Unsupported browser

+
+
+
+
+

Use Riot in a browser

+

It looks like you're using an unsupported browser. To use Riot on the web, please use Chrome, Safari, + FireFox or Edge.

+
+
+
+
+
+ +
+
+
+

+ + Go to Riot.im + +

+
+
+ + diff --git a/src/vector/mobile_guide/index--unsupported-browser.html b/src/vector/mobile_guide/index--unsupported-browser.html deleted file mode 100644 index bbd46b5eb2..0000000000 --- a/src/vector/mobile_guide/index--unsupported-browser.html +++ /dev/null @@ -1,347 +0,0 @@ - - - - - - - - - - - - -
- -
- -
-
- -

Unsupported browser

-
-
-
-
-

Use Riot in a browser

-

It looks like you're using an unsupported browser. To use Riot on the web, please use Chrome, Safari, FireFox or Edge.

-
-
-
-
-
- -
-
-
-

- - Go to Riot.im - -

-
-
- -