Spearhead
/
joyent-portal
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

fix(ui-toolkit): fix border of popover tip

This commit is contained in:
Sérgio Ramos 2017-12-22 03:24:28 +00:00
parent e297eb7669
commit 6fa74685f1
2 changed files with 24 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/ui-toolkit/src/popover/index.js
View File

@ -17,7 +17,7 @@ const Popper = styled(BasePopper)`
box-shadow: 0 ${remcalc(2)} ${remcalc(6)} rgba(0, 0, 0, 0.1);
border: ${remcalc(1)} solid ${props => props.theme.grey};
padding: ${remcalc(15)} ${remcalc(18)};
padding: ${remcalc(15)} ${remcalc(18)} ${remcalc(3)} ${remcalc(18)};
${style({
background: 'white',

27
packages/ui-toolkit/src/tooltip/style.js
View File

@ -27,12 +27,16 @@ export default ({ background, color, border, arrow }) => css`
margin-bottom: 0;
&:after {
content: '';
display: block;
position: absolute;
border-width: ${remcalc(7)} ${remcalc(7)} 0 ${remcalc(7)};
border-color: ${props => props.theme[background]} transparent transparent
border-color: ${props => props.theme[border]} transparent transparent
transparent;
bottom: ${remcalc(-6)};
margin-top: 0;
margin-bottom: 0;
border-style: solid;
left: ${remcalc(-7)};
top: ${remcalc(-6)};
z-index: -1;
}
}
@ -44,6 +48,21 @@ export default ({ background, color, border, arrow }) => css`
top: ${remcalc(-6)};
margin-top: 0;
margin-bottom: 0;
&:after {
content: '';
display: block;
position: absolute;
border-width: 0 ${remcalc(7)} ${remcalc(7)} ${remcalc(7)};
border-color: transparent transparent ${props => props.theme[border]}
transparent;
border-style: solid;
top: ${remcalc(-1)};
left: ${remcalc(-7)};
margin-top: 0;
margin-bottom: 0;
z-index: -1;
}
}
/* top & bottom */