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

Changes popovers from px to rem #23776

Merged
merged 1 commit into from
Oct 18, 2017
Merged

Changes popovers from px to rem #23776

merged 1 commit into from
Oct 18, 2017

Conversation

andresgalante
Copy link
Collaborator

Following the same idea of #23468 with tooltips, this PR is changing px units to rem to meassure popovers.

It also nukes the fancy white border as discussed and closes #23763

This is how it looks with shadows turn on:

screen shot 2017-08-31 at 10 37 30 am

@@ -5,7 +5,7 @@
z-index: $zindex-popover;
display: block;
max-width: $popover-max-width;
padding: $popover-inner-padding;
// padding: $popover-inner-padding;
Copy link
Member

Choose a reason for hiding this comment

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

Remove instead of commenting out

border-top-color: $popover-arrow-outer-color;
}

.arrow::after {
bottom: -($popover-arrow-outer-width - 1);
margin-left: -($popover-arrow-outer-width - 5);
bottom: calc((#{$popover-arrow-width} - 1px) * -1);
Copy link
Member

Choose a reason for hiding this comment

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

Change the 1px here and elsewhere to $popover-border-width?

@XhmikosR
Copy link
Member

XhmikosR commented Oct 9, 2017

@andresgalante: I rebased and removed the commented out code. Only thing left is to take care of the other @mdo's comment.

$popover-bg: $white !default;
$popover-max-width: 276px !default;
$popover-max-width: 17.5rem !default;
Copy link
Member

Choose a reason for hiding this comment

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

Shouldn't this stay in px?


$popover-arrow-width: 10px !default;
$popover-arrow-height: 5px !default;
$popover-arrow-width: .8rem !default;
Copy link
Member

Choose a reason for hiding this comment

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

Same for these two?

Copy link
Collaborator Author

@andresgalante andresgalante Oct 9, 2017

Choose a reason for hiding this comment

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

@XhmikosR I would say yes for the max-width since we measure grids in px but not for the size of the arrow. But I am not sure, What do you think?

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

@XhmikosR actually, if the root font size changes, we want to space of the popover to be larger.
So, maybe the max-width should in rems too, right?

@andresgalante
Copy link
Collaborator Author

@XhmikosR the change @mdo requested is done, thanks!

@twbs twbs deleted a comment from Yongjin0919 Oct 9, 2017
@mdo mdo merged commit e756b66 into twbs:v4-dev Oct 18, 2017
@mdo mdo mentioned this pull request Oct 18, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants