jsx-a11y/iframe-has-title: warn
jsx-a11y/img-has-alt: warn
jsx-a11y/img-redundant-alt: warn
- jsx-a11y/label-has-for: warn
+ jsx-a11y/label-has-for: off
jsx-a11y/mouse-events-have-key-events: warn
jsx-a11y/no-access-key: warn
jsx-a11y/no-distracting-elements: warn
return (
<div className='autosuggest-textarea'>
- <Textarea
- inputRef={this.setTextarea}
- className='autosuggest-textarea__textarea'
- disabled={disabled}
- placeholder={placeholder}
- autoFocus={autoFocus}
- value={value}
- onChange={this.onChange}
- onKeyDown={this.onKeyDown}
- onKeyUp={onKeyUp}
- onBlur={this.onBlur}
- onPaste={this.onPaste}
- style={style}
- />
+ <label>
+ <span style={{ display: 'none' }}>{placeholder}</span>
+ <Textarea
+ inputRef={this.setTextarea}
+ className='autosuggest-textarea__textarea'
+ disabled={disabled}
+ placeholder={placeholder}
+ autoFocus={autoFocus}
+ value={value}
+ onChange={this.onChange}
+ onKeyDown={this.onKeyDown}
+ onKeyUp={onKeyUp}
+ onBlur={this.onBlur}
+ onPaste={this.onPaste}
+ style={style}
+ />
+ </label>
<div className={`autosuggest-textarea__suggestions ${suggestionsHidden || suggestions.isEmpty() ? '' : 'autosuggest-textarea__suggestions--visible'}`}>
{suggestions.map((suggestion, i) => (
const messages = defineMessages({
show: { id: 'column_header.show_settings', defaultMessage: 'Show settings' },
hide: { id: 'column_header.hide_settings', defaultMessage: 'Hide settings' },
+ moveLeft: { id: 'column_header.moveLeft_settings', defaultMessage: 'Move column to the left' },
+ moveRight: { id: 'column_header.moveRight_settings', defaultMessage: 'Move column to the right' },
});
@injectIntl
moveButtons = (
<div key='move-buttons' className='column-header__setting-arrows'>
- <button className='text-btn column-header__setting-btn' onClick={this.handleMoveLeft}><i className='fa fa-chevron-left' /></button>
- <button className='text-btn column-header__setting-btn' onClick={this.handleMoveRight}><i className='fa fa-chevron-right' /></button>
+ <button title={formatMessage(messages.moveLeft)} aria-label={formatMessage(messages.moveLeft)} className='text-btn column-header__setting-btn' onClick={this.handleMoveLeft}><i className='fa fa-chevron-left' /></button>
+ <button title={formatMessage(messages.moveRight)} aria-label={formatMessage(messages.moveRight)} className='text-btn column-header__setting-btn' onClick={this.handleMoveRight}><i className='fa fa-chevron-right' /></button>
</div>
);
} else if (multiColumn) {
return (
<div className={wrapperClassName}>
- <div role='heading' tabIndex={focusable && '0'} className={buttonClassName} aria-label={title} onClick={this.handleTitleClick}>
+ <h1 tabIndex={focusable && '0'} role='button' className={buttonClassName} aria-label={title} onClick={this.handleTitleClick}>
<i className={`fa fa-fw fa-${icon} column-header__icon`} />
{title}
{backButton}
{collapseButton}
</div>
- </div>
+ </h1>
<div className={collapsibleClassName} tabIndex={collapsed && -1} onTransitionEnd={this.handleTransitionEnd}>
<div className='column-header__collapsible-inner'>
const { settings, settingKey, label } = this.props;
return (
- <input
- className='setting-text'
- value={settings.getIn(settingKey)}
- onChange={this.handleChange}
- placeholder={label}
- />
+ <label>
+ <span style={{ display: 'none' }}>{label}</span>
+ <input
+ className='setting-text'
+ value={settings.getIn(settingKey)}
+ onChange={this.handleChange}
+ placeholder={label}
+ />
+ </label>
);
}
return (
<Motion defaultStyle={{ radius: 90 }} style={{ radius: spring(isHovered ? 30 : 90, { stiffness: 180, damping: 12 }) }}>
{({ radius }) =>
- <a // eslint-disable-line jsx-a11y/anchor-has-content
+ <a
href={account.get('url')}
className='account__header__avatar'
+ role='presentation'
target='_blank'
rel='noopener'
style={{ borderRadius: `${radius}px`, backgroundImage: `url(${autoPlayGif || isHovered ? account.get('avatar') : account.get('avatar_static')})` }}
onMouseOut={this.handleMouseOut}
onFocus={this.handleMouseOver}
onBlur={this.handleMouseOut}
- />
+ >
+ <span style={{ display: 'none' }}>{account.get('acct')}</span>
+ </a>
}
</Motion>
);
<div className='compose-form'>
<Collapsable isVisible={this.props.spoiler} fullHeight={50}>
<div className='spoiler-input'>
- <input placeholder={intl.formatMessage(messages.spoiler_placeholder)} value={this.props.spoiler_text} onChange={this.handleChangeSpoilerText} onKeyDown={this.handleKeyDown} type='text' className='spoiler-input__input' id='cw-spoiler-input' />
+ <label>
+ <span style={{ display: 'none' }}>{intl.formatMessage(messages.spoiler_placeholder)}</span>
+ <input placeholder={intl.formatMessage(messages.spoiler_placeholder)} value={this.props.spoiler_text} onChange={this.handleChangeSpoilerText} onKeyDown={this.handleKeyDown} type='text' className='spoiler-input__input' id='cw-spoiler-input' />
+ </label>
</div>
</Collapsable>
return (
<div className='navigation-bar'>
<Permalink href={this.props.account.get('url')} to={`/accounts/${this.props.account.get('id')}`}>
+ <span style={{ display: 'none' }}>{this.props.account.get('acct')}</span>
<Avatar src={this.props.account.get('avatar')} animate size={40} />
</Permalink>
return (
<div className='search'>
- <input
- className='search__input'
- type='text'
- placeholder={intl.formatMessage(messages.placeholder)}
- value={value}
- onChange={this.handleChange}
- onKeyUp={this.handleKeyDown}
- onFocus={this.handleFocus}
- />
+ <label>
+ <span style={{ display: 'none' }}>{intl.formatMessage(messages.placeholder)}</span>
+ <input
+ className='search__input'
+ type='text'
+ placeholder={intl.formatMessage(messages.placeholder)}
+ value={value}
+ onChange={this.handleChange}
+ onKeyUp={this.handleKeyDown}
+ onFocus={this.handleFocus}
+ />
+ </label>
<div role='button' tabIndex='0' className='search__icon' onClick={this.handleClear}>
<i className={`fa fa-search ${hasValue ? '' : 'active'}`} />
return (
<div className='compose-form__upload-button'>
<IconButton icon='camera' title={intl.formatMessage(messages.upload)} disabled={disabled} onClick={this.handleClick} className='compose-form__upload-button-icon' size={18} inverted style={iconStyle} />
- <input
- key={resetFileKey}
- ref={this.setRef}
- type='file'
- multiple={false}
- accept={acceptContentTypes.toArray().join(',')}
- onChange={this.handleChange}
- disabled={disabled}
- style={{ display: 'none' }}
- />
+ <label>
+ <span style={{ display: 'none' }}>{intl.formatMessage(messages.upload)}</span>
+ <input
+ key={resetFileKey}
+ ref={this.setRef}
+ type='file'
+ multiple={false}
+ accept={acceptContentTypes.toArray().join(',')}
+ onChange={this.handleChange}
+ disabled={disabled}
+ style={{ display: 'none' }}
+ />
+ </label>
</div>
);
}
const { columns } = this.props;
header = (
<nav className='drawer__header'>
- <Link to='/getting-started' className='drawer__tab' title={intl.formatMessage(messages.start)}><i role='img' className='fa fa-fw fa-asterisk' /></Link>
+ <Link to='/getting-started' className='drawer__tab' title={intl.formatMessage(messages.start)} aria-label={intl.formatMessage(messages.start)}><i role='img' className='fa fa-fw fa-asterisk' /></Link>
{!columns.some(column => column.get('id') === 'HOME') && (
- <Link to='/timelines/home' className='drawer__tab' title={intl.formatMessage(messages.home_timeline)}><i role='img' className='fa fa-fw fa-home' /></Link>
+ <Link to='/timelines/home' className='drawer__tab' title={intl.formatMessage(messages.home_timeline)} aria-label={intl.formatMessage(messages.home_timeline)}><i role='img' className='fa fa-fw fa-home' /></Link>
)}
{!columns.some(column => column.get('id') === 'NOTIFICATIONS') && (
- <Link to='/notifications' className='drawer__tab' title={intl.formatMessage(messages.notifications)}><i role='img' className='fa fa-fw fa-bell' /></Link>
+ <Link to='/notifications' className='drawer__tab' title={intl.formatMessage(messages.notifications)} aria-label={intl.formatMessage(messages.notifications)}><i role='img' className='fa fa-fw fa-bell' /></Link>
)}
{!columns.some(column => column.get('id') === 'COMMUNITY') && (
- <Link to='/timelines/public/local' className='drawer__tab' title={intl.formatMessage(messages.community)}><i role='img' className='fa fa-fw fa-users' /></Link>
+ <Link to='/timelines/public/local' className='drawer__tab' title={intl.formatMessage(messages.community)} aria-label={intl.formatMessage(messages.community)}><i role='img' className='fa fa-fw fa-users' /></Link>
)}
{!columns.some(column => column.get('id') === 'PUBLIC') && (
- <Link to='/timelines/public' className='drawer__tab' title={intl.formatMessage(messages.public)}><i role='img' className='fa fa-fw fa-globe' /></Link>
+ <Link to='/timelines/public' className='drawer__tab' title={intl.formatMessage(messages.public)} aria-label={intl.formatMessage(messages.public)}><i role='img' className='fa fa-fw fa-globe' /></Link>
)}
- <a href='/settings/preferences' className='drawer__tab' title={intl.formatMessage(messages.preferences)}><i role='img' className='fa fa-fw fa-cog' /></a>
- <a href='/auth/sign_out' className='drawer__tab' data-method='delete' title={intl.formatMessage(messages.logout)}><i role='img' className='fa fa-fw fa-sign-out' /></a>
+ <a href='/settings/preferences' className='drawer__tab' title={intl.formatMessage(messages.preferences)} aria-label={intl.formatMessage(messages.preferences)}><i role='img' className='fa fa-fw fa-cog' /></a>
+ <a href='/auth/sign_out' className='drawer__tab' data-method='delete' title={intl.formatMessage(messages.logout)} aria-label={intl.formatMessage(messages.logout)}><i role='img' className='fa fa-fw fa-sign-out' /></a>
</nav>
);
}
window.addEventListener('keyup', this.handleKeyUp, false);
}
+ componentWillReceiveProps (nextProps) {
+ if (!!nextProps.type && !this.props.type) {
+ this.activeElement = document.activeElement;
+
+ this.getSiblings().forEach(sibling => sibling.setAttribute('inert', true));
+ }
+ }
+
+ componentDidUpdate (prevProps) {
+ if (!this.type && !!prevProps.type) {
+ this.getSiblings().forEach(sibling => sibling.removeAttribute('inert'));
+ this.activeElement.focus();
+ this.activeElement = null;
+ }
+ }
+
componentWillUnmount () {
window.removeEventListener('keyup', this.handleKeyUp);
}
+ getSiblings = () => {
+ return Array(...this.node.parentElement.childNodes).filter(node => node !== this.node);
+ }
+
+ setRef = ref => {
+ this.node = ref;
+ }
+
willEnter () {
return { opacity: 0, scale: 0.98 };
}
willLeave={this.willLeave}
>
{interpolatedStyles =>
- <div className='modal-root'>
+ <div className='modal-root' ref={this.setRef}>
{interpolatedStyles.map(({ key, data: { type, props }, style }) => (
<div key={key} style={{ pointerEvents: visible ? 'auto' : 'none' }}>
<div role='presentation' className='modal-root__overlay' style={{ opacity: style.opacity }} onClick={onClose} />
- <div className='modal-root__container' style={{ opacity: style.opacity, transform: `translateZ(0px) scale(${style.scale})` }}>
+ <div role='dialog' className='modal-root__container' style={{ opacity: style.opacity, transform: `translateZ(0px) scale(${style.scale})` }}>
<BundleContainer fetchComponent={MODAL_COMPONENTS[type]} loading={this.renderLoading} error={this.renderError} renderDelay={200}>
{(SpecificComponent) => <SpecificComponent {...props} onClose={onClose} />}
</BundleContainer>
"column.public": "الخيط العام الموحد",
"column_back_button.label": "العودة",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Публичен канал",
"column_back_button.label": "Назад",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Línia de temps federada",
"column_back_button.label": "Enrere",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Gesamtes bekanntes Netz",
"column_back_button.label": "Zurück",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"defaultMessage": "Hide settings",
"id": "column_header.hide_settings"
},
+ {
+ "defaultMessage": "Move column to the left",
+ "id": "column_header.moveLeft_settings"
+ },
+ {
+ "defaultMessage": "Move column to the right",
+ "id": "column_header.moveRight_settings"
+ },
{
"defaultMessage": "Unpin",
"id": "column_header.unpin"
"column.public": "Federated timeline",
"column_back_button.label": "Back",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Fratara tempolinio",
"column_back_button.label": "Reveni",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Historia federada",
"column_back_button.label": "Atrás",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "نوشتههای همهجا",
"column_back_button.label": "بازگشت",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Yleinen aikajana",
"column_back_button.label": "Takaisin",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Fil public global",
"column_back_button.label": "Retour",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Épingler",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Retirer",
"column.public": "בפרהסיה",
"column_back_button.label": "חזרה",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Federalni timeline",
"column_back_button.label": "Natrag",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Nyilvános",
"column_back_button.label": "Vissza",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Linimasa gabunggan",
"column_back_button.label": "Kembali",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Federata tempolineo",
"column_back_button.label": "Retro",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Timeline federata",
"column_back_button.label": "Indietro",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "連合タイムライン",
"column_back_button.label": "戻る",
"column_header.hide_settings": "設定を隠す",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "ピン留めする",
"column_header.show_settings": "設定を表示",
"column_header.unpin": "ピン留めを外す",
"column.public": "연합 타임라인",
"column_back_button.label": "돌아가기",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "고정하기",
"column_header.show_settings": "Show settings",
"column_header.unpin": "고정 해제",
"column.public": "Globale tijdlijn",
"column_back_button.label": "terug",
"column_header.hide_settings": "Instellingen verbergen",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Vastmaken",
"column_header.show_settings": "Instellingen tonen",
"column_header.unpin": "Losmaken",
"column.public": "Felles tidslinje",
"column_back_button.label": "Tilbake",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Flux public global",
"column_back_button.label": "Tornar",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Penjar",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Despenjar",
"column.public": "Globalna oś czasu",
"column_back_button.label": "Wróć",
"column_header.hide_settings": "Ukryj ustawienia",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Przypnij",
"column_header.show_settings": "Pokaż ustawienia",
"column_header.unpin": "Cofnij przypięcie",
"column.public": "Global",
"column_back_button.label": "Voltar",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Global",
"column_back_button.label": "Voltar",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Глобальная лента",
"column_back_button.label": "Назад",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Закрепить",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Открепить",
"column.public": "Federated timeline",
"column_back_button.label": "Back",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Federe zaman tüneli",
"column_back_button.label": "Geri",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "Глобальна стрічка",
"column_back_button.label": "Назад",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "跨站公共时间轴",
"column_back_button.label": "Back",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "跨站時間軸",
"column_back_button.label": "返回",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
"column.public": "聯盟時間軸",
"column_back_button.label": "上一頁",
"column_header.hide_settings": "Hide settings",
+ "column_header.moveLeft_settings": "Move column to the left",
+ "column_header.moveRight_settings": "Move column to the right",
"column_header.pin": "Pin",
"column_header.show_settings": "Show settings",
"column_header.unpin": "Unpin",
cat aescling's git repositories / mastodon.git / commitdiff