Update Spotlight homepage posts to Ideas, including cta link text

network-api/networkapi/wagtailpages/factory/homepage.py

@@ -32,8 +32,8 @@ class Meta:
     quote_source_job_title = Faker("text", max_nb_chars=50)
     partner_background_image = SubFactory(ImageFactory)
     partner_intro_text = Faker("text", max_nb_chars=80)
-    spotlight_headline = Faker("text", max_nb_chars=100)
-    spotlight_image = SubFactory(ImageFactory)
+    ideas_headline = Faker("text", max_nb_chars=100)
+    ideas_image = SubFactory(ImageFactory)
 
 
 def generate(seed):

network-api/networkapi/wagtailpages/factory/homepage_features.py

@@ -5,7 +5,7 @@
     BlogPage,
     FocusArea,
     HomepageFocusAreas,
-    HomepageSpotlightPosts,
+    HomepageIdeasPosts,
 )
 
 
@@ -24,13 +24,12 @@ def generate(seed):
 
     HomepageFocusAreas.objects.create(page=home_page, area=FocusArea.objects.get(name="Shape the Agenda"))
 
-    NUM_SPOTLIGHT_POSTS = 3
+    NUM_IDEAS_POSTS = 3
 
     all_blogs = list(BlogPage.objects.all())
 
-    home_page.spotlight_posts = [
-        HomepageSpotlightPosts.objects.create(page=home_page, blog=choice(all_blogs))
-        for i in range(NUM_SPOTLIGHT_POSTS)
+    home_page.ideas_posts = [
+        HomepageIdeasPosts.objects.create(page=home_page, blog=choice(all_blogs)) for i in range(NUM_IDEAS_POSTS)
     ]
 
     home_page.save()

network-api/networkapi/wagtailpages/migrations/0160_homepageideasposts_and_more.py

@@ -0,0 +1,41 @@
+import django.db.models.deletion
+import modelcluster.fields
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("wagtailcore", "0089_log_entry_data_json_null_to_object"),
+        ("wagtailimages", "0025_alter_image_file_alter_rendition_file"),
+        ("wagtailpages", "0159_update_bgcta_with_linkblock"),
+    ]
+
+    operations = [
+        migrations.RenameModel(
+            old_name="HomepageSpotlightPosts",
+            new_name="HomepageIdeasPosts",
+        ),
+        migrations.RenameField(
+            model_name="homepage",
+            old_name="spotlight_headline",
+            new_name="ideas_headline",
+        ),
+        migrations.RenameField(
+            model_name="homepage",
+            old_name="spotlight_image",
+            new_name="ideas_image",
+        ),
+        migrations.AddField(
+            model_name="homepageideasposts",
+            name="cta",
+            field=models.CharField(default="Read more", max_length=50),
+        ),
+        migrations.AlterField(
+            model_name="homepageideasposts",
+            name="page",
+            field=modelcluster.fields.ParentalKey(
+                on_delete=django.db.models.deletion.CASCADE, related_name="ideas_posts", to="wagtailpages.homepage"
+            ),
+        ),
+    ]

network-api/networkapi/wagtailpages/migrations/0161_alter_homepage_ideas_headline_and_more.py

@@ -0,0 +1,31 @@
+# Generated by Django 4.2.15 on 2024-09-09 19:16
+
+import django.db.models.deletion
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ("wagtailimages", "0025_alter_image_file_alter_rendition_file"),
+        ("wagtailpages", "0160_homepageideasposts_and_more"),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name="homepage",
+            name="ideas_headline",
+            field=models.CharField(blank=True, max_length=140),
+        ),
+        migrations.AlterField(
+            model_name="homepage",
+            name="ideas_image",
+            field=models.ForeignKey(
+                blank=True,
+                null=True,
+                on_delete=django.db.models.deletion.SET_NULL,
+                related_name="ideas_image",
+                to="wagtailimages.image",
+            ),
+        ),
+    ]

network-api/networkapi/wagtailpages/models.py

@@ -5,8 +5,8 @@
     FoundationMetadataPageMixin,
     Homepage,
     HomepageFocusAreas,
+    HomepageIdeasPosts,
     HomepageNewsYouCanUse,
-    HomepageSpotlightPosts,
     InitiativesPage,
     ParticipateHighlights,
     ParticipateHighlights2,

network-api/networkapi/wagtailpages/pagemodels/base.py

@@ -443,14 +443,16 @@ class Styleguide(PrimaryPage):
     ]
 
 
-class HomepageSpotlightPosts(TranslatableMixin, WagtailOrderable):
+class HomepageIdeasPosts(TranslatableMixin, WagtailOrderable):
     page = ParentalKey(
         "wagtailpages.Homepage",
-        related_name="spotlight_posts",
+        related_name="ideas_posts",
     )
     blog = models.ForeignKey("BlogPage", on_delete=models.CASCADE, related_name="+")
