diff options
author | Anike Arni <aarni@thoughtworks.com> | 2017-02-22 10:52:52 -0300 |
---|---|---|
committer | Anike Arni <aarni@thoughtworks.com> | 2017-02-22 15:22:55 -0300 |
commit | 38c73f2e67173d5358dd4bb7e17b1e5b9c283f22 (patch) | |
tree | b7fc2c890eb7242877e47cf926a4aa45a171bcce /web-ui/src/login/about | |
parent | f7bd078bcce2d6cad419fceb55ab71415cda4d33 (diff) |
[#907] Add pixelated welcome message to login
with @tuliocasagrande and @thaissiqueira
Diffstat (limited to 'web-ui/src/login/about')
-rw-r--r-- | web-ui/src/login/about/pixelated-welcome.scss | 50 | ||||
-rw-r--r-- | web-ui/src/login/about/pixelated_welcome.js | 36 |
2 files changed, 86 insertions, 0 deletions
diff --git a/web-ui/src/login/about/pixelated-welcome.scss b/web-ui/src/login/about/pixelated-welcome.scss new file mode 100644 index 00000000..1e63f7c8 --- /dev/null +++ b/web-ui/src/login/about/pixelated-welcome.scss @@ -0,0 +1,50 @@ +/* + * Copyright (c) 2017 ThoughtWorks, Inc. + * + * Pixelated is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * Pixelated is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with Pixelated. If not, see <http://www.gnu.org/licenses/>. + */ + +@import "~scss/base/colors"; + +.pixelated-welcome { + display: none; +} + +@media only screen and (min-width : 960px) { + .pixelated-welcome { + font-size: 0.9em; + color: $medium_grey; + display: flex; + font-weight: 300; + flex-direction: column; + align-self: flex-end; + float: right; + width: 34%; + margin-right: 8%; + margin-top: -7.8em; + padding: 0; + + h3 { + font-weight: normal; + font-size: 1.2em; + margin-top: 0; + } + } + + .welcome-logo { + order: 1; + width: 90%; + height: 15em; + } +} diff --git a/web-ui/src/login/about/pixelated_welcome.js b/web-ui/src/login/about/pixelated_welcome.js new file mode 100644 index 00000000..82a7d7d0 --- /dev/null +++ b/web-ui/src/login/about/pixelated_welcome.js @@ -0,0 +1,36 @@ +/* + * Copyright (c) 2017 ThoughtWorks, Inc. + * + * Pixelated is free software: you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * Pixelated is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + * along with Pixelated. If not, see <http://www.gnu.org/licenses/>. + */ + +import React from 'react'; +import { translate } from 'react-i18next'; + +import './pixelated-welcome.scss'; + +export const PixelatedWelcome = ({ t }) => ( + <div className='pixelated-welcome'> + <img className='welcome-logo' src='/public/images/welcome.svg' alt={t('login.welcome-image-alt')} /> + <div> + <h3>{t('login.welcome-message')}</h3> + </div> + </div> +); + +PixelatedWelcome.propTypes = { + t: React.PropTypes.func.isRequired +}; + +export default translate('', { wait: true })(PixelatedWelcome); |