diff --git a/nummi/main/static/main/css/chart.css b/nummi/main/static/main/css/chart.css index 3810285..dfa4ff4 100644 --- a/nummi/main/static/main/css/chart.css +++ b/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_p {background: var(--green)} +.chart .bar_m {background: var(--red-1)} +.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} diff --git a/nummi/main/static/main/css/main.css b/nummi/main/static/main/css/main.css index 1445adb..9675162 100644 --- a/nummi/main/static/main/css/main.css +++ b/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; } diff --git a/nummi/main/templates/main/snapshot.html b/nummi/main/templates/main/snapshot.html index d2588da..37df888 100644 --- a/nummi/main/templates/main/snapshot.html +++ b/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 %} {% endif %} @@ -73,6 +74,7 @@ class="bar tot" style="width:{% widthratio cat.sum cat_lim 100 %}%" title="{{ cat.sum }}"> + {% pmvalue cat.sum %} {% endif %}