mirror of
https://github.com/mattermost/mattermost.git
synced 2025-02-25 18:55:24 -06:00
MM-55050 - Updating Terms of Service page (#25163)
* MM-55050 - Updating Terms of Service page * Updating button group * Updating button style * Updating bsstyle --------- Co-authored-by: Mattermost Build <build@mattermost.com>
This commit is contained in:
Asaad Mahmood
GitHub
parent
cfa48dd4c4
commit
2c82ff85a5
@ -2,7 +2,7 @@
|
||||
// See LICENSE.txt for license information.
|
||||
|
||||
import React from 'react';
|
||||
import {Button, ButtonGroup} from 'react-bootstrap';
|
||||
import {Button} from 'react-bootstrap';
|
||||
import {FormattedMessage} from 'react-intl';
|
||||
|
||||
import type {TermsOfService as ReduxTermsOfService} from '@mattermost/types/terms_of_service';
|
||||
@ -169,7 +169,7 @@ export default class TermsOfService extends React.PureComponent<TermsOfServicePr
|
||||
termsMarkdownClasses += ' terms-of-service__height--fill';
|
||||
}
|
||||
return (
|
||||
<div>
|
||||
<div className='signup-page-container'>
|
||||
<AnnouncementBar/>
|
||||
<div className='signup-header'>
|
||||
<a
|
||||
@ -183,53 +183,52 @@ export default class TermsOfService extends React.PureComponent<TermsOfServicePr
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<div>
|
||||
<div className='signup-team__container terms-of-service__container'>
|
||||
<div className={termsMarkdownClasses}>
|
||||
<div
|
||||
className='medium-center'
|
||||
data-testid='termsOfService'
|
||||
<div className='signup-team__container terms-of-service__container'>
|
||||
<div className={termsMarkdownClasses}>
|
||||
<div
|
||||
className='medium-center'
|
||||
data-testid='termsOfService'
|
||||
>
|
||||
{messageHtmlToComponent(this.formattedText(this.state.customTermsOfServiceText), {mentions: false})}
|
||||
</div>
|
||||
</div>
|
||||
<div className='terms-of-service__footer medium-center'>
|
||||
<div className='terms-of-service__button-group'>
|
||||
<Button
|
||||
bsStyle={'primary'}
|
||||
disabled={this.state.loadingAgree || this.state.loadingDisagree}
|
||||
id='acceptTerms'
|
||||
onClick={this.handleAcceptTerms}
|
||||
type='submit'
|
||||
>
|
||||
{messageHtmlToComponent(this.formattedText(this.state.customTermsOfServiceText), {mentions: false})}
|
||||
{this.state.loadingAgree && <LoadingSpinner/>}
|
||||
<FormattedMessage
|
||||
id='terms_of_service.agreeButton'
|
||||
defaultMessage={'I Agree'}
|
||||
/>
|
||||
</Button>
|
||||
<Button
|
||||
bsStyle={'default'}
|
||||
className='btn-quaternary'
|
||||
disabled={this.state.loadingAgree || this.state.loadingDisagree}
|
||||
id='rejectTerms'
|
||||
onClick={this.handleRejectTerms}
|
||||
type='reset'
|
||||
>
|
||||
{this.state.loadingDisagree && <LoadingSpinner/>}
|
||||
<FormattedMessage
|
||||
id='terms_of_service.disagreeButton'
|
||||
defaultMessage={'I Disagree'}
|
||||
/>
|
||||
</Button>
|
||||
</div>
|
||||
{Boolean(this.state.serverError) && (
|
||||
<div className='terms-of-service__server-error alert alert-warning'>
|
||||
<WarningIcon/>
|
||||
{' '}
|
||||
{this.state.serverError}
|
||||
</div>
|
||||
</div>
|
||||
<div className='terms-of-service__footer medium-center'>
|
||||
<ButtonGroup className='terms-of-service__button-group'>
|
||||
<Button
|
||||
bsStyle={'primary'}
|
||||
disabled={this.state.loadingAgree || this.state.loadingDisagree}
|
||||
id='acceptTerms'
|
||||
onClick={this.handleAcceptTerms}
|
||||
type='submit'
|
||||
>
|
||||
{this.state.loadingAgree && <LoadingSpinner/>}
|
||||
<FormattedMessage
|
||||
id='terms_of_service.agreeButton'
|
||||
defaultMessage={'I Agree'}
|
||||
/>
|
||||
</Button>
|
||||
<Button
|
||||
bsStyle={'link'}
|
||||
disabled={this.state.loadingAgree || this.state.loadingDisagree}
|
||||
id='rejectTerms'
|
||||
onClick={this.handleRejectTerms}
|
||||
type='reset'
|
||||
>
|
||||
{this.state.loadingDisagree && <LoadingSpinner/>}
|
||||
<FormattedMessage
|
||||
id='terms_of_service.disagreeButton'
|
||||
defaultMessage={'I Disagree'}
|
||||
/>
|
||||
</Button>
|
||||
</ButtonGroup>
|
||||
{Boolean(this.state.serverError) && (
|
||||
<div className='terms-of-service__server-error alert alert-warning'>
|
||||
<WarningIcon/>
|
||||
{' '}
|
||||
{this.state.serverError}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -8,6 +8,12 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
.signup-page-container {
|
||||
display: flex;
|
||||
height: 100vh;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.signup-header {
|
||||
position: fixed;
|
||||
z-index: 5;
|
||||
@ -25,8 +31,12 @@ body {
|
||||
|
||||
.signup-team__container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
max-width: 400px;
|
||||
padding: 100px 0 50px;
|
||||
flex: 1;
|
||||
flex-direction: column;
|
||||
padding: 40px 0 0;
|
||||
margin: 0 auto;
|
||||
|
||||
.medium-center {
|
||||
@ -37,6 +47,7 @@ body {
|
||||
|
||||
.terms-of-service__markdown {
|
||||
min-width: 100vw;
|
||||
flex: 1;
|
||||
padding-top: 3em;
|
||||
padding-bottom: 3em;
|
||||
background-color: #fff;
|
||||
@ -87,7 +98,6 @@ body {
|
||||
|
||||
&.terms-of-service__container {
|
||||
max-width: 100%;
|
||||
padding-top: 33px;
|
||||
}
|
||||
|
||||
.terms-of-service__footer {
|
||||
@ -112,16 +122,6 @@ body {
|
||||
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6);
|
||||
}
|
||||
|
||||
.terms-of-service-error__height--fill {
|
||||
height: calc(100vh - 107px - 4em);
|
||||
min-height: calc(100vh - 107px - 4em);
|
||||
}
|
||||
|
||||
.terms-of-service__height--fill {
|
||||
height: calc(100vh - 69px - 3em);
|
||||
min-height: calc(100vh - 69px - 3em);
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
|
||||
@ -4,6 +4,14 @@
|
||||
display: flex !important;
|
||||
}
|
||||
|
||||
.flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.flex-1 {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.align-items-center {
|
||||
align-items: center !important;
|
||||
-webkit-box-align: center !important;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user