From 0f3ee9c786d7f8f37ca6a7ff4077cbd45b2214c7 Mon Sep 17 00:00:00 2001 From: "J. Ryan Stinnett" Date: Tue, 22 Jan 2019 21:51:42 -0600 Subject: [PATCH] Extract auth header logo to new component This will allow `riot-web` to replace only the logo, rather than the whole header. --- res/css/_components.scss | 1 + res/css/views/auth/_AuthHeader.scss | 8 ------ res/css/views/auth/_AuthHeaderLogo.scss | 23 ++++++++++++++++++ src/components/views/auth/AuthHeader.js | 7 +++--- src/components/views/auth/AuthHeaderLogo.js | 27 +++++++++++++++++++++ 5 files changed, 55 insertions(+), 11 deletions(-) create mode 100644 res/css/views/auth/_AuthHeaderLogo.scss create mode 100644 src/components/views/auth/AuthHeaderLogo.js diff --git a/res/css/_components.scss b/res/css/_components.scss index be36ea7a5f..9a5e390933 100644 --- a/res/css/_components.scss +++ b/res/css/_components.scss @@ -27,6 +27,7 @@ @import "./views/auth/_AuthButtons.scss"; @import "./views/auth/_AuthFooter.scss"; @import "./views/auth/_AuthHeader.scss"; +@import "./views/auth/_AuthHeaderLogo.scss"; @import "./views/auth/_AuthPage.scss"; @import "./views/auth/_InteractiveAuthEntryComponents.scss"; @import "./views/auth/_ServerConfig.scss"; diff --git a/res/css/views/auth/_AuthHeader.scss b/res/css/views/auth/_AuthHeader.scss index fb0b3e666b..376864d268 100644 --- a/res/css/views/auth/_AuthHeader.scss +++ b/res/css/views/auth/_AuthHeader.scss @@ -19,11 +19,3 @@ limitations under the License. padding: 25px 50px; box-sizing: border-box; } - -.mx_AuthHeader_logo { - margin-top: 15px; -} - -.mx_AuthHeader_logo img { - width: 100%; -} diff --git a/res/css/views/auth/_AuthHeaderLogo.scss b/res/css/views/auth/_AuthHeaderLogo.scss new file mode 100644 index 0000000000..3d8ab29325 --- /dev/null +++ b/res/css/views/auth/_AuthHeaderLogo.scss @@ -0,0 +1,23 @@ +/* +Copyright 2019 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_AuthHeaderLogo { + margin-top: 15px; +} + +.mx_AuthHeaderLogo img { + width: 100%; +} diff --git a/src/components/views/auth/AuthHeader.js b/src/components/views/auth/AuthHeader.js index 08c9ad41c9..c1d831a70a 100644 --- a/src/components/views/auth/AuthHeader.js +++ b/src/components/views/auth/AuthHeader.js @@ -18,16 +18,17 @@ limitations under the License. 'use strict'; const React = require('react'); +import sdk from '../../../index'; module.exports = React.createClass({ displayName: 'AuthHeader', render: function() { + const AuthHeaderLogo = sdk.getComponent('auth.AuthHeaderLogo'); + return (
-
- Matrix -
+
); }, diff --git a/src/components/views/auth/AuthHeaderLogo.js b/src/components/views/auth/AuthHeaderLogo.js new file mode 100644 index 0000000000..9edf149a83 --- /dev/null +++ b/src/components/views/auth/AuthHeaderLogo.js @@ -0,0 +1,27 @@ +/* +Copyright 2019 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. +*/ + +'use strict'; + +import React from 'react'; + +export default class AuthHeaderLogo extends React.PureComponent { + render() { + return
+ Matrix +
; + } +}