+    cta = models.CharField(max_length=50, default="Read more")
     panels = [
         FieldPanel("blog"),
+        FieldPanel("cta", heading="CTA Link Text"),
     ]
 
     class Meta(TranslatableMixin.Meta, WagtailOrderable.Meta):
@@ -762,17 +764,16 @@ def get_banner(self):
 
     hero_button_url = models.URLField(blank=True)
 
-    spotlight_image = models.ForeignKey(
+    ideas_image = models.ForeignKey(
         "wagtailimages.Image",
         null=True,
         blank=True,
         on_delete=models.SET_NULL,
-        related_name="spotlight_image",
+        related_name="ideas_image",
     )
 
-    spotlight_headline = models.CharField(
+    ideas_headline = models.CharField(
         max_length=140,
-        help_text="Spotlight headline",
         blank=True,
     )
 
@@ -880,11 +881,11 @@ def get_banner(self):
         ),
         MultiFieldPanel(
             [
-                FieldPanel("spotlight_image"),
-                FieldPanel("spotlight_headline"),
-                InlinePanel("spotlight_posts", label="Posts", min_num=3, max_num=3),
+                FieldPanel("ideas_image"),
+                FieldPanel("ideas_headline"),
+                InlinePanel("ideas_posts", label="Posts", min_num=3, max_num=3),
             ],
-            heading="spotlight",
+            heading="Ideas",
             classname="collapsible",
         ),
         MultiFieldPanel(
@@ -932,8 +933,8 @@ def get_banner(self):
         SynchronizedField("hero_image"),
         TranslatableField("hero_button_text"),
         SynchronizedField("hero_button_url"),
-        SynchronizedField("spotlight_image"),
-        TranslatableField("spotlight_headline"),
+        SynchronizedField("ideas_image"),
+        TranslatableField("ideas_headline"),
         TranslatableField("cause_statement"),
         TranslatableField("cause_statement_link_text"),
         TranslatableField("cause_statement_link_page"),
@@ -950,7 +951,7 @@ def get_banner(self):
         TranslatableField("focus_areas"),
         TranslatableField("take_action_cards"),
         TranslatableField("partner_logos"),
-        TranslatableField("spotlight_posts"),
+        TranslatableField("ideas_posts"),
         TranslatableField("news_you_can_use"),
     ]
 

network-api/networkapi/wagtailpages/templates/wagtailpages/fragments/ideas_posts.html

@@ -0,0 +1,28 @@
+{% load wagtailimages_tags i18n %}
+
+<div class="row section-ideas section-padding">
+
+    <div class="col-12">
+        <h2 class="capsule-label mb-0 ml-md-4">{% trans "Ideas" %}</h2>
+    </div>
+    <div class="col-12 col-lg-6 mb-md-4 mb-lg-0 tw-dark">
+        <div class="ideas-banner d-flex align-items-end full-bleed-xs p-3 p-md-4" style="background-image: linear-gradient(180deg, rgba(238,238,238,0) 14%, #000000 100%), url({% image_url page.ideas_image "width-540" %});">
+            <h3 class="tw-h2-heading ideas-headline mb-0">{{ page.ideas_headline }}</h3>
+        </div>
+    </div>
+
+    <div class="col-12 col-lg-6">
+        {% for post in page.ideas_posts.all %}
+            {% with localized=post.blog.localized %}
+                <div class="ideas-post">
+                    <h4 class="mb-2 tw-h5-heading">
+                        <a href="{{ localized.url }}">{{ localized.title }}</a>
+                    </h4>
+                    {% include "./blog_authors.html" with blog_page=localized %}
+                    <a href="{{ localized.url }}" class="tw-cta-link d-none d-md-inline-block tw-mt-2">{{ post.cta }}</a>
+                </div>
+            {% endwith %}
+        {% endfor %}
+    </div>
+
+</div>

network-api/networkapi/wagtailpages/templates/wagtailpages/homepage.html

@@ -43,7 +43,7 @@
     </div>
 
     <div class="container">
-        {% include "./fragments/spotlight_posts.html" %}
+        {% include "./fragments/ideas_posts.html" %}
     </div>
 
     <div class="tw-bg-gray-05">

source/sass/views/home.scss

@@ -28,7 +28,7 @@
     }
   }
 
-  .section-spotlight {
+  .section-ideas {
     .capsule-label {
       font-size: 14px;
       line-height: calc(16 / 14);
@@ -45,7 +45,7 @@
       bottom: -50%;
     }
 
-    .spotlight-banner {
+    .ideas-banner {
       background-size: cover;
       background-position: center;
       @apply tw-h-120;
@@ -55,15 +55,15 @@
       }
 
       @media (min-width: $bp-lg) {
-        height: 400px;
+        height: 100%;
       }
     }
 
-    .spotlight-headline {
+    .ideas-headline {
       font-weight: 700;
     }
 
-    .spotlight-post {
+    .ideas-post {
       $vertical-spacing: 1.5rem;
 
       &:first-child {