73 lines
1.8 KiB
SCSS
73 lines
1.8 KiB
SCSS
/**
|
|
* Copyright (c) HashiCorp, Inc.
|
|
* SPDX-License-Identifier: MPL-2.0
|
|
*/
|
|
|
|
.tool-tip {
|
|
font-size: $size-7;
|
|
text-transform: none;
|
|
margin: 8px 0px 0 -4px;
|
|
|
|
.box {
|
|
position: relative;
|
|
color: $white;
|
|
max-width: 200px;
|
|
background: $grey;
|
|
padding: 0.5rem;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.fit-content {
|
|
max-width: fit-content;
|
|
}
|
|
|
|
@include css-top-arrow(8px, $grey, 1px, $grey-dark, 20px);
|
|
&.ember-basic-dropdown-content--below.ember-basic-dropdown--transitioning-in {
|
|
animation: drop-fade-above 0.15s;
|
|
}
|
|
&.ember-basic-dropdown-content--below.ember-basic-dropdown--transitioning-out {
|
|
animation: drop-fade-above 0.15s reverse;
|
|
}
|
|
&.ember-basic-dropdown-content--above.ember-basic-dropdown--transitioning-in {
|
|
animation: drop-fade-below 0.15s;
|
|
}
|
|
&.ember-basic-dropdown-content--above.ember-basic-dropdown--transitioning-out {
|
|
animation: drop-fade-below 0.15s reverse;
|
|
}
|
|
&.smaller-font {
|
|
font-size: $size-8;
|
|
}
|
|
}
|
|
|
|
.ember-basic-dropdown-content--left.tool-tip {
|
|
margin: 8px 0 0 -2px;
|
|
|
|
&::before,
|
|
&::after {
|
|
right: auto;
|
|
left: $spacing-s;
|
|
}
|
|
}
|
|
.ember-basic-dropdown-content--right.tool-tip {
|
|
margin: 8px -11px;
|
|
}
|
|
|
|
.ember-basic-dropdown-content--below.ember-basic-dropdown-content--left.tool-tip {
|
|
@include css-top-arrow(8px, $grey, 1px, $grey-dark, calc(100% - 20px));
|
|
}
|
|
.ember-basic-dropdown-content--below.ember-basic-dropdown-content--right.tool-tip {
|
|
@include css-top-arrow(8px, $grey, 1px, $grey-dark, calc(100% - 20px));
|
|
}
|
|
.ember-basic-dropdown-content--above.tool-tip {
|
|
@include css-bottom-arrow(8px, $grey, 1px, $grey-dark);
|
|
margin-top: -8px;
|
|
}
|
|
.ember-basic-dropdown-content--above.ember-basic-dropdown-content--right.tool-tip {
|
|
@include css-bottom-arrow(8px, $grey, 1px, $grey-dark, calc(100% - 20px));
|
|
}
|
|
|
|
.b-checkbox .tool-tip-trigger {
|
|
position: relative;
|
|
top: -3px;
|
|
}
|