[Scorecards] 2027 draft methodology

- Added theme colours for 2027 version
- Created `methodology/2027` templates
- Added draft methodology to navigation bar
- Updated `METHODOLOGY_YEAR` to make 2027 the new default

Author: lucascumsille

docker-compose.yml

@@ -35,7 +35,7 @@ services:
       - EMAIL_HOST=${EMAIL_HOST:-localhost}
       - EMAIL_PORT=${EMAIL_PORT:-25}
       - PLAN_YEAR=${PLAN_YEAR:-2023}
-      - METHODOLOGY_YEAR=${METHODOLOGY_YEAR:-2025}
+      - METHODOLOGY_YEAR=${METHODOLOGY_YEAR:-2027}
 
     depends_on:
       - postgres

proj/settings.py

@@ -19,7 +19,7 @@
 
 env = environ.Env(
     PLAN_YEAR=(str, "2023"),
-    METHODOLOGY_YEAR=(str, "2025"),
+    METHODOLOGY_YEAR=(str, "2027"),
 )
 environ.Env.read_env(env_file)
 

scoring/static/scoring/scss/_utils.scss

@@ -17,7 +17,7 @@ $gray-colors: ();
     );
 }
 
-$all-colors: map-merge-multiple($blues, $indigos, $purples, $pinks, $reds, $oranges, $yellows, $greens, $teals, $cyans, $gray-colors, $primaries, $primaries2025);
+$all-colors: map-merge-multiple($blues, $indigos, $purples, $pinks, $reds, $oranges, $yellows, $greens, $teals, $cyans, $gray-colors, $primaries, $primaries2025, $primaries2027);
 
 $utilities: map-merge(
     $utilities,

scoring/static/scoring/scss/hero.scss

@@ -25,6 +25,10 @@
     &.year-2025 {
     background: linear-gradient(90deg, $primary2025-200 0%, adjust-hue($primary2025-200, -10) 100%);
     }
+
+    &.year-2027 {
+    background: linear-gradient(90deg, $primary2027-100 0%, $primary2027-300 100%);
+    }
   }
 
   .year-2023 & {

scoring/static/scoring/scss/variables.scss

@@ -41,6 +41,7 @@ $info: $color-scorecard-yellow;
 $dark: $black;
 
 $primary2025: #d77b12;
+$primary2027: #1e7bb0;
 
 $color-total-score:$primary;
 $color-category-1:#098995;
@@ -79,6 +80,7 @@ $color-category-9;
 $theme-colors: (
     "primary":    $primary,
     "primary2025": $primary2025,
+    "primary2027": $primary2027,
     "secondary":  $secondary,
     "success":    $success,
     "info":       $info,
@@ -154,6 +156,28 @@ $primaries2025: (
   "primary2025-900": $primary2025-900
 );
 
+$primary2027-100: lighten($primary2027, 50%);
+$primary2027-200: lighten($primary2027, 40%);
+$primary2027-300: lighten($primary2027, 30%);
+$primary2027-400: lighten($primary2027, 20%);
+$primary2027-500: $primary2027;
+$primary2027-600: darken($primary2027, 7.5%);
+$primary2027-700: darken($primary2027, 15%);
+$primary2027-800: darken($primary2027, 20%);
+$primary2027-900: darken($primary2027, 25%);
+
+$primaries2027: (
+  "primary2027-100": $primary2027-100,
+  "primary2027-200": $primary2027-200,
+  "primary2027-300": $primary2027-300,
+  "primary2027-400": $primary2027-400,
+  "primary2027-500": $primary2027-500,
+  "primary2027-600": $primary2027-600,
+  "primary2027-700": $primary2027-700,
+  "primary2027-800": $primary2027-800,
+  "primary2027-900": $primary2027-900
+);
+
 $min-contrast-ratio: 2.5;
 
 // Options

scoring/templates/scoring/base.html

@@ -85,7 +85,7 @@
                         <a class="nav-link link-primary" href="{% url 'scoring:nations_list' %}">Nations</a>
                     </li>
                     <li id="methodology-page" class="nav-item">
-                        <a class="nav-link link-primary" href="{% url 'scoring:methodology' %}">{{ plan_year }} Methodology</a>
+                        <a class="nav-link link-primary" href="{% url 'scoring:methodology' %}">2027 Draft Methodology</a>
                     </li>
                     <li id="how-to-page" class="nav-item">
                         <a class="nav-link link-primary" href="{% url 'generic:how-to-use-the-scorecards' %}">How to use the Scorecards</a>
@@ -104,7 +104,7 @@
                         <a class="nav-link link-primary" href="{% url 'year_scoring:nations_list' plan_year %}">Nations</a>
                     </li>
                     <li id="methodology-page" class="nav-item">
-                        <a class="nav-link link-primary" href="{% url 'year_scoring:methodology' plan_year %}">{{ plan_year }} Methodology</a>
+                        <a class="nav-link link-primary" href="{% url 'year_scoring:methodology' plan_year %}">{{ plan_year }} Draft Methodology</a>
                     </li>
                     <li id="how-to-page" class="nav-item">
                         <a class="nav-link link-primary" href="{% url 'generic:how-to-use-the-scorecards' %}">How to use the Scorecards</a>
@@ -121,8 +121,8 @@
     </nav>
 
     <nav class="navbar navbar-expand-lg py-2 justify-content-center bg-orange-100 border-top gap-2 gap-md-3">
-        <span class="text-center">Please help Climate Emergency UK by donating as a Scorecard Sustainer. We rely on donations to remain independent.</span>
-        <a href="https://validaid.org/fundraiser/161" class="btn btn-sm btn-primary rounded-pill px-3">Donate</a>
+        <span class="text-center">Our draft methodology for the 2027 Council Climate Action Scorecards is now available! Thank you to everyone who contributed to our Methodology Review.</span>
+        <a href="{% url 'scoring:methodology' %}" class="btn btn-sm btn-primary rounded-pill px-3">Find out more</a>
     </nav>
 
 {% block content %}{% endblock %}

scoring/templates/scoring/methodology.html

@@ -3,7 +3,7 @@
 {% load static %}
 {% block content %}
     <div class="methodology-2023-content js-dynamic-content ">
-        <div class="pt-5 pb-6 pt-lg-8 pb-lg-8 hero-section with-version-background year-2025">
+        <div class="pt-5 pb-6 pt-lg-8 pb-lg-8 hero-section with-version-background year-{{ methodology_year }}">
             <div class="d-flex flex-column align-items-end align-items-lg-start hero-version-badge position-absolute">
                 <span class="version-year d-block fw-bold lh-1">{{ methodology_year }}</span>
                 <span class="version-name d-block fw-bold lh-1">Action Scorecards</span>