1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20
|
.gl-single-stat.gl-flex.gl-flex-col.gl-p-2
.gl-flex.gl-items-center.gl-text-gray-700.gl-mb-2
- if title_icon?
= sprite_icon(@title_icon, css_class: 'gl-mr-2')
%span.gl-text-base.gl-font-normal{ data: { testid: 'title-text' } }
= title || @title
.gl-single-stat-content.gl-flex.gl-items-baseline.gl-font-bold.gl-text-gray-900
%span.gl-single-stat-number.gl-leading-1{ class: unit_class, data: { testid: 'displayValue' } }
%span{ data: { testid: @stat_value_testid } }
= stat_value || @stat_value
- if unit?
%span.gl-text-sm.gl-mx-2.gl-transition-all.gl-opacity-10{ data: { testid: 'unit' } }
= @unit
- if meta_icon? && !meta_text?
= sprite_icon(@meta_icon, css_class: @text_color)
- elsif meta_text?
= render Pajamas::BadgeComponent.new(@meta_text,
variant: @variant,
icon: @meta_icon,
data: { testid: 'meta-badge' })
|