5
[solved] Apply code when sidebar is expanded
(lemmy.world)
Using Firefox-Developer-Edition
Hi, I would like to know how to apply this code only when sidebar is expanded:
.tools-and-extensions[orientation="vertical"] {
flex-direction: row !important;
}
I tried to use this before the previous code but didn't work: :root:has(sidebar-main[expanded])
I didn't be able to apply any style conditioning the sidebar expanded or not for any button inside .tools-and-extension, in the original code it seems to use :host but that didn't work, apparently.
Since
:hostis unavailable in user style context, doing exactly this is probably impossible. But I wonder what you are actually trying to achieve? Moreover, under which condition does.tools-and-extensionsever haveorientation=verticalattribute whilesidebar-mainis simultaneously expanded?Hi, for some reason when the sidebar-main is expanded there are 2 styles for 'tools-and extensions', when there are just a few icons they display in vertical, and when there are more than a few they display in horizontal, and I would like to have always the styles for 'tools-and-extensions' in horizontal when sidebar is expanded, even if there are just a few of icons. But I can't apply code when they are in 'vertical + sidebar expanded' and don't affect when the sidebar is collapsed.
I see. In that case you can achieve what you want - however, it really isn't enough to just apply different flex-direction because all the buttons also have different styling. So you'll end up with something like this:
Thank you, I will add it immediately :)