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

Fixes for bs5 sketchy #385

Merged
merged 3 commits into from
Oct 26, 2021
Merged

Fixes for bs5 sketchy #385

merged 3 commits into from
Oct 26, 2021

Conversation

cpsievert
Copy link
Collaborator

@cpsievert cpsievert commented Oct 21, 2021

Closes #382

@cpsievert cpsievert force-pushed the bs5-sketchy branch 3 times, most recently from 3b45c9a to a6d38c5 Compare October 25, 2021 18:23
@cpsievert cpsievert requested a review from schloerke October 25, 2021 18:24
@@ -159,8 +159,8 @@ select.form-control {
border-radius: $border-radius-lg-sketchy !important;
}

[type="checkbox"] {
position: relative !important;
#{$shiny-check} input, #{$shiny-check-inline} input, [type="checkbox"] {
Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For reference

$shiny-check: ".shiny-input-container .checkbox";
$shiny-check-inline: $shiny-check + "-inline";
$shiny-radio: ".shiny-input-container .radio";
$shiny-radio-inline: $shiny-radio + "-inline";
$form-check-input-selector: ".form-check-input, " +
$shiny-check + " input, " + $shiny-check-inline + " input, " +
$shiny-radio + " input, " + $shiny-radio-inline + " input, ";

[type="radio"] {
position: relative !important;
#{$shiny-radio} input, #{$shiny-radio-inline} input, [type="radio"] {
position: relative;
Copy link
Collaborator Author

@cpsievert cpsievert Oct 25, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For context, the !important was added by me (for BS4) to fix a similar issue (with Bootstrap's form CSS taking higher priority than these rules). However, now (with BS5) some of the other properties here (most importantly, width) are also overridden by Bootstrap's form CSS. Instead of adding !important everywhere, we can leverage the shiny form selector variables that I've already added to BS5 source for BS3 compatibility.

@cpsievert cpsievert merged commit ab484e9 into master Oct 26, 2021
@cpsievert cpsievert deleted the bs5-sketchy branch October 26, 2021 17:29
@cpsievert
Copy link
Collaborator Author

(Reviewed with @schloerke)

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

Successfully merging this pull request may close these issues.

"sketchy" theme: checkboxes look off with bootstrap 5
1 participant