From b9c1052cf525b8a358730823d7e274be9dd022e9 Mon Sep 17 00:00:00 2001 From: Lucas Date: Wed, 22 Jan 2025 08:29:47 +0000 Subject: [PATCH 1/6] [Scorecards] Added year variation placeholders in council table --- scoring/templates/scoring/council.html | 56 +++++++++++++++++++++++++- 1 file changed, 55 insertions(+), 1 deletion(-) diff --git a/scoring/templates/scoring/council.html b/scoring/templates/scoring/council.html index abe1839c..7fc3782d 100644 --- a/scoring/templates/scoring/council.html +++ b/scoring/templates/scoring/council.html @@ -276,10 +276,24 @@

Visit us again on a bigger screen

{% include 'caps/icons/scorecards-star.html' with classes='text-info align-text-bottom me-1' width='1.2em' height='1.2rem' role='presentation' %} {{ section.weighted_score|floatformat:0 }}% + + + + + + +

+5%

{% else %} - {{section.weighted_score|floatformat:0 }}% + {{section.weighted_score|floatformat:0 }}% + + + + + + +

+5%

{% if section.has_negative_points %}
{{ section.score }} = Total score ({{ section.non_negative_max|floatformat:"-2" }}) − Penalty points ({{ section.negative_points }}) @@ -291,6 +305,14 @@

Visit us again on a bigger screen

{% for comparison in section.comparisons %} {{ comparison.weighted_score|floatformat:0 }}% + + + + + + + +

+5%

{% endfor %} @@ -311,11 +333,27 @@

Visit us again on a bigger screen

{{ answer.score|format_mark }}/{{ answer.max }} + + + + + + + +

+1

{% for comparison in answer.comparisons %} {{ comparison.score|format_mark }}/{{ comparison.max }} + + + + + + + +

+1

{% endfor %} @@ -345,11 +383,27 @@

Visit us again on a bigger screen

{{ plan_score.weighted_total|floatformat:0 }}% + {{ section.weighted_score|floatformat:0 }}% + + + + + + +

+5%

{% for comparison in comparisons %} {{ comparison.weighted_total|floatformat:0 }}% + {{ section.weighted_score|floatformat:0 }}% + + + + + + +

+5%

{% endfor %} From b3da814fe61a6fdbb48e8d73ee4c8a081ec97bfc Mon Sep 17 00:00:00 2001 From: Lucas Date: Wed, 22 Jan 2025 08:54:55 +0000 Subject: [PATCH 2/6] [Scorecards] Improved styling for council table - Considering the table now will have more data because of the year comparison. I got rid of the background-color for the section rows. - Moved the penalty score below the penalty mark warning message. This prevents the odd line break because of the smaller width of the council column. At the same time I think information wise it makes sense cosnidering the are the same topic. --- scoring/templates/scoring/council.html | 39 +++++++++++--------------- 1 file changed, 17 insertions(+), 22 deletions(-) diff --git a/scoring/templates/scoring/council.html b/scoring/templates/scoring/council.html index 7fc3782d..b2ffead3 100644 --- a/scoring/templates/scoring/council.html +++ b/scoring/templates/scoring/council.html @@ -243,29 +243,29 @@

Visit us again on a bigger screen

{% for section in sections %} - {% if section.has_negative_points %} - - {% else %} - - {% endif %} + - + {{ section.description }} {% if section.has_negative_points %} -
+

{% include 'caps/icons/warning.html' with classes='me-1 mb-1' width='1.1em' height='1.1em' role='presentation' %} Penalty marks

- {% if section.only_negative %} - {{ council.name }} was only awarded penalty marks in this section - {% else %} - {{ council.name }} incurred a penalty of {{ section.negative_percent|floatformat:0 }}% in this section - {% endif %} +

+ {% if section.only_negative %} + {{ council.name }} was only awarded penalty marks in this section + {% else %} + {{ council.name }} incurred a penalty of {{ section.negative_percent|floatformat:0 }}% in this section + {% endif %} +

+

+ {{ section.score }} = Total score ({{ section.non_negative_max|floatformat:"-2" }}) − Penalty points ({{ section.negative_points }}) +

{% endif %} - {% else %} {{section.weighted_score|floatformat:0 }}% - - - - - - -

+5%

+ + + + + + {% endif %} @@ -306,8 +304,7 @@

Visit us again on a bigger screen

- -

+5%

+ {% endfor %} @@ -334,8 +331,7 @@

Visit us again on a bigger screen

- -

+1

+ {% for comparison in answer.comparisons %} @@ -347,8 +343,7 @@

Visit us again on a bigger screen

- -

+1

+ {% endfor %} @@ -378,27 +373,23 @@

Visit us again on a bigger screen

{{ plan_score.weighted_total|floatformat:0 }}% - {{ section.weighted_score|floatformat:0 }}% - - - - - - -

+5%

+ + + + + + {% for comparison in comparisons %} {{ comparison.weighted_total|floatformat:0 }}% - {{ section.weighted_score|floatformat:0 }}% - - - - - - -

+5%

