1
1
mirror of https://github.com/primer/css.git synced 2024-12-20 04:32:21 +03:00
css/modules/primer-popover/lib/popover.scss
2017-10-27 14:15:01 -05:00

75 lines
982 B
SCSS

.Popover {
position: absolute;
right: 0;
left: 0;
z-index: 100;
}
.Popover-message {
position: relative;
max-width: 235px;
margin-right: auto;
margin-left: auto;
// Carets
&::before,
&::after {
position: absolute;
left: 50%;
display: inline-block;
content: "";
}
&::before {
top: -16px;
margin-left: -9px;
border: 8px solid transparent;
border-bottom-color: rgba(0, 0, 0, 0.15);
}
&::after {
top: -14px;
margin-left: -8px;
border: 7px solid transparent;
border-bottom-color: $bg-white;
}
}
.Popover-message--right {
right: -9px;
margin-right: 0;
&::before,
&::after {
left: auto;
margin-left: 0;
}
&::before {
right: 20px;
}
&::after {
right: 21px;
}
}
.Popover-message--left {
left: -9px;
margin-left: 0;
&::before,
&::after {
left: 20px;
margin-left: 0;
}
&::after {
left: 21px;
}
}
.Popover-message--lg {
max-width: 330px;
}