vault/ui/app/styles/components/stat-text.scss
claire bontempo 8f1a4cc01d
UI/Client count page bug fixes (#12914)
* fix spacing between bars

* fix month displayed on client count page

* centers tooltip over cursor when page browser fills window

* wraps date.length check in conditional

* adds test to date-format helper

* formats client count numbers

* fixes tooltip miscalculating percent

* fixes config data for monthly mirage endpoint
2021-10-26 16:10:09 -07:00

107 lines
2.2 KiB
SCSS

.stat-text-container {
line-height: normal;
height: 100%;
display: flex;
flex-direction: column;
&.l,
&.m {
.stat-label {
font-size: $size-5;
font-weight: $font-weight-semibold;
margin-bottom: $spacing-xxs;
line-height: inherit;
}
.stat-text {
font-size: $size-8;
font-weight: $font-weight-normal;
color: $ui-gray-700;
line-height: inherit;
flex-grow: 1;
}
.stat-value {
font-size: $size-3;
font-weight: $font-weight-normal;
margin-top: $spacing-s;
}
}
&.s {
.stat-label {
font-size: $size-5;
font-weight: $font-weight-semibold;
line-height: inherit;
}
.stat-text {
font-size: $size-8;
font-weight: $font-weight-normal;
color: $ui-gray-700;
line-height: inherit;
}
.stat-value {
font-size: $size-5;
font-weight: $font-weight-normal;
margin-top: $spacing-s;
}
}
&.l-no-subText {
.stat-label {
font-size: $size-5;
font-weight: $font-weight-semibold;
line-height: inherit;
}
.stat-text {
font-size: $size-8;
font-weight: $font-weight-normal;
color: $ui-gray-700;
line-height: inherit;
}
.stat-value {
font-size: $size-3;
font-weight: $font-weight-normal;
margin-top: $spacing-xxs;
}
}
&.m-no-subText {
.stat-label {
font-size: $size-8;
font-weight: $font-weight-bold;
line-height: inherit;
}
.stat-text {
font-size: $size-8;
font-weight: $font-weight-normal;
color: $ui-gray-700;
line-height: inherit;
}
.stat-value {
font-size: $size-5;
font-weight: $font-weight-normal;
margin-top: $spacing-xxs;
}
}
&.s-no-subText {
.stat-label {
font-size: $size-8;
font-weight: $font-weight-normal;
color: $ui-gray-500;
line-height: inherit;
}
.stat-text {
font-size: $size-8;
font-weight: $font-weight-normal;
color: $ui-gray-700;
line-height: inherit;
}
.stat-value {
font-size: $size-8;
font-weight: $font-weight-normal;
color: $ui-gray-800;
line-height: inherit;
}
}
}