Added a "buttons" component file to css stack.

Removed button style spec from group form into a re-usable class.
This commit is contained in:
Dank Gabs 2019-07-20 00:10:29 -04:00
parent e008cb292a
commit 9637e35e17
4 changed files with 22 additions and 19 deletions

View File

@ -82,7 +82,6 @@ class Create extends React.PureComponent {
placeholder={intl.formatMessage(messages.title)} placeholder={intl.formatMessage(messages.title)}
/> />
</div> </div>
<div> <div>
<input <input
className='group-form__input' className='group-form__input'
@ -92,12 +91,10 @@ class Create extends React.PureComponent {
placeholder={intl.formatMessage(messages.description)} placeholder={intl.formatMessage(messages.description)}
/> />
</div> </div>
<div> <div>
<label htmlFor='group_cover_image' className={classNames('group-form__file-label', { 'group-form__file-label--selected': coverImage !== null })}> <label htmlFor='group_cover_image' className={classNames('group-form__file-label', { 'group-form__file-label--selected': coverImage !== null })}>
<Icon id='camera' /> {intl.formatMessage(coverImage === null ? messages.coverImage : messages.coverImageChange)} <Icon id='camera' /> {intl.formatMessage(coverImage === null ? messages.coverImage : messages.coverImageChange)}
</label> </label>
<input <input
type='file' type='file'
className='group-form__file' className='group-form__file'
@ -105,8 +102,7 @@ class Create extends React.PureComponent {
disabled={disabled} disabled={disabled}
onChange={this.handleCoverImageChange} onChange={this.handleCoverImageChange}
/> />
<button className='standard-small'>{intl.formatMessage(messages.create)}</button>
<button>{intl.formatMessage(messages.create)}</button>
</div> </div>
</form> </form>
); );

View File

@ -18,6 +18,7 @@
@import 'gabsocial/components'; @import 'gabsocial/components';
// COMPONENTS // COMPONENTS
@import 'gabsocial/components/buttons';
@import 'gabsocial/components/tabs-bar'; @import 'gabsocial/components/tabs-bar';
@import 'gabsocial/components/dropdown-menu'; @import 'gabsocial/components/dropdown-menu';
@import 'gabsocial/components/modal'; @import 'gabsocial/components/modal';

View File

@ -0,0 +1,19 @@
button {
&.standard {
&-small {
background: $gab-blue;
color: white;
text-transform: uppercase;
letter-spacing: 1px;
font-size: 14px;
border: none;
border-radius: 4px;
height: 25px;
padding: 1px 12px;
font-weight: bold;
}
}
}

View File

@ -49,18 +49,5 @@
position: absolute; position: absolute;
pointer-events: none; pointer-events: none;
} }
button {float: right;}
button {
background: $gab-blue;
color: white;
text-transform: uppercase;
letter-spacing: 1px;
font-size: 14px;
border: none;
border-radius: 4px;
height: 25px;
padding: 1px 12px;
font-weight: bold;
float: right;
}
} }