[docs][base] Move styles to the bottom of demos code

[michaldudak]

The most important part of the demo - the actual component code should be as high in the file as possible. Currently, most of the demos have significantly large style definitions, which must be scrolled to get to the most important parts of the code.

• BadgeUnstyled [docs][base] Move styles to the bottom of demos code for BadgeUnstyled #36723
• ButtonUnstyled [docs][base] Move styles code to bottom in the Button demos #36590
• FormControlUnstyled [docs][base] Move styles to the bottom of demos code for FormControl #36579
• InputUnstyled [docs][base] Move styles to the bottom of demos code for InputUnstyled #36724
• MenuUnstyled [docs][base] Move styles to the bottom of demos code for Menu #36582
• ModalUnstyled [docs][base] Move styles to the bottom of demos code for ModalUnstyled #36580
• PopperUnstyled [docs][base] Move styles to the bottom of demos code for Popper #36578
• SelectUnstyled [docs][base] Move styles to the bottom of demos code for SelectUnstyled #36718
• SliderUnstyled [docs][base] Move styles to the bottom of demos code for SliderUnstyled #36721
• SnackbarUnstyled [docs][base] Move styles to the bottom of demos code for Snackbar #36719
• SwitchUnstyled [docs][base] Move styles to the bottom of demos code for SwitchUnstyled #36720
• TablePaginationUnstyled [docs][base] Move styles to the bottom of demos code for TablePagination #36593
• Tabs related components [docs][base] Move styles to the bottom of demos code for Tabs #36577

[gitstart]

@michaldudak @gzrae I would like to work on this

[michaldudak]

Go ahead! Please create separate PRs per component, so it's faster to check, and the progress is more visible.

[sai6855]

@gitstart even i want to work on this, before working can you list components you are working. so that we both don't end up working on same components.

[gitstart]

@gitstart even i want to work on this, before working can you list components you are working. so that we both don't end up working on same components.

Hi @sai6855, I was actually planning on working on all the components, but you can feel free to choose the ones you want to work on so I can ignore them.

[sai6855]

Cool I'll work on, button, input, select, slider, switch, badge, snackbar. You can work on remaining components which are 11 in number.

[varunmulay22]

@sai6855 @gitstart could you share your updates here so I can pick up some components which you both aren't? Thanks :)

[gitstart]

@sai6855 @gitstart could you share your updates here so I can pick up some components which you both aren't? Thanks :)

I am currently rounding up my share of components and will be pushing my PRs soon, you can ask @sai6855 about the progress on his end.

[sai6855]

@sai6855 @gitstart could you share your updates here so I can pick up some components which you both aren't? Thanks :)

I am currently rounding up my share of components and will be pushing my PRs soon, you can ask @sai6855 about the progress on his end.

Same here, I'll create prs soon

[sai6855]

@varunmulay22 if you want, you can work on this issue
#35933

[varunmulay22]

sure looking into it @sai6855

[varunmulay22]

anything I can help here guys? please share the ones you haven't started. I don't see any PR's from your end yet hence asking

[gitstart]

anything I can help here guys? please share the ones you haven't started. I don't see any PR's from your end yet hence asking

I've pushed a few PRs, the rest are coming soon.

[ZeeshanTamboli]

I have made a list of the unstyled components and updated them with the respective PRs in the description. Feel free to take the remaining components.

[oliviertassinari]

The changes done with this issue make a lot of sense 👌.

A possible continuation on this issue: #38911. Instead of moving the source to the bottom, we could move them to a different tab.