diff --git a/opentech/public/funds/migrations/0012_add_box_apply_link_fields.py b/opentech/public/funds/migrations/0012_add_box_apply_link_fields.py
new file mode 100644
index 0000000000000000000000000000000000000000..93101d0feaad2a3b358fd5577377968dd3d7861c
--- /dev/null
+++ b/opentech/public/funds/migrations/0012_add_box_apply_link_fields.py
@@ -0,0 +1,30 @@
+# Generated by Django 2.2.9 on 2020-01-21 20:17
+
+from django.db import migrations
+import opentech.public.funds.blocks
+import wagtail.core.blocks
+import wagtail.core.fields
+import wagtail.documents.blocks
+import wagtail.embeds.blocks
+import wagtail.images.blocks
+import wagtail.snippets.blocks
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('public_funds', '0011_opencallindexpage'),
+ ]
+
+ operations = [
+ migrations.AlterField(
+ model_name='baseapplicationpage',
+ name='body',
+ field=wagtail.core.fields.StreamField([('heading', wagtail.core.blocks.CharBlock(classname='full title', icon='title')), ('paragraph', wagtail.core.blocks.RichTextBlock()), ('box', wagtail.core.blocks.StructBlock([('box_content', wagtail.core.blocks.RichTextBlock()), ('box_class', wagtail.core.blocks.CharBlock(required=False))])), ('apply_link', wagtail.core.blocks.StructBlock([('application', wagtail.core.blocks.PageChooserBlock())])), ('image', wagtail.core.blocks.StructBlock([('image', wagtail.images.blocks.ImageChooserBlock()), ('caption', wagtail.core.blocks.CharBlock(required=False))])), ('quote', wagtail.core.blocks.StructBlock([('quote', wagtail.core.blocks.CharBlock(classname='title')), ('attribution', wagtail.core.blocks.CharBlock(required=False)), ('job_title', wagtail.core.blocks.CharBlock(required=False))])), ('embed', wagtail.embeds.blocks.EmbedBlock()), ('call_to_action', wagtail.snippets.blocks.SnippetChooserBlock('utils.CallToActionSnippet', template='blocks/call_to_action_block.html')), ('document', wagtail.core.blocks.StructBlock([('document', wagtail.documents.blocks.DocumentChooserBlock()), ('title', wagtail.core.blocks.CharBlock(required=False))])), ('project_list', opentech.public.funds.blocks.ProjectsBlock()), ('reviewer_list', opentech.public.funds.blocks.ReviewersBlock())]),
+ ),
+ migrations.AlterField(
+ model_name='labpage',
+ name='body',
+ field=wagtail.core.fields.StreamField([('heading', wagtail.core.blocks.CharBlock(classname='full title', icon='title')), ('paragraph', wagtail.core.blocks.RichTextBlock()), ('box', wagtail.core.blocks.StructBlock([('box_content', wagtail.core.blocks.RichTextBlock()), ('box_class', wagtail.core.blocks.CharBlock(required=False))])), ('apply_link', wagtail.core.blocks.StructBlock([('application', wagtail.core.blocks.PageChooserBlock())])), ('image', wagtail.core.blocks.StructBlock([('image', wagtail.images.blocks.ImageChooserBlock()), ('caption', wagtail.core.blocks.CharBlock(required=False))])), ('quote', wagtail.core.blocks.StructBlock([('quote', wagtail.core.blocks.CharBlock(classname='title')), ('attribution', wagtail.core.blocks.CharBlock(required=False)), ('job_title', wagtail.core.blocks.CharBlock(required=False))])), ('embed', wagtail.embeds.blocks.EmbedBlock()), ('call_to_action', wagtail.snippets.blocks.SnippetChooserBlock('utils.CallToActionSnippet', template='blocks/call_to_action_block.html')), ('document', wagtail.core.blocks.StructBlock([('document', wagtail.documents.blocks.DocumentChooserBlock()), ('title', wagtail.core.blocks.CharBlock(required=False))])), ('reviewer_list', opentech.public.funds.blocks.ReviewersBlock())]),
+ ),
+ ]
diff --git a/opentech/public/news/migrations/0011_add_box_apply_link_fields.py b/opentech/public/news/migrations/0011_add_box_apply_link_fields.py
new file mode 100644
index 0000000000000000000000000000000000000000..6164ac35feebb43ddae3101e42fd36fef1910404
--- /dev/null
+++ b/opentech/public/news/migrations/0011_add_box_apply_link_fields.py
@@ -0,0 +1,24 @@
+# Generated by Django 2.2.9 on 2020-01-21 20:17
+
+from django.db import migrations
+import wagtail.core.blocks
+import wagtail.core.fields
+import wagtail.documents.blocks
+import wagtail.embeds.blocks
+import wagtail.images.blocks
+import wagtail.snippets.blocks
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('news', '0010_newsfeedsettings'),
+ ]
+
+ operations = [
+ migrations.AlterField(
+ model_name='newspage',
+ name='body',
+ field=wagtail.core.fields.StreamField([('heading', wagtail.core.blocks.CharBlock(classname='full title', icon='title')), ('paragraph', wagtail.core.blocks.RichTextBlock()), ('box', wagtail.core.blocks.StructBlock([('box_content', wagtail.core.blocks.RichTextBlock()), ('box_class', wagtail.core.blocks.CharBlock(required=False))])), ('apply_link', wagtail.core.blocks.StructBlock([('application', wagtail.core.blocks.PageChooserBlock())])), ('image', wagtail.core.blocks.StructBlock([('image', wagtail.images.blocks.ImageChooserBlock()), ('caption', wagtail.core.blocks.CharBlock(required=False))])), ('quote', wagtail.core.blocks.StructBlock([('quote', wagtail.core.blocks.CharBlock(classname='title')), ('attribution', wagtail.core.blocks.CharBlock(required=False)), ('job_title', wagtail.core.blocks.CharBlock(required=False))])), ('embed', wagtail.embeds.blocks.EmbedBlock()), ('call_to_action', wagtail.snippets.blocks.SnippetChooserBlock('utils.CallToActionSnippet', template='blocks/call_to_action_block.html')), ('document', wagtail.core.blocks.StructBlock([('document', wagtail.documents.blocks.DocumentChooserBlock()), ('title', wagtail.core.blocks.CharBlock(required=False))])), ('awesome_table_widget', wagtail.core.blocks.StructBlock([('table_id', wagtail.core.blocks.CharBlock(classname='title', help_text='Please enter only table id from embed code. Table widget code creates automatically.'))]))]),
+ ),
+ ]
diff --git a/opentech/public/people/migrations/0013_add_box_apply_link_fields.py b/opentech/public/people/migrations/0013_add_box_apply_link_fields.py
new file mode 100644
index 0000000000000000000000000000000000000000..6a89378f876fca1ed60a856a98e6a32107a76e27
--- /dev/null
+++ b/opentech/public/people/migrations/0013_add_box_apply_link_fields.py
@@ -0,0 +1,24 @@
+# Generated by Django 2.2.9 on 2020-01-21 20:17
+
+from django.db import migrations
+import wagtail.core.blocks
+import wagtail.core.fields
+import wagtail.documents.blocks
+import wagtail.embeds.blocks
+import wagtail.images.blocks
+import wagtail.snippets.blocks
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('people', '0012_personindexpage_introduction'),
+ ]
+
+ operations = [
+ migrations.AlterField(
+ model_name='personpage',
+ name='biography',
+ field=wagtail.core.fields.StreamField([('heading', wagtail.core.blocks.CharBlock(classname='full title', icon='title')), ('paragraph', wagtail.core.blocks.RichTextBlock()), ('box', wagtail.core.blocks.StructBlock([('box_content', wagtail.core.blocks.RichTextBlock()), ('box_class', wagtail.core.blocks.CharBlock(required=False))])), ('apply_link', wagtail.core.blocks.StructBlock([('application', wagtail.core.blocks.PageChooserBlock())])), ('image', wagtail.core.blocks.StructBlock([('image', wagtail.images.blocks.ImageChooserBlock()), ('caption', wagtail.core.blocks.CharBlock(required=False))])), ('quote', wagtail.core.blocks.StructBlock([('quote', wagtail.core.blocks.CharBlock(classname='title')), ('attribution', wagtail.core.blocks.CharBlock(required=False)), ('job_title', wagtail.core.blocks.CharBlock(required=False))])), ('embed', wagtail.embeds.blocks.EmbedBlock()), ('call_to_action', wagtail.snippets.blocks.SnippetChooserBlock('utils.CallToActionSnippet', template='blocks/call_to_action_block.html')), ('document', wagtail.core.blocks.StructBlock([('document', wagtail.documents.blocks.DocumentChooserBlock()), ('title', wagtail.core.blocks.CharBlock(required=False))]))], blank=True),
+ ),
+ ]
diff --git a/opentech/public/projects/migrations/0008_add_box_apply_link_fields.py b/opentech/public/projects/migrations/0008_add_box_apply_link_fields.py
new file mode 100644
index 0000000000000000000000000000000000000000..ade045c703aa3c61655b4ceaaef5f4eac36b36e6
--- /dev/null
+++ b/opentech/public/projects/migrations/0008_add_box_apply_link_fields.py
@@ -0,0 +1,24 @@
+# Generated by Django 2.2.9 on 2020-01-21 20:17
+
+from django.db import migrations
+import wagtail.core.blocks
+import wagtail.core.fields
+import wagtail.documents.blocks
+import wagtail.embeds.blocks
+import wagtail.images.blocks
+import wagtail.snippets.blocks
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('projects', '0007_fix_related_page_required_behaviour'),
+ ]
+
+ operations = [
+ migrations.AlterField(
+ model_name='projectpage',
+ name='body',
+ field=wagtail.core.fields.StreamField([('heading', wagtail.core.blocks.CharBlock(classname='full title', icon='title')), ('paragraph', wagtail.core.blocks.RichTextBlock()), ('box', wagtail.core.blocks.StructBlock([('box_content', wagtail.core.blocks.RichTextBlock()), ('box_class', wagtail.core.blocks.CharBlock(required=False))])), ('apply_link', wagtail.core.blocks.StructBlock([('application', wagtail.core.blocks.PageChooserBlock())])), ('image', wagtail.core.blocks.StructBlock([('image', wagtail.images.blocks.ImageChooserBlock()), ('caption', wagtail.core.blocks.CharBlock(required=False))])), ('quote', wagtail.core.blocks.StructBlock([('quote', wagtail.core.blocks.CharBlock(classname='title')), ('attribution', wagtail.core.blocks.CharBlock(required=False)), ('job_title', wagtail.core.blocks.CharBlock(required=False))])), ('embed', wagtail.embeds.blocks.EmbedBlock()), ('call_to_action', wagtail.snippets.blocks.SnippetChooserBlock('utils.CallToActionSnippet', template='blocks/call_to_action_block.html')), ('document', wagtail.core.blocks.StructBlock([('document', wagtail.documents.blocks.DocumentChooserBlock()), ('title', wagtail.core.blocks.CharBlock(required=False))]))]),
+ ),
+ ]
diff --git a/opentech/public/standardpages/migrations/0004_add_box_apply_link_fields.py b/opentech/public/standardpages/migrations/0004_add_box_apply_link_fields.py
new file mode 100644
index 0000000000000000000000000000000000000000..5df9d3c7e135f74f6f5b42a7ea7eaf30cf37cca9
--- /dev/null
+++ b/opentech/public/standardpages/migrations/0004_add_box_apply_link_fields.py
@@ -0,0 +1,24 @@
+# Generated by Django 2.2.9 on 2020-01-21 20:17
+
+from django.db import migrations
+import wagtail.core.blocks
+import wagtail.core.fields
+import wagtail.documents.blocks
+import wagtail.embeds.blocks
+import wagtail.images.blocks
+import wagtail.snippets.blocks
+
+
+class Migration(migrations.Migration):
+
+ dependencies = [
+ ('standardpages', '0003_correct_related_page_behaviour'),
+ ]
+
+ operations = [
+ migrations.AlterField(
+ model_name='informationpage',
+ name='body',
+ field=wagtail.core.fields.StreamField([('heading', wagtail.core.blocks.CharBlock(classname='full title', icon='title')), ('paragraph', wagtail.core.blocks.RichTextBlock()), ('box', wagtail.core.blocks.StructBlock([('box_content', wagtail.core.blocks.RichTextBlock()), ('box_class', wagtail.core.blocks.CharBlock(required=False))])), ('apply_link', wagtail.core.blocks.StructBlock([('application', wagtail.core.blocks.PageChooserBlock())])), ('image', wagtail.core.blocks.StructBlock([('image', wagtail.images.blocks.ImageChooserBlock()), ('caption', wagtail.core.blocks.CharBlock(required=False))])), ('quote', wagtail.core.blocks.StructBlock([('quote', wagtail.core.blocks.CharBlock(classname='title')), ('attribution', wagtail.core.blocks.CharBlock(required=False)), ('job_title', wagtail.core.blocks.CharBlock(required=False))])), ('embed', wagtail.embeds.blocks.EmbedBlock()), ('call_to_action', wagtail.snippets.blocks.SnippetChooserBlock('utils.CallToActionSnippet', template='blocks/call_to_action_block.html')), ('document', wagtail.core.blocks.StructBlock([('document', wagtail.documents.blocks.DocumentChooserBlock()), ('title', wagtail.core.blocks.CharBlock(required=False))]))]),
+ ),
+ ]
diff --git a/opentech/public/standardpages/templates/standardpages/information_page.html b/opentech/public/standardpages/templates/standardpages/information_page.html
index fdd7ebac6a0757d469fe4966d597c90335f8e350..e676eafdaccafb2138480d349939b3ff9a788209 100644
--- a/opentech/public/standardpages/templates/standardpages/information_page.html
+++ b/opentech/public/standardpages/templates/standardpages/information_page.html
@@ -3,7 +3,7 @@
{% block content %}
- <div class="wrapper wrapper--flex">
+ <div class="wrapper">
<article class="section section--main">
{% if page.introduction %}
<h4 class="heading heading--introduction">{{ page.introduction }}</h4>
@@ -21,4 +21,5 @@
{% block extra_js %}
<script src="{% static 'js/public/dataviz-iframe.js' %}"></script>
+ <script src="{% static 'js/public/page-box.js' %}"></script>
{% endblock %}
diff --git a/opentech/public/utils/blocks.py b/opentech/public/utils/blocks.py
index 69409c87fc1ffe0f8c9fe843a1f944c696424c93..19f33b89ff7e77dd88adfcaca3ac934292869ea1 100644
--- a/opentech/public/utils/blocks.py
+++ b/opentech/public/utils/blocks.py
@@ -33,10 +33,29 @@ class QuoteBlock(blocks.StructBlock):
template = "blocks/quote_block.html"
+class BoxBlock(blocks.StructBlock):
+ box_content = blocks.RichTextBlock()
+ box_class = blocks.CharBlock(required=False)
+
+ class Meta:
+ icon = "placeholder"
+ template = "blocks/box_block.html"
+
+
+class ApplyLinkBlock(blocks.StructBlock):
+ application = blocks.PageChooserBlock()
+
+ class Meta:
+ icon = "link"
+ template = "blocks/apply_link_block.html"
+
+
# Main streamfield block to be inherited by Pages
class StoryBlock(blocks.StreamBlock):
heading = blocks.CharBlock(classname="full title", icon='title')
paragraph = blocks.RichTextBlock()
+ box = BoxBlock()
+ apply_link = ApplyLinkBlock()
image = ImageBlock()
quote = QuoteBlock()
embed = EmbedBlock()
diff --git a/opentech/static_src/src/images/learnings/bullhorn-icon-red.svg b/opentech/static_src/src/images/learnings/bullhorn-icon-red.svg
new file mode 100755
index 0000000000000000000000000000000000000000..23544b2eb37cbe2907c496ad4fba0710771a98c5
--- /dev/null
+++ b/opentech/static_src/src/images/learnings/bullhorn-icon-red.svg
@@ -0,0 +1,3 @@
+<svg width="30" height="28" viewBox="0 0 30 28" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M30 13.125C30 11.8327 29.3255 10.7166 28.3333 10.1106V1.75055C28.3333 1.27203 27.9698 0 26.6667 0C26.2958 0 25.9276 0.130156 25.626 0.383906L21.1974 4.1043C18.9729 5.97133 16.1802 7 13.3333 7H3.33333C1.49219 7 0 8.5668 0 10.5V15.75C0 17.6832 1.49219 19.25 3.33333 19.25H5.08854C5.01615 19.8231 4.975 20.4061 4.975 21C4.975 23.1749 5.45729 25.2301 6.30625 27.067C6.57656 27.6516 7.16667 28 7.78542 28H11.6542C13.0109 28 13.8255 26.3681 13.0031 25.235C12.149 24.0581 11.6411 22.5903 11.6411 21C11.6411 20.3924 11.7255 19.8084 11.8708 19.25H13.3333C16.1802 19.25 18.9729 20.2787 21.1969 22.1457L25.6255 25.8661C25.9209 26.1143 26.2878 26.2497 26.6661 26.25C27.9641 26.25 28.3328 25.0042 28.3328 24.5V16.1399C29.3255 15.5334 30 14.4173 30 13.125ZM25 20.8589L23.2786 19.413C20.4661 17.0505 16.9333 15.75 13.3333 15.75V10.5C16.9333 10.5 20.4661 9.19953 23.2786 6.83703L25 5.39109V20.8589Z" fill="#DE1A3E"/>
+</svg>
diff --git a/opentech/static_src/src/images/learnings/otf-icon-red.svg b/opentech/static_src/src/images/learnings/otf-icon-red.svg
new file mode 100755
index 0000000000000000000000000000000000000000..fa45a6214de4fbd22e8fea928b907473949cbdf8
--- /dev/null
+++ b/opentech/static_src/src/images/learnings/otf-icon-red.svg
@@ -0,0 +1,18 @@
+<svg width="34" height="31" viewBox="0 0 34 31" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect x="7.55542" y="26.4445" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect x="3.77783" y="22.6666" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect y="18.8889" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect y="15.1111" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect y="11.3334" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect y="7.55554" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect x="3.77783" y="3.77777" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect x="7.55542" width="3.77778" height="3.77778" fill="#DE1A3E"/>
+<rect x="26.4446" y="3.77777" width="3.77778" height="3.77778" transform="rotate(-180 26.4446 3.77777)" fill="#DE1A3E"/>
+<rect x="30.2222" y="7.55554" width="3.77778" height="3.77778" transform="rotate(-180 30.2222 7.55554)" fill="#DE1A3E"/>
+<rect x="34" y="11.3334" width="3.77778" height="3.77778" transform="rotate(-180 34 11.3334)" fill="#DE1A3E"/>
+<rect x="34" y="15.1111" width="3.77778" height="3.77778" transform="rotate(-180 34 15.1111)" fill="#DE1A3E"/>
+<rect x="34" y="18.8889" width="3.77778" height="3.77778" transform="rotate(-180 34 18.8889)" fill="#DE1A3E"/>
+<rect x="34" y="22.6666" width="3.77778" height="3.77778" transform="rotate(-180 34 22.6666)" fill="#DE1A3E"/>
+<rect x="30.2222" y="26.4445" width="3.77778" height="3.77778" transform="rotate(-180 30.2222 26.4445)" fill="#DE1A3E"/>
+<rect x="26.4446" y="30.2222" width="3.77778" height="3.77778" transform="rotate(-180 26.4446 30.2222)" fill="#DE1A3E"/>
+</svg>
diff --git a/opentech/static_src/src/images/learnings/potion-icon-red.svg b/opentech/static_src/src/images/learnings/potion-icon-red.svg
new file mode 100755
index 0000000000000000000000000000000000000000..e59dbb71bfc045f449e5b75119db56f223a833da
--- /dev/null
+++ b/opentech/static_src/src/images/learnings/potion-icon-red.svg
@@ -0,0 +1,3 @@
+<svg width="27" height="29" viewBox="0 0 27 29" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.81435 19.0082L4.36734 19.9726C4.37098 19.9762 4.37828 19.9799 4.38192 19.9835L4.8449 20.2735L4.85584 20.2844C5.89836 20.8839 7.08203 21.1979 8.28628 21.1944C9.92312 21.1944 11.4652 20.6252 12.6974 19.6064C14.3819 18.2017 16.5105 17.4328 18.7088 17.4348C20.6154 17.4348 22.4346 18.004 23.9803 19.0481L24.2683 19.2294L20.1999 8.75184V2.45806H22.5148C22.6752 2.45806 22.8064 2.32754 22.8064 2.16802V0.290036C22.8064 0.130516 22.6752 0 22.5148 0H4.484C4.32359 0 4.19235 0.130516 4.19235 0.290036V2.17165C4.19235 2.33117 4.32359 2.46168 4.484 2.46168H6.7989V8.75547L2.81435 19.0082ZM14.9539 11.645C15.756 11.645 16.4085 12.2939 16.4085 13.0915C16.4085 13.8891 15.756 14.5381 14.9539 14.5381C14.1519 14.5381 13.4994 13.8891 13.4994 13.0915C13.4994 12.2939 14.1519 11.645 14.9539 11.645ZM26.842 25.8531L25.752 23.047L22.6278 21.1074L22.6241 21.111C22.5986 21.0929 22.5694 21.0748 22.5439 21.0566L22.2486 20.8754L22.2377 20.8645C21.1805 20.23 19.9665 19.8929 18.7015 19.8929C17.0647 19.8929 15.5226 20.4621 14.2905 21.4808C12.606 22.8855 10.4773 23.6545 8.27899 23.6525C6.34686 23.6525 4.50587 23.0688 2.94923 21.9992L1.89567 21.343L0.156758 25.8531C0.054683 26.1214 0 26.4042 0 26.687C0 27.9631 1.04262 29 2.32585 29H24.6693C24.9573 29 25.2416 28.9456 25.5077 28.8441C25.7935 28.7357 26.0548 28.5722 26.2768 28.3629C26.4987 28.1536 26.6768 27.9028 26.8008 27.6248C26.9248 27.3468 26.9923 27.0471 26.9994 26.743C27.0065 26.439 26.953 26.1365 26.842 25.8531Z" fill="#DE1A3E"/>
+</svg>
diff --git a/opentech/static_src/src/images/learnings/user-friends-icon-red.svg b/opentech/static_src/src/images/learnings/user-friends-icon-red.svg
new file mode 100755
index 0000000000000000000000000000000000000000..31ffed7e237f38a9af60d7a963fddb5f81a404f3
--- /dev/null
+++ b/opentech/static_src/src/images/learnings/user-friends-icon-red.svg
@@ -0,0 +1,3 @@
+<svg width="34" height="27" viewBox="0 0 34 27" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M10.2 13.5C13.4884 13.5 16.15 10.858 16.15 7.59375C16.15 4.32949 13.4884 1.6875 10.2 1.6875C6.91156 1.6875 4.25 4.32949 4.25 7.59375C4.25 10.858 6.91156 13.5 10.2 13.5ZM14.28 15.1875H13.8391C12.7341 15.7148 11.5069 16.0312 10.2 16.0312C8.89313 16.0312 7.67125 15.7148 6.56094 15.1875H6.12C2.74125 15.1875 0 17.9086 0 21.2625V22.7812C0 24.1787 1.14219 25.3125 2.55 25.3125H17.85C19.2578 25.3125 20.4 24.1787 20.4 22.7812V21.2625C20.4 17.9086 17.6588 15.1875 14.28 15.1875ZM25.5 13.5C28.3156 13.5 30.6 11.2324 30.6 8.4375C30.6 5.64258 28.3156 3.375 25.5 3.375C22.6844 3.375 20.4 5.64258 20.4 8.4375C20.4 11.2324 22.6844 13.5 25.5 13.5ZM28.05 15.1875H27.8481C27.1097 15.4406 26.3288 15.6094 25.5 15.6094C24.6713 15.6094 23.8903 15.4406 23.1519 15.1875H22.95C21.8663 15.1875 20.8675 15.4986 19.9909 15.9996C21.2872 17.3865 22.1 19.227 22.1 21.2625V23.2875C22.1 23.4035 22.0734 23.5143 22.0681 23.625H31.45C32.8578 23.625 34 22.4912 34 21.0938C34 17.8295 31.3384 15.1875 28.05 15.1875Z" fill="#DE1A3E"/>
+</svg>
diff --git a/opentech/static_src/src/javascript/public/page-box.js b/opentech/static_src/src/javascript/public/page-box.js
new file mode 100644
index 0000000000000000000000000000000000000000..188079985498cad1ee2a38e2911d3ba708e63c51
--- /dev/null
+++ b/opentech/static_src/src/javascript/public/page-box.js
@@ -0,0 +1,7 @@
+(function ($) {
+
+ 'use strict';
+
+ $('.page-box').wrapAll('<div class="wrapper wrapper--breakout wrapper--inner-space-large wrapper--page-box" />').wrapAll('<div class="wrapper wrapper--small wrapper--flex page-boxes" />');
+
+})(jQuery);
diff --git a/opentech/static_src/src/sass/public/components/_page-box.scss b/opentech/static_src/src/sass/public/components/_page-box.scss
new file mode 100644
index 0000000000000000000000000000000000000000..e1880dccfd2d863115ff6b7b474923cc2877c2b8
--- /dev/null
+++ b/opentech/static_src/src/sass/public/components/_page-box.scss
@@ -0,0 +1,65 @@
+.page-boxes {
+ flex-flow: wrap;
+ justify-content: space-between;
+}
+
+.page-box {
+ padding: 1rem;
+ margin-bottom: 1rem;
+ background-color: $color--white;
+
+ @include media-query(tablet-portrait) {
+ padding: 2rem;
+ margin-bottom: 2rem;
+ width: 48%;
+ }
+
+ & > .wrapper {
+ position: relative;
+
+ &::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ right: 0;
+ width: 40px;
+ height: 40px;
+ background-repeat: no-repeat;
+ }
+ }
+
+ .otf-icon-red {
+ &::before {
+ background-image: url('./../../images/learnings/otf-icon-red.svg');
+ }
+ }
+
+ .bullhorn-icon-red {
+ &::before {
+ background-image: url('./../../images/learnings/bullhorn-icon-red.svg');
+ }
+ }
+
+ .potion-icon-red {
+ &::before {
+ background-image: url('./../../images/learnings/potion-icon-red.svg');
+ }
+ }
+
+ .user-friends-icon-red {
+ &::before {
+ background-image: url('./../../images/learnings/user-friends-icon-red.svg');
+ }
+ }
+
+ b:first-of-type {
+ color: $color--pink;
+ }
+
+ h3,
+ h4,
+ h5 {
+ color: $color--dark-blue;
+ }
+
+}
diff --git a/opentech/static_src/src/sass/public/components/_wrapper.scss b/opentech/static_src/src/sass/public/components/_wrapper.scss
index 4ae716a77baf82b93e90ecd3074d765ee6cda180..1267dbaeac81f109739f842b665e5c79fc469985 100644
--- a/opentech/static_src/src/sass/public/components/_wrapper.scss
+++ b/opentech/static_src/src/sass/public/components/_wrapper.scss
@@ -244,4 +244,12 @@
&--center {
text-align: center;
}
+
+ &--flex {
+ display: flex;
+ }
+
+ &--page-box {
+ background-color: $color--light-grey;
+ }
}
diff --git a/opentech/static_src/src/sass/public/main.scss b/opentech/static_src/src/sass/public/main.scss
index 6cb1a024548c35c364e249c8c52fac82483efa19..474d97f992bbd6d7aec40919ea9c021e23dcefd5 100644
--- a/opentech/static_src/src/sass/public/main.scss
+++ b/opentech/static_src/src/sass/public/main.scss
@@ -28,6 +28,7 @@
@import 'components/media-box';
@import 'components/messages';
@import 'components/nav';
+@import 'components/page-box';
@import 'components/pagination';
@import 'components/responsive-object';
@import 'components/rich-text';
diff --git a/opentech/templates/blocks/apply_link_block.html b/opentech/templates/blocks/apply_link_block.html
new file mode 100644
index 0000000000000000000000000000000000000000..43286110244efa3b3fc5192aae9cbe6f4dc384e3
--- /dev/null
+++ b/opentech/templates/blocks/apply_link_block.html
@@ -0,0 +1,6 @@
+{% load i18n %}
+<div class="wrapper wrapper--outer-space-medium">
+<a class="link link--button-secondary" href="{{ value.application.url }}">
+ {% trans "Apply for the" %} {{ value.application.title }}
+</a>
+</div>
diff --git a/opentech/templates/blocks/box_block.html b/opentech/templates/blocks/box_block.html
new file mode 100644
index 0000000000000000000000000000000000000000..b056d8b8672657f47e4152b062bd742a0760a30d
--- /dev/null
+++ b/opentech/templates/blocks/box_block.html
@@ -0,0 +1,5 @@
+<div class="page-box">
+ <div class="wrapper wrapper--medium {{ value.box_class|slugify }}">
+ {{ value.box_content }}
+ </div>
+</div>