+ + + + + + {% endfor %} From 8a4a2f527aae3f18cc4629cf120135e04e3b24a0 Mon Sep 17 00:00:00 2001 From: Lucas Date: Wed, 16 Oct 2024 07:30:22 +0100 Subject: [PATCH 4/6] [Scorecards][General] Added percentage ring component --- scoring/static/scoring/scss/main.scss | 1 + .../static/scoring/scss/percentage-ring.scss | 36 +++++++++++++++++++ 2 files changed, 37 insertions(+) create mode 100644 scoring/static/scoring/scss/percentage-ring.scss diff --git a/scoring/static/scoring/scss/main.scss b/scoring/static/scoring/scss/main.scss index 39151331..7913ac83 100644 --- a/scoring/static/scoring/scss/main.scss +++ b/scoring/static/scoring/scss/main.scss @@ -66,3 +66,4 @@ @import "open-graph-preview"; @import "years"; @import "gallery-component"; +@import "percentage-ring"; diff --git a/scoring/static/scoring/scss/percentage-ring.scss b/scoring/static/scoring/scss/percentage-ring.scss new file mode 100644 index 00000000..ec19d664 --- /dev/null +++ b/scoring/static/scoring/scss/percentage-ring.scss @@ -0,0 +1,36 @@ +/* USAGE: +Always check how the ring will look at 100% and if there is an overlap between elements. + +
+
+ {% widthratio answer.council_count council_count 100%}% +
+
+*/ + +.progress-ring { + min-width: var(--ring-size, 150px); + height: var(--ring-size, 150px); + border-radius: 50%; + position: relative; + display: flex; + justify-content: center; + align-items: center; + background: conic-gradient( + var(--ring-primary-color, $primary) 0% calc(var(--ring-percentage) * 1%), + var(--ring-secondary-color, $primary-200) calc(var(--ring-percentage) * 1%) 100% + ); + + .percentage { + font-weight: bold; + color: var(--ring-primary-color, $primary); + position: absolute; + display: flex; + justify-content: center; + align-items: center; + width: calc(var(--ring-size, 150px) * 0.7); + height: calc(var(--ring-size, 150px) * 0.7); + background: white; + border-radius: 50%; + } +} From d05adbb1162fa7c8796c13386b6798fa55099229 Mon Sep 17 00:00:00 2001 From: Lucas Date: Thu, 23 Jan 2025 11:38:53 +0000 Subject: [PATCH 5/6] [Scorecards] Added percentage rings to council table --- scoring/templates/scoring/council.html | 26 +++++++++++++++----------- 1 file changed, 15 insertions(+), 11 deletions(-) diff --git a/scoring/templates/scoring/council.html b/scoring/templates/scoring/council.html index 7a016181..0fdaed5f 100644 --- a/scoring/templates/scoring/council.html +++ b/scoring/templates/scoring/council.html @@ -348,17 +348,21 @@

Visit us again on a bigger screen

{% endfor %} - - {{ answer.council_count }} out of {{ council_count }} - - - {% include 'scoring/includes/scoring-group-name.html' with group=council.get_scoring_group.slug plural=True %} - {% if answer.type == "negative" %} - got no penalty marks for this question. - {% else %} - got full marks for this question. - {% endif %} - +
+
+
+ {% widthratio answer.council_count council_count 100%}% +
+
+ + {% include 'scoring/includes/scoring-group-name.html' with group=council.get_scoring_group.slug plural=True %} + {% if answer.type == "negative" %} + got no penalty marks for this question. + {% else %} + got full marks for this question. + {% endif %} + +
{% endfor %} From 4a669ffd82b905791e69a4a244dbff8ad15ff05a Mon Sep 17 00:00:00 2001 From: Lucas Date: Mon, 27 Jan 2025 07:16:22 +0000 Subject: [PATCH 6/6] [Scorecards] Changed fractions to 'Out of' in question marking After doing some testing and I noticed that the fractions might be confusing for some users. By using something more literal we might make it easier to analyse the information for the questions. --- scoring/templates/scoring/council.html | 82 +++++++++++++++----------- 1 file changed, 46 insertions(+), 36 deletions(-) diff --git a/scoring/templates/scoring/council.html b/scoring/templates/scoring/council.html index 0fdaed5f..0fd33fb2 100644 --- a/scoring/templates/scoring/council.html +++ b/scoring/templates/scoring/council.html @@ -276,21 +276,21 @@

Visit us again on a bigger screen

{% include 'caps/icons/scorecards-star.html' with classes='text-info align-text-bottom me-1' width='1.2em' height='1.2rem' role='presentation' %} {{ section.weighted_score|floatformat:0 }}% - - - - - + + + + + {% else %} {{section.weighted_score|floatformat:0 }}% - - - - - + + + + + {% endif %} @@ -324,26 +324,36 @@

Visit us again on a bigger screen

- {{ answer.score|format_mark }}/{{ answer.max }} - - - - - - - +
+

+ {{ answer.score|format_mark }} out of {{ answer.max }} + +

+ + + + + + + +
{% for comparison in answer.comparisons %} - {{ comparison.score|format_mark }}/{{ comparison.max }} - - - - - - - +
+

+ {{ comparison.score|format_mark }} out of {{ comparison.max }} + +

+ + + + + + + +
{% endfor %} @@ -377,22 +387,22 @@

Visit us again on a bigger screen

{{ plan_score.weighted_total|floatformat:0 }}% - - - - - + + + + + {% for comparison in comparisons %} {{ comparison.weighted_total|floatformat:0 }}% - - - - - + + + + + {% endfor %}