search

skeletonlabs / skeleton

A complete design system and component solution, built on Tailwind.
https://skeleton.dev
MIT License
4.9k stars 307 forks source link

Allow for vertical alignment for stepper component #1265

Closed MackenzieChoy closed 1 year ago

MackenzieChoy commented 1 year ago

Describe what feature you'd like. Pseudo-code, mockups, or screenshots of similar solutions are encouraged!

Add prop for Stepper component to allow for vertical alignment

rough mock from playing with css on docs site Skeleton Sid nav

What type of pull request would this be?

Enhancement

Any links to similar examples or other references we should review?

https://carbon-components-svelte.onrender.com/components/ProgressIndicator#vertical

https://mui.com/material-ui/react-stepper/#vertical-stepper

https://ant.design/components/timeline

Sarenor commented 1 year ago

It used to be vertical, lots and lots of people wanted it to be horizontal, it got changed to horizontal.

There is merit in having both though, so if anyone wants to tackle (re-)implementing a vertical stepper that could work

endigo9740 commented 1 year ago

@MackenzieChoy as @Sarenor mention this component has been through the wringer when it comes to preference on layout. I fought hard to keep the steps vertical to ensure better layout for mobile devices. However, popular consensus is that people prefer the horizontal top layout as it is now.

To put it in perspective, we probably had about 10-15 requests for the current layout over a few months. Versus currently one request (yours) for the vertical.

Given this, I will keep your request in mind for future iterations of this feature, but we will not be moving forward with this at this time. Thanks for the suggestion though!

guacamole commented 1 year ago

Hey @endigo9740 , I know this issue has been closed but I was wondering if there is a way around making it vertical with some effort put into the existing stepper or combining other available components. I was looking into the code but could not figure it out. I could write the whole thing but this component has everything I want for my usecase and I love it. any help would be heartily appreciated :)

Sarenor commented 1 year ago

Hey @guacamole in the very far future, there may be a vertical stepper agaion but right now horizontal will be the only one until we have more time/dev resources available. You can take a look at the old vertical stepper from 0.99.5 and copy and own it though: https://github.com/skeletonlabs/skeleton/tree/0.99.5/src/lib/components/Stepper

endigo9740 commented 1 year ago

@guacamole