San Manjiro

Попробуйте так:

.container__products {
  margin-top: clamp(
    30px, 
    calc(9vw + (1000px - 100vw) * 0.06), 
    90px
  );
}

или сложнее:

:root {
  --min-margin: 30px;
  --max-margin: 90px;
  --min-width: 700px;
  --max-width: 1000px;
}

.container__products {
  margin-top: clamp(
    var(--min-margin), 
    calc(
      var(--min-margin) + 
      (var(--max-margin) - var(--min-margin)) * 
      ((100vw - var(--min-width)) / (var(--max-width) - var(--min-width)))
    ), 
    var(--max-margin)
  );
}

Подбирайте среднее значение (22vw)
Его можно высчитать. Например, блок должен начать уменьшаться на ширине экрана в 1000px. Единица изменения vw есть не что иное как процент от ширины экрана.
Значит нужно посчитать процент 435 от 1000. Это будет 43.5%.
Итого

.s {
  grid-template-columns: 355px clamp(290px, 43.5vw, 435px);
}

minmax(290px, 435px)
https://codepen.io/FragsterAt/pen/OJeXZJN

использую библиотеку rc-slider, к сожалению она не предлагает возможности...

А если изучить документацию повнимательнее? Есть пример с выводом значения в тултипе при перетаскивании, сделать тултип постоянно видимым не проблема.

Используйте flex, он ничем не хуже.

.li_block {
    display: flex;
    justify-content: space-between;
}

UPD: если принципиально grid.

.li_block {
    display: grid;
    grid-template-columns: auto calc(100% / 3);
    justify-items: stretch;
}

Ну самое-самое тупое - завести файл E7-30.php, и в нем парсить массив $_POST.
Если не самое тупое - то нужно разбираться что за роутинг на вашем сайте.

interface NewsProps {
    news: INews,
    post: Object
}
const News:FC<NewsProps> = ({news, post}) => {

Оберни текст например в span сделай ему display: block и при ховере на li увеличивай span c помощью transform: scale(1.1)

Во первых:

{ questionnaireSteps.contactUs && (<StepOneForm
        statusStepOneForm={(value) => {setQuestionnaireSteps({...questionnaireSteps, contactUs: value}); console.log(value)}}
        statusSmsPhone={(value) => setQuestionnaireSteps({...questionnaireSteps, phoneNumberVerification: value})}
        phoneNumber={setPhoneNumber}
    />)}

Во вторых:

const myFunc = (type, value) => {
     console.log(value)
     if(type === 'step') setQuestionnaireSteps({...questionnaireSteps, contactUs: value});
     if(type === 'sms') (value) => setQuestionnaireSteps({...questionnaireSteps, phoneNumberVerification: value})
};
{ questionnaireSteps.contactUs && (<StepOneForm
        statusStepOneForm={value => myFunc('step', value)}
        statusSmsPhone={value => myFunc('sms', value)}
        phoneNumber={setPhoneNumber}
    />)}

В третьих что передаётся в это value и откуда?

Попробуй вывести в консоль не поле, а сам объект. Дело в том, что состояние обновляется только после перерендера компонента. Если нужно получить доступ к уже обновлённому объекту после перерендера, нужно использовать хук useEffect.

В общем решением было отключение сглаживания FXAA в настройках видеокарты nvidia.
Я выбрал конкретно vs code и только для него отключил fxaa, чтобы его не отрубило в играх:)

const [ checked, setChecked ] = React.useState(false);

<input
  type="checkbox"
  checked={checked}
  onChange={e => setChecked(e.target.checked)}
  ...

<button
  disabled={!checked}
  ...

Вон же в документации прямо пример дан.

onValueChange={(values) => {
    const { formattedValue, value } = values;
    // formattedValue = $2,223
    // value ie, 2223
    this.setState({ profit: formattedValue });
  }}

Типо так:

IMaskInput
placeholder="Enter number here"
mask={"d дней"}
lazy={false}
blocks={{ d: { mask: Number } }}
/>