Invert tooltip color to white, fix #4563

Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
This commit is contained in:
Jan-Christoph Borchardt 2017-04-29 13:19:17 +02:00
parent 31c762aebf
commit 41b67e3d17
1 changed files with 31 additions and 30 deletions

View File

@ -13,12 +13,12 @@
.tooltip { .tooltip {
position: absolute; position: absolute;
display: block; display: block;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-family: 'Open Sans', Frutiger, Calibri, 'Myriad Pro', Myriad, sans-serif;
font-style: normal; font-style: normal;
font-weight: normal; font-weight: 400;
letter-spacing: normal; letter-spacing: normal;
line-break: auto; line-break: auto;
line-height: 1.42857143; line-height: 1.6;
text-align: left; text-align: left;
text-align: start; text-align: start;
text-decoration: none; text-decoration: none;
@ -39,22 +39,22 @@
&.top { &.top {
margin-top: -3px; margin-top: -3px;
padding: 5px 0; padding: 10px 0;
} }
&.bottom { &.bottom {
margin-top: 3px; margin-top: 3px;
padding: 5px 0; padding: 10px 0;
} }
&.right { &.right {
margin-left: 3px; margin-left: 3px;
padding: 0 5px; padding: 0 10px;
.tooltip-arrow { .tooltip-arrow {
top: 50%; top: 50%;
left: 0; left: 0;
margin-top: -5px; margin-top: -10px;
border-width: 5px 5px 5px 0; border-width: 10px 10px 10px 0;
border-right-color: $color-main-text; border-right-color: $color-main-background;
} }
} }
&.left { &.left {
@ -63,9 +63,9 @@
.tooltip-arrow { .tooltip-arrow {
top: 50%; top: 50%;
right: 0; right: 0;
margin-top: -5px; margin-top: -10px;
border-width: 5px 0 5px 5px; border-width: 10px 0 10px 10px;
border-left-color: $color-main-text; border-left-color: $color-main-background;
} }
} }
@ -74,20 +74,20 @@
&.top-left .tooltip-arrow, &.top-left .tooltip-arrow,
&.top-right .tooltip-arrow { &.top-right .tooltip-arrow {
bottom: 0; bottom: 0;
border-width: 5px 5px 0; border-width: 10px 10px 0;
border-top-color: $color-main-text; border-top-color: $color-main-background;
} }
&.top .tooltip-arrow { &.top .tooltip-arrow {
left: 50%; left: 50%;
margin-left: -5px; margin-left: -10px;
} }
&.top-left .tooltip-arrow { &.top-left .tooltip-arrow {
right: 5px; right: 10px;
margin-bottom: -5px; margin-bottom: -10px;
} }
&.top-right .tooltip-arrow { &.top-right .tooltip-arrow {
left: 5px; left: 10px;
margin-bottom: -5px; margin-bottom: -10px;
} }
/* BOTTOM */ /* BOTTOM */
@ -95,30 +95,31 @@
&.bottom-left .tooltip-arrow, &.bottom-left .tooltip-arrow,
&.bottom-right .tooltip-arrow { &.bottom-right .tooltip-arrow {
top: 0; top: 0;
border-width: 0 5px 5px; border-width: 0 10px 10px;
border-bottom-color: $color-main-text; border-bottom-color: $color-main-background;
} }
&.bottom .tooltip-arrow { &.bottom .tooltip-arrow {
left: 50%; left: 50%;
margin-left: -5px; margin-left: -10px;
} }
&.bottom-left .tooltip-arrow { &.bottom-left .tooltip-arrow {
right: 5px; right: 10px;
margin-top: -5px; margin-top: -10px;
} }
&.bottom-right .tooltip-arrow { &.bottom-right .tooltip-arrow {
left: 5px; left: 10px;
margin-top: -5px; margin-top: -10px;
} }
} }
.tooltip-inner { .tooltip-inner {
max-width: 350px; max-width: 350px;
padding: 3px 8px; padding: 5px 8px;
color: $color-main-background; background-color: $color-main-background;
color: $color-main-text;
box-shadow: 0 1px 10px rgba(150, 150, 150, .75);
text-align: center; text-align: center;
background-color: $color-main-text; border-radius: 3px;
border-radius: 4px;
} }
.tooltip-arrow { .tooltip-arrow {