diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/help-modal.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/help-modal.tsx index 7469dd262a..fdbe7b12a2 100644 --- a/services/web/frontend/js/features/source-editor/components/table-generator/help-modal.tsx +++ b/services/web/frontend/js/features/source-editor/components/table-generator/help-modal.tsx @@ -8,10 +8,12 @@ import { import OLButton from '@/shared/components/ol/ol-button' import { useTabularContext } from './contexts/tabular-context' import { Trans, useTranslation } from 'react-i18next' +import { useFeatureFlag } from '@/shared/context/split-test-context' export const TableGeneratorHelpModal = () => { const { helpShown, hideHelp } = useTabularContext() const { t } = useTranslation() + const themed = useFeatureFlag('themed-modals') if (!helpShown) return null return ( @@ -19,6 +21,7 @@ export const TableGeneratorHelpModal = () => { show={helpShown} onHide={hideHelp} className="table-generator-help-modal" + themed={themed} > {t('help')} diff --git a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx index 32d232df7d..6b6dee563d 100644 --- a/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx +++ b/services/web/frontend/js/features/source-editor/components/table-generator/toolbar/column-width-modal/modal.tsx @@ -32,6 +32,7 @@ import OLCol from '@/shared/components/ol/ol-col' import OLRow from '@/shared/components/ol/ol-row' import OLForm from '@/shared/components/ol/ol-form' import MaterialIcon from '@/shared/components/material-icon' +import { useFeatureFlag } from '@/shared/context/split-test-context' type UnitDescription = { label: string; tooltip?: string } | undefined @@ -49,6 +50,7 @@ const ColumnWidthModalBody = () => { const { selection } = useSelectionContext() const { positions, table } = useTableContext() const { t } = useTranslation() + const themed = useFeatureFlag('themed-modals') const [currentUnit, setCurrentUnit] = useState( '%' ) @@ -137,6 +139,7 @@ const ColumnWidthModalBody = () => { show={columnWidthModalShown} onHide={closeColumnWidthModal} className="table-generator-width-modal" + themed={themed} > {t('set_column_width')} diff --git a/services/web/frontend/stylesheets/components/form.scss b/services/web/frontend/stylesheets/components/form.scss index b6d6e775c6..b517397541 100644 --- a/services/web/frontend/stylesheets/components/form.scss +++ b/services/web/frontend/stylesheets/components/form.scss @@ -531,6 +531,7 @@ input[type='range'] { input.form-control[type='text'], input.form-control[type='search'], +input.form-control[type='number'], textarea.form-control { color: var(--input-field-color); background-color: var(--input-field-bg); diff --git a/services/web/frontend/stylesheets/pages/all.scss b/services/web/frontend/stylesheets/pages/all.scss index 4b0224b767..e281d36900 100644 --- a/services/web/frontend/stylesheets/pages/all.scss +++ b/services/web/frontend/stylesheets/pages/all.scss @@ -34,7 +34,7 @@ @import 'editor/tags-input'; @import 'editor/review-panel'; @import 'editor/editor-floating-menu'; -@import 'editor/table-generator-column-width-modal'; +@import 'editor/table-generator'; @import 'editor/math-preview'; @import 'editor/references-search'; @import 'editor/editor-survey'; diff --git a/services/web/frontend/stylesheets/pages/editor/table-generator-column-width-modal.scss b/services/web/frontend/stylesheets/pages/editor/table-generator-column-width-modal.scss deleted file mode 100644 index 48e1c1df63..0000000000 --- a/services/web/frontend/stylesheets/pages/editor/table-generator-column-width-modal.scss +++ /dev/null @@ -1,13 +0,0 @@ -.table-generator-width-modal { - .table-generator-width-label { - width: 100%; - } - - .table-generator-usepackage-copy { - display: flex; - justify-content: space-between; - padding: var(--spacing-03) var(--spacing-05); - background: var(--bg-light-secondary); - border: 1px solid var(--border-primary-dark); - } -} diff --git a/services/web/frontend/stylesheets/pages/editor/table-generator.scss b/services/web/frontend/stylesheets/pages/editor/table-generator.scss new file mode 100644 index 0000000000..789603e12d --- /dev/null +++ b/services/web/frontend/stylesheets/pages/editor/table-generator.scss @@ -0,0 +1,25 @@ +.table-generator-help-modal { + @include themed-links; + + --bs-code-color: var(--content-secondary-themed); +} + +.table-generator-width-modal { + --bs-code-color: var(--content-secondary-themed); + + .form-label { + color: var(--content-secondary-themed); + } + + .table-generator-width-label { + width: 100%; + } + + .table-generator-usepackage-copy { + display: flex; + justify-content: space-between; + padding: var(--spacing-03) var(--spacing-05); + background: var(--bg-secondary-themed); + border: 1px solid var(--border-divider-themed); + } +}