Merge pull request #160 from openmcac/linked_groups

Add links to groups for improved SEO

Author: achan

app/styles/pages/index.scss

@@ -36,6 +36,10 @@
 
       .description {
         margin-top: $padding-m;
+
+        a {
+          @include body-font();
+        }
       }
 
       &:first-of-type {

app/styles/utils.scss

@@ -39,6 +39,7 @@ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
 
 @mixin body-font() {
   font-family: -apple-system, ".SFNSText-Regular", "San Francisco", "Roboto", "Segoe UI", "Helvetica Neue", "Lucida Grande", sans-serif;
+  color: #333;
 }
 
 @mixin post-display-font() {

app/templates/index.hbs

@@ -24,22 +24,31 @@
       </div>
     </div>
     <div class="row">
-      <div class="col-sm-offset-2 col-sm-4 group" {{action "viewGroup" "childrens-church"}}>
-        <img src={{cloudinary-fetch url="https://mcac.s3.amazonaws.com/groups/fabe359d-8611-4112-b675-842cd40ef57e.jpg"
-                                    width=200
-                                    radius="max"
-                                    height=200 crop="fill"}} />
+      <div class="col-sm-offset-2 col-sm-4 group">
+        {{#link-to "group.index" "childrens-church"}}
+          <img src={{cloudinary-fetch url="https://mcac.s3.amazonaws.com/groups/fabe359d-8611-4112-b675-842cd40ef57e.jpg"
+                                      width=200
+                                      radius="max"
+                                      height=200 crop="fill"}} />
+        {{/link-to}}
         <div class="description">
-          Children's Church
+          {{#link-to "group.index" "childrens-church"}}
+            Children's Church
+          {{/link-to}}
         </div>
       </div>
       <div class="col-sm-4 group" {{action "viewGroup" "english-service"}}>
-        <img src={{cloudinary-fetch url="https://mcac.s3.amazonaws.com/groups/5c7d76a8-d195-4907-951d-5b3fb00c438d.jpg"
-                                    width=200
-                                    radius="max"
-                                    height=200 crop="fill"}} />
+        {{#link-to "group.index" "english-service"}}
+          <img src={{cloudinary-fetch url="https://mcac.s3.amazonaws.com/groups/5c7d76a8-d195-4907-951d-5b3fb00c438d.jpg"
+                                      width=200
+                                      radius="max"
+                                      height=200 crop="fill"}} />
+
+        {{/link-to}}
         <div class="description">
-          English Service
+          {{#link-to "group.index" "english-service"}}
+            English Service
+          {{/link-to}}
         </div>
       </div>
     </div>

tests/unit/controllers/index-test.js

@@ -16,16 +16,3 @@ test("viewOnlineSermons: it redirects to sunday's bulletin", function(assert) {
 
   controller.send("viewOnlineSermons");
 });
-
-test("viewGroup: it redirects to group with group slug", function(assert) {
-  const controller = this.subject();
-
-  const done = assert.async();
-  controller.transitionToRoute = function(name, model) {
-    assert.equal(name, "group.index");
-    assert.equal(model, "random-slug");
-    done();
-  };
-
-  controller.send("viewGroup", "random-slug");
-});