Fix image stretching text (canonical#13910)

* Update ROCKS to rocks

* Remove the culprit that caused text to stretch whe image size changes

templates/engage/base.html

@@ -3,9 +3,9 @@
 {% set section_title="Engage Page" %}
 {% set section_path="/engage" %}
 
-{% block title %}{{metadata['topic_name']}}{% endblock %}
-{% block meta_description %}{{metadata['subtitle']}}{% endblock %}
-{% block meta_image %}{{metadata['meta_image']}}{% endblock %}
+{% block title %}{{ metadata['topic_name'] }}{% endblock %}
+{% block meta_description %}{{ metadata['subtitle'] }}{% endblock %}
+{% block meta_image %}{{ metadata['meta_image'] }}{% endblock %}
 
 {% block head_extra %}
   {% if 'active' in metadata and metadata['active'] == "false" %}
@@ -22,9 +22,9 @@
 
 {% block content %}
 
-<span id="publish_date" class="u-hide">{{metadata["publish_date"]}}</span>
-<span id="created_date" class="u-hide">{{metadata["created_at"]}}</span>
-<section class="p-strip p-engage-banner--{{metadata['banner_class']}}">
+<span id="publish_date" class="u-hide">{{ metadata["publish_date"] }}</span>
+<span id="created_date" class="u-hide">{{ metadata["created_at"] }}</span>
+<section class="p-strip p-engage-banner--{{ metadata['banner_class'] }}">
   <div class="u-fixed-width navigation-logo-engage">
     <a href="/">
       {% if metadata['banner_class'] == 'light' %}
@@ -53,7 +53,7 @@
     </a>
   </div>
   <div class="row">
-    <div class="col-7 u-vertically-center">
+    <div class="col-7">
       <h1>{{ metadata["topic_name"] }}</h1>
       <p class="u-no-padding--top p-heading--4">
         {{ metadata['subtitle'] }}
@@ -73,7 +73,7 @@ <h1>{{ metadata["topic_name"] }}</h1>
     </div>
     {% if metadata["image"] != '' %}
     <div class="col-5 u-hide--small u-hide--medium u-vertically-center u-align--center">
-      <img src="{{metadata['image']}}" alt="" width="{{metadata['image_width']}}"/>
+      <img src="{{ metadata['image'] }}" alt="" width="{{ metadata['image_width'] }}"/>
     </div>
     {% endif %}
   </div>