diff --git a/opentech/public/projects/templates/projects/project_page.html b/opentech/public/projects/templates/projects/project_page.html index ad2f944dfb7a24daaca8f9d02e283ea143727faa..40a87ce4729c77351392ee912607270d83b191ba 100644 --- a/opentech/public/projects/templates/projects/project_page.html +++ b/opentech/public/projects/templates/projects/project_page.html @@ -5,18 +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"> - {% if page.introduction %} - <h5 class="media-box__teaser">{{ page.introduction }}</h5> - {% endif %} + <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 %} @@ -31,9 +30,17 @@ </div> </div> + + {% include "projects/includes/project_status.html" %} - {{ page.body }} + <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"> diff --git a/opentech/static_src/src/sass/public/components/_media-box.scss b/opentech/static_src/src/sass/public/components/_media-box.scss index 47b8e2d7e623c41f05fe9916eb33b85f4cd31462..ace24b8e98d9a1818f351edd69ddafc55cc36cf1 100644 --- a/opentech/static_src/src/sass/public/components/_media-box.scss +++ b/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 & {