Merge pull request #37 from hotosm/adjustments/page-changes-various

Adjustments/page changes various

app/impact_areas/migrations/0016_impactareaspage_description_and_more.py

@@ -0,0 +1,24 @@
+# Generated by Django 4.2.7 on 2024-08-01 22:06
+
+from django.db import migrations
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('impact_areas', '0015_alter_individualimpactareapage_external_icon'),
+    ]
+
+    operations = [
+        migrations.AddField(
+            model_name='impactareaspage',
+            name='description',
+            field=wagtail.fields.RichTextField(blank=True),
+        ),
+        migrations.AddField(
+            model_name='impactareaspage',
+            name='header_text',
+            field=wagtail.fields.RichTextField(blank=True),
+        ),
+    ]

app/impact_areas/migrations/0017_remove_impactareaspage_impact_area_blocks.py

@@ -0,0 +1,17 @@
+# Generated by Django 4.2.7 on 2024-08-01 22:17
+
+from django.db import migrations
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('impact_areas', '0016_impactareaspage_description_and_more'),
+    ]
+
+    operations = [
+        migrations.RemoveField(
+            model_name='impactareaspage',
+            name='impact_area_blocks',
+        ),
+    ]

app/impact_areas/migrations/0018_alter_individualimpactareapage_use_cases.py

@@ -0,0 +1,20 @@
+# Generated by Django 4.2.7 on 2024-08-02 17:03
+
+from django.db import migrations
+import wagtail.blocks
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('impact_areas', '0017_remove_impactareaspage_impact_area_blocks'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='individualimpactareapage',
+            name='use_cases',
+            field=wagtail.fields.StreamField([('blocks', wagtail.blocks.StructBlock([('description', wagtail.blocks.RichTextBlock()), ('link_text', wagtail.blocks.CharBlock()), ('link', wagtail.blocks.StreamBlock([('page', wagtail.blocks.PageChooserBlock()), ('url', wagtail.blocks.URLBlock())], blank=True, null=True))]))], blank=True, null=True, use_json_field=True),
+        ),
+    ]

app/impact_areas/migrations/0019_alter_individualimpactareapage_intro.py

@@ -0,0 +1,19 @@
+# Generated by Django 4.2.7 on 2024-08-02 18:21
+
+from django.db import migrations
+import wagtail.fields
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('impact_areas', '0018_alter_individualimpactareapage_use_cases'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='individualimpactareapage',
+            name='intro',
+            field=wagtail.fields.RichTextField(blank=True, help_text='This text will not be shown on the page itself, and will instead be shown as the short description for the page for instances such as the Search page or the Impact Areas page.'),
+        ),
+    ]

app/impact_areas/models.py

@@ -9,12 +9,13 @@
 from wagtail.admin.panels import FieldPanel, MultiFieldPanel
 
 from app.projects.models import IndividualProjectPage
+from app.core.models import LinkOrPageBlock
 
 
 class UseCaseStructBlock(StructBlock):
     description = RichTextBlock()
     link_text = CharBlock()
-    link_url = URLBlock(blank=True, null=True)
+    link = LinkOrPageBlock(blank=True, null=True)
 
 
 class UseCaseBlock(StreamBlock):
@@ -64,6 +65,8 @@ def get_context(self, request, *args, **kwargs):
         related_name="+",
         help_text="The icon representing this page which is shown for previews of this page on other pages. This should be a purely black image which is ideally as wide as it is tall."
     )
+    intro = RichTextField(blank=True, help_text="This text will not be shown on the page itself, and will instead be shown as the short description for the page for instances such as the Search page or the Impact Areas page.")
+
     intro_image = models.ForeignKey(
         "wagtailimages.Image",
         null=True,
@@ -72,7 +75,6 @@ def get_context(self, request, *args, **kwargs):
         related_name="+",
         help_text="Intro image"
     )
-    intro = RichTextField(blank=True)
     description = RichTextField(blank=True)
 
     use_cases = StreamField(UseCaseBlock(), use_json_field=True, blank=True, null=True)
