@import '_mixins';
.help-tooltip-button {
- @include icon(17px);
-
- position: relative;
- top: -2px;
- background-image: url('../../../assets/images/global/help.svg');
- background-color: #fff;
+ cursor: pointer;
border: none;
- margin: 5px;
+
+ my-global-icon {
+ width: 17px;
+ position: relative;
+ top: -2px;
+ margin: 5px;
+
+ @include apply-svg-color(var(--mainForegroundColor))
+ }
}
-/deep/ {
- .popover-body {
- text-align: left;
- padding: 10px;
+::ng-deep {
+ .help-popover {
+ z-index: z(help-popover) !important;
max-width: 300px;
- font-size: 13px;
- font-family: $main-fonts;
- background-color: #fff;
- color: #000;
- box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
+ .popover-body {
+ font-family: $main-fonts;
+ text-align: left;
+ padding: 10px;
+ font-size: 13px;
+ background-color: var(--mainBackgroundColor);
+ color: var(--mainForegroundColor);
+ box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
+
+ p {
+ margin-bottom: 0;
+ }
- ul {
- padding-left: 20px;
+ ul {
+ padding-left: 20px;
+ margin-bottom: 0;
+ }
}
}
}