Change radio button design to be consistent with that of the directory explorer
Signed-off-by: Thibaut Girka <thib@sitedethib.com>pull/1418/head
parent
70e64206be
commit
d95dd3883e
|
@ -14,6 +14,7 @@ import { openModal } from 'flavours/glitch/actions/modal';
|
|||
import MissingIndicator from 'flavours/glitch/components/missing_indicator';
|
||||
import LoadingIndicator from 'flavours/glitch/components/loading_indicator';
|
||||
import Icon from 'flavours/glitch/components/icon';
|
||||
import RadioButton from 'flavours/glitch/components/radio_button';
|
||||
|
||||
const messages = defineMessages({
|
||||
deleteMessage: { id: 'confirmations.delete_list.message', defaultMessage: 'Are you sure you want to permanently delete this list?' },
|
||||
|
@ -176,7 +177,7 @@ class ListTimeline extends React.PureComponent {
|
|||
multiColumn={multiColumn}
|
||||
bindToDocument={!multiColumn}
|
||||
>
|
||||
<div className='column-header__links'>
|
||||
<div className='column-settings__row column-header__links'>
|
||||
<button className='text-btn column-header__setting-btn' tabIndex='0' onClick={this.handleEditClick}>
|
||||
<Icon id='pencil' /> <FormattedMessage id='lists.edit' defaultMessage='Edit list' />
|
||||
</button>
|
||||
|
@ -187,19 +188,14 @@ class ListTimeline extends React.PureComponent {
|
|||
</div>
|
||||
|
||||
{ replies_policy !== undefined && (
|
||||
<div>
|
||||
<div role='group' aria-labelledby={`list-${id}-replies-policy`}>
|
||||
<span id={`list-${id}-replies-policy`} className='column-settings__section'>
|
||||
<FormattedMessage id='lists.replies_policy.title' defaultMessage='Show replies to:' />
|
||||
</span>
|
||||
<div className='column-settings__row'>
|
||||
<fieldset>
|
||||
<legend><FormattedMessage id='lists.replies_policy.title' defaultMessage='Show replies to:' /></legend>
|
||||
{ ['no_replies', 'list_replies', 'all_replies'].map(policy => (
|
||||
<div className='setting-radio'>
|
||||
<input className='setting-radio__input' id={['setting', 'radio', id, policy].join('-')} type='radio' value={policy} checked={replies_policy === policy} onChange={this.handleRepliesPolicyChange} />
|
||||
<label className='setting-radio__label' htmlFor={['setting', 'radio', id, policy].join('-')}>
|
||||
<FormattedMessage {...messages[policy]} />
|
||||
</label>
|
||||
</div>
|
||||
<RadioButton name='order' value={policy} label={intl.formatMessage(messages[policy])} checked={replies_policy === policy} onChange={this.handleRepliesPolicyChange} />
|
||||
))}
|
||||
</fieldset>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
|
|
@ -1356,7 +1356,6 @@ button.icon-button.active i.fa-retweet {
|
|||
}
|
||||
|
||||
.setting-toggle__label,
|
||||
.setting-radio__label,
|
||||
.setting-meta__label {
|
||||
color: $darker-text-color;
|
||||
display: inline-block;
|
||||
|
@ -1365,25 +1364,8 @@ button.icon-button.active i.fa-retweet {
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.setting-radio {
|
||||
.column-settings__row .radio-button {
|
||||
display: block;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
.setting-radio__label {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.column-settings__row legend {
|
||||
color: $darker-text-color;
|
||||
cursor: default;
|
||||
display: block;
|
||||
font-weight: 500;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.setting-radio__input {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.setting-meta__label {
|
||||
|
|
Loading…
Reference in New Issue