spicy-sections
Just the standard spicy sections markup, really. Add a class if you like.
First, set up a tabs affordance. "vertical" or "side" tabs are tabs. Display them in a grid.
spicy-sections {
--const-mq-affordances: [screen and (min-width: 5px) ] tab-bar;
display: grid;
grid-template-columns: 1fr 3fr;
}
Then, you want to use the ::part(tab-list)
to style the container
part that the tabs are projected into. Just changing the display to block works.
spicy-sections::part(tab-list) {
color: purple;
display: block;
}
No, there is none necessary!
If you don't like this one, here's another using flex