-
Notifications
You must be signed in to change notification settings - Fork 3
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
add NavDivider for non-selectable menu entries #8
base: master
Are you sure you want to change the base?
Conversation
Adds a `NavDivider` dataclass that can be used in a `nav_items` list like a `NavItem`, only taking `title` (and `icon`). It will be rendered in the pull-down with a grey background, and is unclickable. Styling can be changed with CSS: `li[role=divider] { ...; }` As Jinja2 cannot test if a variable is an instance (beyond some built-ins) the `divider` attribute (default: `True`) is tested. Dataclasses do not have the option to make an attribute immutable, so this can be broken by assigning to that attribute.
At first glance, this looks good to me. The divider is hardcoded in CSS to be grey. Did you test it with light- and dark-theme? |
No I haven't. I haven't got a switch in my test app anymore so I don't know how to go from one to another. Is there away to set that in the settings? |
I now made it |
@AvdN: The color looks good to me. Seems to be the appropriate color value. For me it looks like this: The divider is a bit thick for my taste. I would want to have something like bootstrap has: Also, the new class will need some documentation, or be at least mentioned in the example. Besides that, good job! |
Ah! You are using it more like another hierarchy level |
Yeah, but if the title is empty a different rendering could be made, that looks more like the line from bootstrap. Do you have an online site where that is (instead of the image), so I can look at the HTML and the styling? |
I looked at that and as I had tried already it uses a element. But just inserting that doesn't work in picocss, the list element is still the same size as if it had text. Spend another two hours on this, and learned a lot more about inspect mode in Firefox, the :before pseudo elements (which AFAICT set the hight by providing content: ""; ), but never was able to get the to display independent of being to high. I can change the NavDivder name if you want (let me know what name), and/or extend the example in I am not going to look into using an any further, especially as the navbar, as-is, is unusable with the double click to go from main navbar item to another (i.e. I will look at bootstrap, or else try to get my current jQuery based stuff to work with Lona) |
Adds a
NavDivider
dataclass that can be used in anav_items
list like aNavItem
, only takingtitle
(andicon
). It will be rendered in the pull-down with a grey background, and is unclickable.Styling can be changed with CSS:
li[role=divider] { ...; }
As Jinja2 cannot test if a variable is an instance (beyond some built-ins) the
divider
attribute (default:True
) is tested. Dataclasses do not have the option to make an attribute immutable, so this can be broken by assigning to that attribute.