updated form labels and fields, updated translations

This commit is contained in:
Richard 2020-01-18 14:22:58 +01:00
parent 5481a9e917
commit 6ba07eabe8

View file

@ -136,12 +136,13 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
<div> <div>
<form onSubmit={linkEvent(this, this.handlePostSubmit)}> <form onSubmit={linkEvent(this, this.handlePostSubmit)}>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-2 col-form-label"> <label class="col-sm-2 col-form-label" for="post-url">
<T i18nKey="url">#</T> { i18n.t('url') }
</label> </label>
<div class="col-sm-10"> <div class="col-sm-10">
<input <input
type="url" type="url"
id="post-url"
class="form-control" class="form-control"
value={this.state.postForm.url} value={this.state.postForm.url}
onInput={linkEvent(this, this.handlePostUrlChange)} onInput={linkEvent(this, this.handlePostUrlChange)}
@ -165,7 +166,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
className={`${UserService.Instance.user && className={`${UserService.Instance.user &&
'pointer'} d-inline-block mr-2 float-right text-muted small font-weight-bold`} 'pointer'} d-inline-block mr-2 float-right text-muted small font-weight-bold`}
> >
<T i18nKey="upload_image">#</T> { i18n.t('upload_image') }
</label> </label>
<input <input
id="file-upload" id="file-upload"
@ -185,7 +186,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
target="_blank" target="_blank"
class="mr-2 d-inline-block float-right text-muted small font-weight-bold" class="mr-2 d-inline-block float-right text-muted small font-weight-bold"
> >
<T i18nKey="archive_link">#</T> { i18n.t('archive_link') }
</a> </a>
)} )}
{this.state.imageLoading && ( {this.state.imageLoading && (
@ -199,7 +200,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
{this.state.crossPosts.length > 0 && ( {this.state.crossPosts.length > 0 && (
<> <>
<div class="my-1 text-muted small font-weight-bold"> <div class="my-1 text-muted small font-weight-bold">
<T i18nKey="cross_posts">#</T> { i18n.t('cross_posts') }
</div> </div>
<PostListings showCommunity posts={this.state.crossPosts} /> <PostListings showCommunity posts={this.state.crossPosts} />
</> </>
@ -207,12 +208,13 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-2 col-form-label"> <label class="col-sm-2 col-form-label" for="post-title">
<T i18nKey="title">#</T> { i18n.t('title') }
</label> </label>
<div class="col-sm-10"> <div class="col-sm-10">
<textarea <textarea
value={this.state.postForm.name} value={this.state.postForm.name}
id="post-title"
onInput={linkEvent(this, this.handlePostNameChange)} onInput={linkEvent(this, this.handlePostNameChange)}
class="form-control" class="form-control"
required required
@ -223,20 +225,22 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
{this.state.suggestedPosts.length > 0 && ( {this.state.suggestedPosts.length > 0 && (
<> <>
<div class="my-1 text-muted small font-weight-bold"> <div class="my-1 text-muted small font-weight-bold">
<T i18nKey="related_posts">#</T> { i18n.t('related_posts') }
</div> </div>
<PostListings posts={this.state.suggestedPosts} /> <PostListings posts={this.state.suggestedPosts} />
</> </>
)} )}
</div> </div>
</div> </div>
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-2 col-form-label"> <label class="col-sm-2 col-form-label" for="post-body">
<T i18nKey="body">#</T> { i18n.t('body') }
</label> </label>
<div class="col-sm-10"> <div class="col-sm-10">
<textarea <textarea
value={this.state.postForm.body} value={this.state.postForm.body}
id="post-body"
onInput={linkEvent(this, this.handlePostBodyChange)} onInput={linkEvent(this, this.handlePostBodyChange)}
className={`form-control ${this.state.previewMode && 'd-none'}`} className={`form-control ${this.state.previewMode && 'd-none'}`}
rows={4} rows={4}
@ -254,7 +258,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
.previewMode && 'active'}`} .previewMode && 'active'}`}
onClick={linkEvent(this, this.handlePreviewToggle)} onClick={linkEvent(this, this.handlePreviewToggle)}
> >
<T i18nKey="preview">#</T> { i18n.t('preview') }
</button> </button>
)} )}
<a <a
@ -262,18 +266,19 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
target="_blank" target="_blank"
class="d-inline-block float-right text-muted small font-weight-bold" class="d-inline-block float-right text-muted small font-weight-bold"
> >
<T i18nKey="formatting_help">#</T> { i18n.t('formatting_help') }
</a> </a>
</div> </div>
</div> </div>
{!this.props.post && ( {!this.props.post && (
<div class="form-group row"> <div class="form-group row">
<label class="col-sm-2 col-form-label"> <label class="col-sm-2 col-form-label" for="post-community">
<T i18nKey="community">#</T> { i18n.t('community') }
</label> </label>
<div class="col-sm-10"> <div class="col-sm-10">
<select <select
class="form-control" class="form-control"
id="post-community"
value={this.state.postForm.community_id} value={this.state.postForm.community_id}
onInput={linkEvent(this, this.handlePostCommunityChange)} onInput={linkEvent(this, this.handlePostCommunityChange)}
> >
@ -290,12 +295,13 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
<div class="form-check"> <div class="form-check">
<input <input
class="form-check-input" class="form-check-input"
id="post-nsfw"
type="checkbox" type="checkbox"
checked={this.state.postForm.nsfw} checked={this.state.postForm.nsfw}
onChange={linkEvent(this, this.handlePostNsfwChange)} onChange={linkEvent(this, this.handlePostNsfwChange)}
/> />
<label class="form-check-label"> <label class="form-check-label" for="post-nsfw">
<T i18nKey="nsfw">#</T> { i18n.t('nsfw') }
</label> </label>
</div> </div>
</div> </div>
@ -320,7 +326,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
class="btn btn-secondary" class="btn btn-secondary"
onClick={linkEvent(this, this.handleCancel)} onClick={linkEvent(this, this.handleCancel)}
> >
<T i18nKey="cancel">#</T> { i18n.t('cancel') }
</button> </button>
)} )}
</div> </div>