Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Предлагаю внутри Steps добавить поддержку рендера под мобилу, планшет и десктоп #506

Closed
bwn-z opened this issue Feb 6, 2023 · 3 comments
Assignees

Comments

@bwn-z
Copy link

bwn-z commented Feb 6, 2023

Описание

Компонент Steps
есть свойство isVerticalAlign: boolean, предлагаю, что можно было передавать как
isVerticalAlign={false} или isVerticalAlign={{ mobile: false, tablet: { s: false, m: false, l: true}, desktop: true}}

Поведение

В зависимости от экрана клиента будет рендериться либо вертикально, либо горизонтально. Для большинства наших клиентов подходит десктоп, но мы делаем адаптивную верстку. Сейчас нам придется использовать useMedia хук, чтобы понимать экран клиента и рендерить в нужном виде: на маленьких экран рендерить Steps - горизонтально, на больших - вертикально

Чек лист

Внешний вид

Без изменений

Технические требования

Поддержка клиентских размеров экранов. По аналогии, как у нас с колонками <Grid.Col width={{ mobile: {s:..., m:..., l:...}, desktop: ...}} order={{ mobile:..., desktop:..., tablet:...}} />

Десктоп (если данных нет оставьте блок пустым):

Смартфон (если данных нет оставьте блок пустым):

@Oladii
Copy link
Contributor

Oladii commented Sep 21, 2023

Обсудим с дизайнерами разделение на десктопный и мобильный компонент. Предположение что вертикальные шаги могут превратиться в горизонтальные и наоборот при адаптиве довольно спорное.

@Oladii Oladii closed this as completed Sep 21, 2023
@bwn-z
Copy link
Author

bwn-z commented Sep 21, 2023

Обсудим с дизайнерами разделение на десктопный и мобильный компонент. Предположение что вертикальные шаги могут превратиться в горизонтальные и наоборот при адаптиве довольно спорное.

Странно, но в НИБе сейчас так используют, плюс мы прошли дизайн-чек и выкатились с костылем самописным

@dedanu
Copy link

dedanu commented Sep 21, 2023

А можно как-то ссылку на это решение в дизайне? Хочется понять в каком продукте НИБа так сделали.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants