Skip to content

Commit a5dfafe

Browse files
committed
Revert "fix editor3 authoring header layout (#5084)"
This reverts commit 1b4d285.
1 parent ac3e82c commit a5dfafe

File tree

3 files changed

+52
-47
lines changed

3 files changed

+52
-47
lines changed

scripts/apps/authoring/views/authoring-header.html

Lines changed: 26 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -450,36 +450,38 @@
450450
</div>
451451

452452
<!-- custom text editor fields -->
453-
<div
453+
<div class="authoring-header__item"
454454
ng-repeat="field in fields track by field._id"
455455
ng-if="field.field_type === 'text' && editor[field._id].section === 'header'"
456456
sd-width="{{ editor[field._id].sdWidth || 'full' }}"
457457
order="{{ editor[field._id].order }}"
458458
ng-attr-title="{{schema[field._id].readonly === true ? readOnlyLabel : ''}}"
459459
>
460-
<div sd-editor3
461-
data-path-to-value="'extra' + FIELD_KEY_SEPARATOR + field._id"
462-
data-single-line="field.field_options.single"
463-
data-value="item.extra[field._id]"
464-
data-bind-to-value="compareView"
465-
data-scroll-container=".page-content-container--scrollable"
466-
data-language="item.language"
467-
data-on-change="autosave(item)"
468-
data-read-only="!_editable || schema[field._id].readonly === true"
469-
data-editor-format="editor[field._id].formatOptions"
470-
data-item="item"
471-
data-refresh-trigger="refreshTrigger"
472-
data-tabindex="editor[field._id].order"
473-
data-limit="schema[field._id].maxlength"
474-
data-soft-limit="editor[field._id].maxSoftLength"
475-
data-header-styles="true"
476-
data-helper-text="field.helper_text"
477-
data-field-id="field._id"
478-
data-field-label="field.display_name"
479-
data-required="schema[field._id].required"
480-
data-validation-error="error[field.display_name.toLowerCase()] || error.extra[field._id]"
481-
data-validate-characters="schema[field._id].validate_characters"
482-
></div>
460+
<div class="authoring-header__input-holder">
461+
<div sd-editor3
462+
data-path-to-value="'extra' + FIELD_KEY_SEPARATOR + field._id"
463+
data-single-line="field.field_options.single"
464+
data-value="item.extra[field._id]"
465+
data-bind-to-value="compareView"
466+
data-scroll-container=".page-content-container--scrollable"
467+
data-language="item.language"
468+
data-on-change="autosave(item)"
469+
data-read-only="!_editable || schema[field._id].readonly === true"
470+
data-editor-format="editor[field._id].formatOptions"
471+
data-item="item"
472+
data-refresh-trigger="refreshTrigger"
473+
data-tabindex="editor[field._id].order"
474+
data-limit="schema[field._id].maxlength"
475+
data-soft-limit="editor[field._id].maxSoftLength"
476+
data-header-styles="true"
477+
data-helper-text="field.helper_text"
478+
data-field-id="field._id"
479+
data-field-label="field.display_name"
480+
data-required="schema[field._id].required"
481+
data-validation-error="error[field.display_name.toLowerCase()] || error.extra[field._id]"
482+
data-validate-characters="schema[field._id].validate_characters"
483+
></div>
484+
</div>
483485
</div>
484486

485487
<!-- custom date editor fields -->

scripts/core/editor3/directive.tsx

Lines changed: 26 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,6 @@ import {ValidateCharactersConnected} from 'apps/authoring/authoring/ValidateChar
3636
import {Spacer} from 'core/ui/components/Spacer';
3737
import {copyEmbeddedArticlesIntoAssociations} from 'apps/authoring-react/copy-embedded-articles-into-associations';
3838
import {findParentScope} from 'core/find-parent-scope';
39-
import {classnames} from '@sourcefabric/common';
4039

4140
/**
4241
* @ngdoc directive
@@ -361,12 +360,17 @@ class Editor3Directive {
361360

362361
ReactDOM.unmountComponentAtNode(element);
363362

364-
const textStatistics = this.limit != null ? (
363+
const textStatistics = (
365364
<Spacer h gap="8" alignItems="center" noWrap noGrow>
366365
<TextStatisticsConnected />
367-
<CharacterCountConfigButton field={this.fieldId} />
366+
367+
{
368+
this.limit != null && (
369+
<CharacterCountConfigButton field={this.fieldId} />
370+
)
371+
}
368372
</Spacer>
369-
) : null;
373+
);
370374

371375
const validationErrors = (() => {
372376
if (this.validationError != null) {
@@ -432,19 +436,27 @@ class Editor3Directive {
432436
};
433437

434438
const getTemplateForHeader = () => {
435-
const itemClasses = classnames(
436-
'authoring-header__item',
437-
{'sd-validate': this.required},
438-
);
439-
440439
return (
441-
<div className={itemClasses}>
442-
<label className="authoring-header__item-label">
440+
<div style={{display: 'flex'}} className="sd-input-style">
441+
<div className="authoring-header__item-label">
443442
{fieldName}
444-
</label>
443+
{this.required && (
444+
<span>
445+
&nbsp;
446+
<span
447+
aria-label={gettext('required')}
448+
style={{color: 'red', fontSize: 12}}
449+
>
450+
*
451+
</span>
452+
</span>
453+
)}
454+
</div>
445455

446-
<div className="authoring-header__input-holder sd-input-style">
447-
{editor3}
456+
<div style={{flexGrow: 1}}>
457+
<div>
458+
{editor3}
459+
</div>
448460

449461
<Spacer h gap="32" justifyContent="space-between" alignItems="center" noWrap>
450462
{

scripts/core/editor3/styles.scss

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -383,15 +383,6 @@ $editor-styleButton-size: 3rem;
383383
}
384384
}
385385
}
386-
387-
.authoring-header__item {
388-
.Editor3-root {
389-
&.no-toolbar { /* avoid extra padding in header */
390-
padding-block-start: 0;
391-
}
392-
}
393-
}
394-
395386
.Editor3-editor {
396387
cursor: text;
397388
font-size: 16px;

0 commit comments

Comments
 (0)