Skip to content
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

Regular HTML Tags instead of select #213

Closed
ev3nst opened this issue Dec 3, 2022 · 1 comment
Closed

Regular HTML Tags instead of select #213

ev3nst opened this issue Dec 3, 2022 · 1 comment

Comments

@ev3nst
Copy link

ev3nst commented Dec 3, 2022

When styling option background color when clicked on cannot be changed with css afaik.

highlight

So far i have tried the following;

select.rdl-control:focus option,
select.rdl-control:focus option:checked,
select.rdl-control:focus option:active,
select.rdl-control:focus option:visited,
select.rdl-control:focus option::selection,
select.rdl-control:focus option[selected],
select.rdl-control:focus-within option:checked,
select.rdl-control:focus-within option:active,
select.rdl-control:focus-within option:visited,
select.rdl-control:focus-within option::selection,
select.rdl-control:focus-within option[selected],
select.rdl-control:visited option,
select.rdl-control:visited option:checked,
select.rdl-control:visited option:active,
select.rdl-control:visited option:visited,
select.rdl-control:visited option::selection,
select.rdl-control:visited option[selected],
select.rdl-control:hover option:checked,
select.rdl-control:hover option:active,
select.rdl-control:hover option:visited,
select.rdl-control:hover option::selection,
select.rdl-control:hover option[selected],
select.rdl-control:active option:checked,
select.rdl-control:active option:active,
select.rdl-control:active option:visited,
select.rdl-control:active option::selection,
select.rdl-control:active option[selected],
select.rdl-control option:checked,
select.rdl-control option:checked:active,
select.rdl-control option:checked:visited,
select.rdl-control option:checked:hover,
select.rdl-control option:checked:focus,
select.rdl-control option:checked:focus-visible,
select.rdl-control option:checked:focus-within,
select.rdl-control option:visited,
select.rdl-control option:active,
select.rdl-control option:focus,
select.rdl-control option:hover,
select.rdl-control option:target,
select.rdl-control option:focus-visible,
select.rdl-control option:focus-within,
select.rdl-control option::selection {
    background-color: #000 !important;
    outline: none !important;
    box-shadow: none !important;
}

If my example is true i think it would be a lot better to have divs instead of select and option. Not only for styling but drag & drop and other features could be implemented easier i think.

@jakezatecky
Copy link
Owner

jakezatecky commented Dec 3, 2022

This is a feature request tracked in #38.

This will take a significant overhaul of a lot of the internals, but it will resolve some other standing issues related to accessibility and styling. It will not be included in the next major release, v4.0, but may find itself in v5.0.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants