UNPKG

1.39 kBSCSSView Raw
1// Copyright 2015 Palantir Technologies, Inc. All rights reserved.
2// Licensed under the Apache License, Version 2.0.
3
4@import "../../common/variables";
5@import "../popover/common";
6@import "./common";
7
8.#{$ns}-tooltip {
9 @include popover-sizing(
10 $arrow-square-size: 22px,
11 $arrow-offset: 3px,
12 $arrow-target-offset: -4px
13 );
14 @include popover-appearance(
15 $tooltip-background-color,
16 $tooltip-text-color,
17 $pt-tooltip-box-shadow,
18 $pt-drop-shadow-opacity,
19 $pt-border-shadow-opacity
20 );
21 // lightweight scale for tooltips
22 @include react-transition(
23 "#{$ns}-popover",
24 (transform: scale(0.8) scale(1)),
25 $duration: $pt-transition-duration,
26 $after: "> &"
27 );
28
29 .#{$ns}-popover-content {
30 padding: $tooltip-padding-vertical $tooltip-padding-horizontal;
31 }
32
33 &.#{$ns}-dark,
34 .#{$ns}-dark & {
35 @include popover-appearance(
36 $dark-tooltip-background-color,
37 $dark-tooltip-text-color,
38 $pt-dark-tooltip-box-shadow,
39 $pt-dark-drop-shadow-opacity,
40 $pt-dark-border-shadow-opacity
41 );
42 }
43
44 @each $intent, $color in $pt-intent-colors {
45 &.#{$ns}-intent-#{$intent} {
46 .#{$ns}-popover-content {
47 background: $color;
48 color: $white;
49 }
50
51 .#{$ns}-popover-arrow-fill {
52 fill: $color;
53 }
54 }
55 }
56}
57
58.#{$ns}-tooltip-indicator {
59 border-bottom: dotted 1px;
60 cursor: help;
61}