diff --git a/src/data-workspace/entry-form.js b/src/data-workspace/entry-form.js
index 5862d37cd..387a8011a 100644
--- a/src/data-workspace/entry-form.js
+++ b/src/data-workspace/entry-form.js
@@ -1,5 +1,6 @@
import i18n from '@dhis2/d2-i18n'
import { NoticeBox } from '@dhis2/ui'
+import cx from 'classnames'
import PropTypes from 'prop-types'
import React from 'react'
import { useFormState } from 'react-final-form'
@@ -12,7 +13,10 @@ import { FORM_TYPES } from './constants.js'
import { CustomForm } from './custom-form/index.js'
import { DefaultForm } from './default-form.js'
import FilterField from './filter-field.js'
+import { getDisplayOptions } from './section-form/displayOptions.js'
import { SectionForm } from './section-form/index.js'
+import { SanitizedText } from './section-form/sanitized-text.js'
+import styles from './section-form/section.module.css'
const lockedNoticeBoxMessages = {
[LockedStates.LOCKED_DATA_INPUT_PERIOD]: i18n.t(
@@ -47,6 +51,7 @@ export const EntryForm = React.memo(function EntryForm({ dataSet }) {
const formType = dataSet.formType
const Component = formTypeToComponent[formType]
+ const displayOptions = getDisplayOptions(dataSet)
return (
<>
@@ -63,6 +68,28 @@ export const EntryForm = React.memo(function EntryForm({ dataSet }) {
/>
)}
+
+ {displayOptions.customText?.header && (
+
+ {displayOptions.customText?.header}
+
+ )}
+ {displayOptions.customText?.subheader && (
+
+ {displayOptions.customText?.subheader}
+
+ )}
+
>
)
diff --git a/src/data-workspace/section-form/section-form.js b/src/data-workspace/section-form/section-form.js
index 64a28df25..fb29f1690 100644
--- a/src/data-workspace/section-form/section-form.js
+++ b/src/data-workspace/section-form/section-form.js
@@ -4,7 +4,6 @@ import PropTypes from 'prop-types'
import React from 'react'
import { useSectionFilter } from '../../shared/index.js'
import { getDisplayOptions } from './displayOptions.js'
-import { SanitizedText } from './sanitized-text.js'
import { SectionFormSection } from './section.js'
import styles from './section.module.css'
@@ -16,49 +15,23 @@ export const SectionForm = ({ dataSet, globalFilterText }) => {
const displayOptions = getDisplayOptions(dataSet)
- return (
- <>
-
- {displayOptions.customText?.header && (
-
- {displayOptions.customText?.header}
-
- )}
- {displayOptions.customText?.subheader && (
-
- {displayOptions.customText?.subheader}
-
- )}
-
- {dataSet.renderAsTabs ? (
-
- ) : (
- filteredSections.map((s) => (
-
- ))
- )}
- >
+ return dataSet.renderAsTabs ? (
+
+ ) : (
+ filteredSections.map((s) => (
+
+ ))
)
}
diff --git a/src/data-workspace/section-form/section.module.css b/src/data-workspace/section-form/section.module.css
index 2ffe48f6d..83cbec734 100644
--- a/src/data-workspace/section-form/section.module.css
+++ b/src/data-workspace/section-form/section.module.css
@@ -96,17 +96,17 @@
font-size: 1.125rem;
line-height: 1.3;
color: var(--colors-grey900);
- max-width: 1040px;
+ max-inline-size: 1040px;
}
.sectionsSubtitle {
margin: 0;
font-size: 0.875em;
line-height: 1.3;
color: var(--colors-grey800);
- max-width: 1040px;
+ max-inline-size: 1040px;
}
.sectionsCustomText {
- width: 100%;
+ inline-size: 100%;
display: flex;
flex-direction: column;
margin: 0 0 var(--spacers-dp4) 0;