@@ -84,8 +86,10 @@ def get_context(self, request, *args, **kwargs):
         ], heading="Header"),
         MultiFieldPanel([
             FieldPanel('external_icon'),
-            FieldPanel('intro_image'),
             FieldPanel('intro'),
+        ], heading="External"),
+        MultiFieldPanel([
+            FieldPanel('intro_image'),
             FieldPanel('description'),
         ], heading="Body"),
         MultiFieldPanel([
@@ -94,25 +98,12 @@ def get_context(self, request, *args, **kwargs):
     ]
 
 
-class ImpactAreaStructBlock(StructBlock):
-    image = ImageChooserBlock()
-    title = CharBlock()
-    description = RichTextBlock()
-    link = URLBlock(required=False)
-
-
-class ImpactAreaBlock(StreamBlock):
-    impact_area_block = ImpactAreaStructBlock()
-
-
 class ImpactAreasPage(Page):
     max_count = 1
 
     subpage_types = [
         'impact_areas.IndividualImpactAreaPage'
     ]
-
-    intro = RichTextField(blank=True)
 
     image = models.ForeignKey(
         "wagtailimages.Image",
@@ -122,8 +113,10 @@ class ImpactAreasPage(Page):
         related_name="+",
         help_text="Header image"
     )
-
-    impact_area_blocks = StreamField(ImpactAreaBlock(), use_json_field=True, null=True)
+    header_text = RichTextField(blank=True)
+
+    intro = RichTextField(blank=True)
+    description = RichTextField(blank=True)
 
     # > IMPACT AREA SHARED FIELDS
     use_cases_title = models.CharField(default="Use Cases")
@@ -146,9 +139,10 @@ class ImpactAreasPage(Page):
     content_panels = Page.content_panels + [
         MultiFieldPanel([
             FieldPanel('image'),
-            FieldPanel('intro')
+            FieldPanel('header_text'),
         ], heading="Header section"),
-        FieldPanel('impact_area_blocks'),
+        FieldPanel('intro'),
+        FieldPanel('description'),
         MultiFieldPanel([
             MultiFieldPanel([
                 FieldPanel('use_cases_title'),

app/impact_areas/templates/impact_areas/components/UseCaseBox.html

@@ -5,7 +5,7 @@ <h1 class="text-hot-red text-h4 font-bold">
     <div class="my-2">
         {{ body }}
     </div>
-    <a href={{ linkurl }} class="text-hot-red mt-auto font-medium py-2">
+    <a href="{%include 'ui/components/PageOrLinkHrefText.html'%}" class="text-hot-red mt-auto font-medium py-2">
         <p>
             {{ linktext }}
             {% include "ui/components/icon_svgs/LinkCaret.html" %}

app/impact_areas/templates/impact_areas/impact_areas_page.html

@@ -10,9 +10,20 @@
 {% endblock extra_css %}
 
 {% block content %}
-    {% include "ui/components/BasePageHeader.html" with title=page.title intro=page.intro image=page.image %}
+    {% include "ui/components/BasePageHeader.html" with title=page.title intro=page.header_text image=page.image %}
+
+    <div class="max-w-7xl mx-auto my-10 lg:grid lg:grid-cols-6">
+        <div class="px-6 md:px-10 col-span-5">
+            <div class="text-intro font-semibold">
+                {{page.intro|richtext}}
+            </div>
+            <div class="base-article-m">
+                {{page.description|richtext}}
+            </div>
+        </div>
+    </div>
 
-    <div class="max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 lg:gap-4 px-6 mt-6">
+    <div class="max-w-7xl mx-auto grid grid-cols-1 lg:grid-cols-2 gap-8 px-6 md:px-10 mt-6 mb-10">
         {% for child in page.get_children %}
             {% include "ui/components/impact_areas/ImpactAreaPreviewBlock.html" with ia=child.specific %}
         {% endfor %}

app/impact_areas/templates/impact_areas/individual_impact_area_page.html

@@ -10,26 +10,25 @@
 {% endblock extra_css %}
 
 {% block content %}
-    {% include "ui/components/PageHeaderWithBlur.html" with title=page.title subtitle=page.header_text image=page.header_image full_length=True %}
+    {% include "ui/components/PageHeaderWithBlur.html" with title=page.title subtitle=page.header_text image=page.header_image full_length=True endinlarge=True %}
 
     <div class="max-w-7xl mx-auto mb-20">
         <div class="px-8 my-10">
             {% comment %} MAIN BODY {% endcomment %}
             <div class="grid grid-cols-1 lg:grid-cols-2 gap-x-10">
                 <div class="base-article-m [&_p:first-child]:mt-0 lg:order-2">
                     <div class="text-intro font-medium">
-                        {{ page.intro|safe }}
+                        {{ page.description|richtext }}
                     </div>
-                    {{ page.description|safe }}
                 </div>
-                {% image page.intro_image original class="pb-8 lg:order-1" %}
+                {% image page.intro_image original class="pb-8 lg:order-1 w-full h-auto" %}
             </div>
 
             {% comment %} USE CASES {% endcomment %}
             {% include "ui/components/SectionHeadingWithUnderline.html" with title=page.get_parent.specific.use_cases_title %}
             <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8 my-10">
                 {% for case in page.use_cases %}
-                    {% include "./components/UseCaseBox.html" with number=forloop.counter body=case.value.description linktext=case.value.link_text linkurl=case.value.link_url %}
+                    {% include "./components/UseCaseBox.html" with number=forloop.counter body=case.value.description linktext=case.value.link_text linkurl=case.value.link %}
                 {% endfor %}
             </div>