ui: encase Denoising Strength to make it more prominent

This commit is contained in:
blessedcoolant 2023-08-30 09:32:41 +12:00
parent 1b6586dd8c
commit 55f19aff3a
3 changed files with 34 additions and 28 deletions

View File

@ -6,6 +6,7 @@ import IAISlider from 'common/components/IAISlider';
import { setImg2imgStrength } from 'features/parameters/store/generationSlice';
import { memo, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import SubParametersWrapper from '../SubParametersWrapper';
const selector = createSelector(
[stateSelector],
@ -44,20 +45,22 @@ const ImageToImageStrength = () => {
}, [dispatch, initial]);
return (
<IAISlider
label={`${t('parameters.denoisingStrength')}`}
step={step}
min={min}
max={sliderMax}
onChange={handleChange}
handleReset={handleReset}
value={img2imgStrength}
isInteger={false}
withInput
withSliderMarks
withReset
sliderNumberInputProps={{ max: inputMax }}
/>
<SubParametersWrapper>
<IAISlider
label={`${t('parameters.denoisingStrength')}`}
step={step}
min={min}
max={sliderMax}
onChange={handleChange}
handleReset={handleReset}
value={img2imgStrength}
isInteger={false}
withInput
withSliderMarks
withReset
sliderNumberInputProps={{ max: inputMax }}
/>
</SubParametersWrapper>
);
};

View File

@ -2,7 +2,7 @@ import { Flex, Text } from '@chakra-ui/react';
import { ReactNode, memo } from 'react';
type SubParameterWrapperProps = {
children: ReactNode[];
children: ReactNode | ReactNode[];
label?: string;
};

View File

@ -3,6 +3,7 @@ import { stateSelector } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { defaultSelectorOptions } from 'app/store/util/defaultMemoizeOptions';
import IAISlider from 'common/components/IAISlider';
import SubParametersWrapper from 'features/parameters/components/Parameters/SubParametersWrapper';
import { memo, useCallback } from 'react';
import { useTranslation } from 'react-i18next';
import { setSDXLImg2ImgDenoisingStrength } from '../store/sdxlSlice';
@ -34,19 +35,21 @@ const ParamSDXLImg2ImgDenoisingStrength = () => {
}, [dispatch]);
return (
<IAISlider
label={`${t('parameters.denoisingStrength')}`}
step={0.01}
min={0}
max={1}
onChange={handleChange}
handleReset={handleReset}
value={sdxlImg2ImgDenoisingStrength}
isInteger={false}
withInput
withSliderMarks
withReset
/>
<SubParametersWrapper>
<IAISlider
label={`${t('parameters.denoisingStrength')}`}
step={0.01}
min={0}
max={1}
onChange={handleChange}
handleReset={handleReset}
value={sdxlImg2ImgDenoisingStrength}
isInteger={false}
withInput
withSliderMarks
withReset
/>
</SubParametersWrapper>
);
};