diff --git a/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionConfigurationSection.tsx b/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionConfigurationSection.tsx index 36d460c58b43..06c31d5b528b 100644 --- a/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionConfigurationSection.tsx +++ b/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionConfigurationSection.tsx @@ -40,6 +40,11 @@ type Props = { selectedRetentionSegment: RetentionConfigSegment; setSelectedRetentionSegment: React.Dispatch>; }; +const SegmentedControlContainer = styled.div( + ({ theme }) => css` + margin-top: ${theme.spacings.md}; + `, +); const ConfigSegment = styled.div( ({ theme }) => css` @@ -115,7 +120,7 @@ const IndexSetRotationRetentionConfigurationSection = ({ return (
- <> + data={retentionConfigSegments} value={selectedRetentionSegment} @@ -142,7 +147,7 @@ const IndexSetRotationRetentionConfigurationSection = ({ /> )} - +
); }; diff --git a/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionDataTieringConfiguration.tsx b/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionDataTieringConfiguration.tsx index f4555011cad3..16da387ce791 100644 --- a/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionDataTieringConfiguration.tsx +++ b/graylog2-web-interface/src/components/indices/IndexSetConfigurationForm/IndexSetRotationRetentionDataTieringConfiguration.tsx @@ -15,6 +15,7 @@ * . */ import React from 'react'; +import styled, { css } from 'styled-components'; import { DataTieringVisualisation, DataTieringConfiguration } from 'components/indices/data-tiering'; import type { IndexSetFormValues } from 'stores/indices/IndexSetsStore'; @@ -26,6 +27,12 @@ type Props = { ignoreFieldRestrictions: boolean; }; +const DataTieringConfigContainer = styled.div( + ({ theme }) => css` + margin-top: ${theme.spacings.lg}; + `, +); + const IndexSetRotationRetentionDataTieringConfiguration = ({ values, hiddenFields = [], @@ -41,11 +48,13 @@ const IndexSetRotationRetentionDataTieringConfiguration = ({ archiveData={values.data_tiering?.archive_before_deletion} /> {(!hiddenFields.includes('data_tiering') || ignoreFieldRestrictions) && ( - + + + )} );