New website layout

[javac9]

Hi Alex, I have to admit that I don't find the new layout very practical for the following reasons:

• lacks good visual component overview
• bigger components have lots of code and one needs to do lots of scrolling in the left pane in order to reach next component
• when browsing the components I don't prefer seeing code over seeing how the actual component looks like. Once I decide which component I want to use, only then am I interested in taking a look at the code in order to check how something has been done or to copy it

I didn't mind the old look, really and would like to have it back, at least as an alternative?

[alexstyl]

thanks for the feedback, which is totally fair

keep in mind you can view all components at https://composablesui.com/components

could you let me know whether you think the new preview of the component itself is better or worse?

thanks

[javac9]

could you let me know whether you think the new preview of the component itself is better or worse?

I think it's better in the sense that the pane is narrower and it immediately looks more like it's being displayed on a hand-held device. Maybe you could make it so that we can extend the width of the preview pane to simulate different screen widths (like in dev tools in Chrome when a free-form responsive mode is enabled)

[javac9]

Another remark, component Checkout Forms

The UI preview cannot be scrolled, at least not in my Chrome browser (the scrollbar is not there in the right-side pane)

[alexstyl]

@javac9 it is not meant to be scrollable. weird how the scrollbar is visible. which browser and OS are you using?

[javac9]

Windows 11, latest Chrome browser

You said it's not meant to be scrollable. I find that not very convenient to be honest. If I have code and preview side to side, it would be nice to be able to see the whole preview especially if I'm trying to see how something has been coded.

[alexstyl]

I find that not very convenient

my bad, i made a mistake. the component can be scrolled when in mobile like the attached video.

https://github.com/user-attachments/assets/b33fdf65-b058-4297-8a08-9bcd2f925023

Could you kindly check https://composablesui.com/components/application-ui/components/lists for List with sticky headers and tell me if you can scroll the list or not?

are you scrolling using a track pad or a mouse wheel?

[javac9]

Could you kindly check https://composablesui.com/components/application-ui/components/lists for List with sticky headers and tell me if you can scroll the list or not?

are you scrolling using a track pad or a mouse wheel?

I just tried it. Scrolling with a mouse wheel works, and only if the cursor is over the component itself. For example, if a component is pretty narrow, with some whitespace on sides, it won't work if cursor is positioned over the whitespace - which is not a problem.

[alexstyl]

and just to confirm you are saying that doing the same on https://composablesui.com/components/ecommerce-ui/components/checkout 's single step one doesn't scroll?

Trying to understand if the component doesn't scroll as expected or this is a visual issue (ie not visible scrollbars)

[alexstyl]

Regarding the long code blocks, I made it so that you have to 'expand' longer blocks. Hopefully this resolves the scrolling issue.

Kindly let me know about the scrollbars

[alexstyl]

Added a new Phone/Landscape/Tablet preview on the site today that should make it clearer how the components will render on the device.

Closing this due to inactivity. if there is any issue with the previews kindly open a new issue