5d2e1ce19b
1. Rebuild the heathchecked-resource component now we can copy and paste 2. As the above rebuild came with new icons, we also swapped out 'most' of the other areas where we were using these new icons, plus any icons that were effected by the new icon placeholders 3. Begin to remove more and more of the project specific icons (now replaced by the shared ones)
69 lines
1.3 KiB
SCSS
69 lines
1.3 KiB
SCSS
@import '../base/components/stats-card/index';
|
|
.healthchecked-resource > div {
|
|
@extend %stats-card;
|
|
}
|
|
|
|
%tooltip-below::after {
|
|
top: calc(100% - 8px);
|
|
bottom: auto;
|
|
border-top: none;
|
|
border-bottom: 18px solid $gray-500;
|
|
}
|
|
%tooltip-below::before {
|
|
top: calc(100% + 4px);
|
|
bottom: auto;
|
|
}
|
|
%tooltip-left::before {
|
|
right: 0;
|
|
}
|
|
%tooltip-right::before {
|
|
left: -10px;
|
|
}
|
|
%stats-card-icon {
|
|
@extend %tooltip-below;
|
|
/*TODO: This should probably go into base*/
|
|
line-height: 1em;
|
|
}
|
|
%stats-card-icon:first-child::before {
|
|
right: 0;
|
|
}
|
|
%stats-card-icon:last-child::before {
|
|
left: -10px;
|
|
}
|
|
|
|
%stats-card-icon:last-child {
|
|
@extend %with-star-icon;
|
|
}
|
|
%stats-card header > .zero {
|
|
@extend %with-minus-square-fill-color-icon;
|
|
color: $gray-400;
|
|
}
|
|
%stats-card header > .non-zero {
|
|
@extend %with-check-circle-fill-color-icon;
|
|
color: $green-500;
|
|
}
|
|
|
|
%stats-card li a > :first-child {
|
|
font-size: 0;
|
|
height: 16px;
|
|
min-width: 16px;
|
|
}
|
|
[data-tooltip] {
|
|
@extend %with-pseudo-tooltip;
|
|
}
|
|
%stats-card li a > :last-child {
|
|
margin-left: 10px;
|
|
}
|
|
%stats-card a > :first-child::before {
|
|
left: -10px;
|
|
}
|
|
%stats-card a.passing > :first-child {
|
|
@extend %with-check-circle-fill-color-icon;
|
|
}
|
|
%stats-card a.warning > :first-child {
|
|
@extend %with-alert-triangle-color-icon;
|
|
}
|
|
%stats-card a.critical > :first-child {
|
|
@extend %with-cancel-square-fill-color-icon;
|
|
}
|