fix: add qualifier for card stats

frappe/public/js/frappe/widgets/number_card_widget.js

@@ -59,6 +59,7 @@ export default class NumberCardWidget extends Widget {
 			}
 		).then(doc => {
 			this.name = doc.name;
+			this.card_doc.stats_time_interval = doc.stats_time_interval;
 			this.card_doc.name = this.name;
 			this.widget.attr('data-widget-name', this.name);
 		});
@@ -152,9 +153,22 @@ export default class NumberCardWidget extends Widget {
 				color_class = 'red-stat';
 			}
 
+			const stats_qualifier_map = {
+				'Daily': __('since yesterday'),
+				'Weekly': __('since last week'),
+				'Monthly': __('since last month'),
+				'Yearly': __('since last year')
+			}
+			const stats_qualifier = stats_qualifier_map[this.card_doc.stats_time_interval];
+
 			$(this.body).find('.widget-content').append(`<div class="card-stats ${color_class}">
-				${caret_html}
-				<span class="percentage-stat">${Math.abs(this.percentage_stat)} %</span>
+				<span class="percentage-stat">
+					${caret_html}
+					${Math.abs(this.percentage_stat)} %
+				</span>
+				<span class="stat-period text-muted">
+					${stats_qualifier}
+				</span>
 			</div>`);
 		});
 	}

frappe/public/less/dashboard_view.less

@@ -12,7 +12,7 @@
         }
 
         .new-number-card-widget {
-            min-height: 100px;
+            min-height: 110px;
         }
     }
 

frappe/public/less/desktop.less

@@ -395,7 +395,7 @@
 
 	&.number-widget-box {
 		cursor: pointer;
-		height: 100px;
+		height: 110px;
 		padding: 10px;
 
 		&:hover {
@@ -428,13 +428,13 @@
 			}
 
 			.widget-content {
-				padding-top: 20px;
+				padding-top: 30px;
 				display: flex;
 				justify-content: space-between;
 
 				.number {
-					font-size: 26px;
-					font-weight: bold;
+					font-size: 25px;
+					line-height: 2em;
 				}
 
 				.number-text {
@@ -444,7 +444,19 @@
 				}
 
 				.card-stats {
-					padding-top: 15px;
+					padding-top: 5px;
+				}
+
+				.percentage-stat {
+					float: right;
+					clear: right;
+					font-size: 12px;
+				}
+
+				.stat-period {
+					float: right;
+					clear: right;
+					font-size: 11px;
 				}
 
 				.green-stat {