Add sum on chart

nummi/main/static/main/css/chart.css

@@ -21,6 +21,8 @@
 }
 .chart .value {
 	padding: 0 var(--gap);
+	font-feature-settings: "tnum", "ss01";
+	text-align: right;
 }
 .chart .bar {
 	width: 0;
@@ -39,5 +41,19 @@
 .chart .left .bar {border-radius: var(--radius) 0 0 var(--radius)}
 .chart .right .bar {border-radius: 0 var(--radius) var(--radius) 0}
 
-.chart .bar_m {background: var(--red)}
+.chart .bar_m {background: var(--red-1)}
-.chart .bar_p {background: var(--green)}
+.chart .bar_p {background: var(--green-1)}
+
+.chart .bar span {
+	position: absolute;
+	display: inline-block;
+	white-space: nowrap;
+	margin: 0 var(--gap);
+	font-weight: 650;
+	top: .5rem;
+	line-height: 1.5rem;
+	height: 1.5rem;
+	font-feature-settings: "tnum", "ss01";
+}
+.chart .right .bar span {left: 0}
+.chart .left .bar span {right: 0}

nummi/main/static/main/css/main.css

@@ -29,6 +29,9 @@
 	--red: #bf1500;
 	--green: var(--theme-2);
 
+	--red-1: #f21b00;
+	--green-1: var(--theme-1);
+
 	--radius: 2px;
 }
 

nummi/main/templates/main/snapshot.html

@@ -59,6 +59,7 @@
 			class="bar tot"
 			style="width:{% widthratio cat.sum cat_lim_m 100 %}%"
 			title="{{ cat.sum }}">
+			{% pmvalue cat.sum %}
 		</div>
 		{% endif %}
 	</div>
@@ -73,6 +74,7 @@
 			class="bar tot"
 			style="width:{% widthratio cat.sum cat_lim 100 %}%"
 			title="{{ cat.sum }}">
+			{% pmvalue cat.sum %}
 		</div>
 		{% endif %}
 	</div>