Don't remove the introduction, but make the styling better

opentech/public/projects/migrations/0005_remove_projectpage_introduction.py

-# Generated by Django 2.0.2 on 2018-08-28 09:40
-
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ('projects', '0004_projectpage_categories'),
-    ]
-
-    operations = [
-        migrations.RemoveField(
-            model_name='projectpage',
-            name='introduction',
-        ),
-    ]

opentech/public/projects/models.py

@@ -99,6 +99,7 @@ class ProjectPage(FundingMixin, BasePage):
     subpage_types = []
     parent_page_types = ['ProjectIndexPage']
 
+    introduction = models.TextField(blank=True)
     icon = models.ForeignKey(
         'images.CustomImage',
         null=True,
@@ -112,13 +113,15 @@ class ProjectPage(FundingMixin, BasePage):
     categories = models.TextField(default='{}', blank=True)
 
     search_fields = BasePage.search_fields + [
+        index.SearchField('introduction'),
         index.SearchField('body'),
     ]
 
     content_panels = BasePage.content_panels + [
         ImageChooserPanel('icon'),
-        StreamFieldPanel('body'),
         FieldPanel('status'),
+        FieldPanel('introduction'),
+        StreamFieldPanel('body'),
         InlinePanel('contact_details', label="Contact Details"),
     ] + FundingMixin.content_panels + [
         InlinePanel('related_pages', label="Related Projects"),

opentech/public/projects/templates/projects/project_page.html

@@ -5,16 +5,17 @@
 <div class="wrapper wrapper--small wrapper--inner-space-large">
     <div class="media-box media-box--reverse">
         {% include "utils/includes/media_box_icon.html" with page_icon=page.icon %}
+        {% if page.introduction %}
         <div class="media-box__content">
-            <h5 class="media-box__teaser">{{ page.body }}</h5>
+            <h4 class="media-box__teaser media-box__teaser--projectpage-introduction">{{ page.introduction }}</h4>
         </div>
+        {% endif %}
     </div>
 
     <div class="wrapper wrapper--sidebar wrapper--inner-space-small">
         <div>
-            {% include "utils/includes/funding.html" %}
+            {{ page.body }}
         </div>
-
         <div>
             {% with contact_details=page.contact_details.all %}
                 {% if contact_details %}
@@ -29,8 +30,18 @@
         </div>
     </div>
 
+
+
     {% include "projects/includes/project_status.html" %}
 
+    <div class="wrapper wrapper--inner-space-small">
+        <div>
+            {% include "utils/includes/funding.html" %}
+        </div>
+
+    </div>
+
+
     {% if page.category_options.all %}
         <div class="grid grid--two grid--small-gap">
             {% regroup page.category_options by category as categories %}

opentech/static_src/src/sass/public/components/_media-box.scss

@@ -126,8 +126,12 @@
         }
 
         .media-box--reverse & {
-            @extend %h5;
+            @include responsive-font-sizes(15px, map-get($font-sizes, epsilon));
             display: block;
+
+            &--projectpage-introduction {
+                @include responsive-font-sizes(18px, map-get($font-sizes, delta));
+            }
         }
 
         .media-box--reverse:hover & {