diff options
-rw-r--r-- | service/test/functional/features/environment.py | 1 | ||||
-rw-r--r-- | web-ui/src/account_recovery/page.scss | 1 | ||||
-rw-r--r-- | web-ui/src/common/link_button/link_button.js | 29 | ||||
-rw-r--r-- | web-ui/src/common/link_button/link_button.scss | 32 | ||||
-rw-r--r-- | web-ui/src/common/link_button/link_button.spec.js | 4 |
5 files changed, 50 insertions, 17 deletions
diff --git a/service/test/functional/features/environment.py b/service/test/functional/features/environment.py index eefa22b7..9c6a6b02 100644 --- a/service/test/functional/features/environment.py +++ b/service/test/functional/features/environment.py @@ -67,6 +67,7 @@ def before_all(context): def before_tag(context, tag): if tag == "smoke": + context.username = 'testuser_{}'.format(uuid.uuid4()) utils.create_user(context) diff --git a/web-ui/src/account_recovery/page.scss b/web-ui/src/account_recovery/page.scss index c61c855e..378bf63c 100644 --- a/web-ui/src/account_recovery/page.scss +++ b/web-ui/src/account_recovery/page.scss @@ -59,6 +59,7 @@ section { h1 { font-size: 1.3em; font-weight: 600; + text-align: center; } p { diff --git a/web-ui/src/common/link_button/link_button.js b/web-ui/src/common/link_button/link_button.js index e18903f2..e7fd80b0 100644 --- a/web-ui/src/common/link_button/link_button.js +++ b/web-ui/src/common/link_button/link_button.js @@ -16,33 +16,36 @@ */ import React from 'react'; -import RaisedButton from 'material-ui/RaisedButton'; +import FlatButton from 'material-ui/FlatButton'; -import '../submit_button/submit_button.scss'; import './link_button.scss'; const labelStyle = { textTransform: 'none', - fontSize: '1em', - lineHeight: '48px', - color: '#ff9c00' + color: 'inherit', + fontSize: 'inherit', + width: '100%', + padding: '0' }; -const buttonStyle = { - height: '48px', - backgroundColor: '#fff' +const linkButtonStyle = { + color: 'inherit', + borderRadius: '0', + minHeight: '36px', + height: 'auto', + lineHeight: '20px', + padding: '12px 0' }; const LinkButton = ({ buttonText, href }) => ( - <div className='submit-button link-button'> - <RaisedButton + <div className='link-button'> + <FlatButton href={href} containerElement='a' label={buttonText} labelStyle={labelStyle} - buttonStyle={buttonStyle} - overlayStyle={buttonStyle} - fullWidth + hoverColor={'#ff9c00'} + style={linkButtonStyle} /> </div> ); diff --git a/web-ui/src/common/link_button/link_button.scss b/web-ui/src/common/link_button/link_button.scss index 9318e08e..3b4a534c 100644 --- a/web-ui/src/common/link_button/link_button.scss +++ b/web-ui/src/common/link_button/link_button.scss @@ -15,7 +15,35 @@ * along with Pixelated. If not, see <http://www.gnu.org/licenses/>. */ -.link-button > div { +@import "~scss/base/colors"; + +.link-button > a { + width: 100%; +} + +.link-button { + width: 100%; margin-top: 2em; - border: 1px solid #ff9c00; + border: 2px solid $light_orange; + border-radius: 2px; + font-size: 1em; + color: $light_orange; + &:hover { + color: $white; + } +} + +@media only screen and (min-width : 500px) { + .link-button { + width: 70%; + align-self: center; + } +} + +@media only screen and (min-width : 960px) { + .link-button { + width: 300px; + margin-bottom: 1em; + font-size: 0.8em; + } } diff --git a/web-ui/src/common/link_button/link_button.spec.js b/web-ui/src/common/link_button/link_button.spec.js index dd040d28..945afffe 100644 --- a/web-ui/src/common/link_button/link_button.spec.js +++ b/web-ui/src/common/link_button/link_button.spec.js @@ -11,10 +11,10 @@ describe('LinkButton', () => { }); it('renders link button with given button text', () => { - expect(linkButton.find('RaisedButton').props().label).toEqual('Go To Link'); + expect(linkButton.find('FlatButton').props().label).toEqual('Go To Link'); }); it('renders link button with given href', () => { - expect(linkButton.find('RaisedButton').props().href).toEqual('/some-link'); + expect(linkButton.find('FlatButton').props().href).toEqual('/some-link'); }); }); |