diff --git a/app/views/navigation/main/_notifications.haml b/app/views/navigation/main/_notifications.haml
index 369e5135..584cc8b9 100644
--- a/app/views/navigation/main/_notifications.haml
+++ b/app/views/navigation/main/_notifications.haml
@@ -19,104 +19,8 @@
     - else
       - notifications.each do |notification|
         .dropdown-item.media.notification--dropdown-media
-          - case notification.target_type
-            - when "Answer"
-              .pull-left
-                %i.fa.fa-2x.fa-fw.fa-exclamation
-              .media-body
-                .notification--heading
-                  %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-                  = user_screen_name notification.target.user
-                  answered
-                  = link_to "your question", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.id)
-                  = time_tooltip(notification.target)
-                  ago
-                .list-group.notification--list
-                  .list-group-item
-                    .media.question-media
-                      .media-body
-                        %h6.notification--list-heading question
-                        .notification--list-content
-                          = markdown notification.target.question.content[0..60] + "#{notification.target.question.content.length > 60 ? '[...]' : ''}"
-                  .list-group-item
-                    .media.question-media
-                      .media-body
-                        %h6.notification--list-heading answer
-                        .notification--list-content
-                          = markdown notification.target.content[0..60] + "#{notification.target.content.length > 60 ? '[...]' : ''}"
-            - when "Relationship"
-              .pull-left
-                %img.img-rounded.notification--dropdown-img{src: notification.target.source.profile_picture.url(:small)}
-              .media-body
-                %h6.media-heading.notification--dropdown-user
-                  = user_screen_name notification.target.source
-                .notification--dropdown-text
-                  = raw t('views.notifications.relationship.body', time: time_ago_in_words(notification.target.created_at))
-            - when "Smile"
-              .pull-left
-                %i.fa.fa-2x.fa-fw.fa-smile-o
-              .media-body
-                .notification--heading
-                  %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-                  = user_screen_name notification.target.user
-                  smiled
-                  = link_to "your answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-                  = time_tooltip(notification.target)
-                  ago
-                .list-group.notification--list
-                  .list-group-item
-                    .media.question-media
-                      .media-body
-                        %h6.notification--list-heading answer
-                        .notification--list-content
-                          = markdown notification.target.answer.content[0..60] + "#{notification.target.answer.content.length > 60 ? '[...]' : ''}"
-            - when "CommentSmile"
-              .pull-left
-                %i.fa.fa-2x.fa-fw.fa-smile-o
-              .media-body
-                .notification--heading
-                  %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-                  = user_screen_name notification.target.user
-                  smiled
-                  = link_to "your comment", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.comment.answer.id)
-                  = time_tooltip(notification.target)
-                  ago
-                .list-group.notification--list
-                  .list-group-item
-                    .media.question-media
-                      .media-body
-                        %h6.notification--list-heading comment
-                        .notification--list-content
-                          = markdown notification.target.comment.content[0..60] + "#{notification.target.comment.content.length > 60 ? '[...]' : ''}"
-            - when "Comment"
-              .pull-left
-                %i.fa.fa-2x.fa-fw.fa-comments
-              .media-body
-                .notification--heading
-                  %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-                  = user_screen_name notification.target.user
-                  commented on
-                  - if notification.target.answer.user == current_user
-                    = link_to "your answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-                  - elsif notification.target.user == notification.target.answer.user
-                    = link_to "their answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-                  - else
-                    = link_to "#{notification.target.answer.user.screen_name}'s answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-                  = time_tooltip(notification.target)
-                  ago
-                .list-group.notification--list
-                  .list-group-item
-                    .media.question-media
-                      .media-body
-                        %h6.notification--list-heading answer
-                        .notification--list-content
-                          = markdown notification.target.answer.content[0..60] + "#{notification.target.answer.content.length > 60 ? '[...]' : ''}"
-                  .list-group-item
-                    .media.question-media
-                      .media-body
-                        %h6.notification--list-heading comment
-                        .notification--list-content
-                          = markdown notification.target.content[0..60] + "#{notification.target.content.length > 60 ? '[...]' : ''}"
+          = render "notifications/type/#{notification.target_type.downcase}", notification: notification
+
       %a.dropdown-item.text-center{href: notifications_path}
         %i.fa.fa-fw.fa-chevron-right
         Show all new notifications
diff --git a/app/views/notifications/_notification.html.haml b/app/views/notifications/_notification.html.haml
deleted file mode 100644
index 594ec85c..00000000
--- a/app/views/notifications/_notification.html.haml
+++ /dev/null
@@ -1,100 +0,0 @@
-%li.list-group-item
-  .media
-    - case notification.target_type
-      - when "Answer"
-        .pull-left
-          %i.fa.fa-2x.fa-fw.fa-exclamation
-        .media-body
-          .notification--heading
-            %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-            = user_screen_name notification.target.user
-            answered
-            = link_to "your question", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.id)
-            = time_tooltip(notification.target)
-            ago
-          .list-group.notification--list
-            .list-group-item
-              .media.question-media
-                .media-body
-                  %h6.notification--list-heading question
-                  .notification--list-content
-                    = markdown notification.target.question.content
-            .list-group-item
-              .media.question-media
-                .media-body
-                  %h6.notification--list-heading answer
-                  .notification--list-content
-                    = markdown notification.target.content[0..255] + "#{notification.target.content.length > 255 ? '[...]' : ''}"
-      - when "Relationship"
-        .pull-left
-          %img.img-rounded.notification--dropdown-img{src: notification.target.source.profile_picture.url(:small)}
-        .media-body
-          %h6.media-heading.notification--dropdown-user
-            = user_screen_name notification.target.source
-          .notification--dropdown-text
-            = raw t('views.notifications.relationship.body', time: time_ago_in_words(notification.target.created_at))
-      - when "Smile"
-        .pull-left
-          %i.fa.fa-2x.fa-fw.fa-smile-o
-        .media-body
-          .notification--heading
-            %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-            = user_screen_name notification.target.user
-            smiled
-            = link_to "your answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-            = time_tooltip(notification.target)
-            ago
-          .list-group.notification--list
-            .list-group-item
-              .media.question-media
-                .media-body
-                  %h6.notification--list-heading answer
-                  .notification--list-content
-                    = markdown notification.target.answer.content[0..255] + "#{notification.target.answer.content.length > 255 ? '[...]' : ''}"
-      - when "CommentSmile"
-        .pull-left
-          %i.fa.fa-2x.fa-fw.fa-smile-o
-        .media-body
-          .notification--heading
-            %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-            = user_screen_name notification.target.user
-            smiled
-            = link_to "your comment", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.comment.answer.id)
-            = time_tooltip(notification.target)
-            ago
-          .list-group.notification--list
-            .list-group-item
-              .media.question-media
-                .media-body
-                  %h6.notification--list-heading comment
-                  .notification--list-content
-                    = markdown notification.target.comment.content
-      - when "Comment"
-        .pull-left
-          %i.fa.fa-2x.fa-fw.fa-comments
-        .media-body
-          .notification--heading
-            %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
-            = user_screen_name notification.target.user
-            commented on
-            - if notification.target.answer.user == current_user
-              = link_to "your answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-            - elsif notification.target.user == notification.target.answer.user
-              = link_to "their answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-            - else
-              = link_to "#{notification.target.answer.user.screen_name}'s answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
-            = time_tooltip(notification.target)
-            ago
-          .list-group.notification--list
-            .list-group-item
-              .media.question-media
-                .media-body
-                  %h6.notification--list-heading answer
-                  .notification--list-content
-                    = markdown notification.target.answer.content[0..255] + "#{notification.target.answer.content.length > 255 ? '[...]' : ''}"
-            .list-group-item
-              .media.question-media
-                .media-body
-                  %h6.notification--list-heading comment
-                  .notification--list-content
-                    = markdown notification.target.content
diff --git a/app/views/notifications/index.haml b/app/views/notifications/index.haml
index 16947232..11a923af 100644
--- a/app/views/notifications/index.haml
+++ b/app/views/notifications/index.haml
@@ -11,7 +11,9 @@
             No notifications.
     - else
       - @notifications.each do |notification|
-        = render 'notifications/notification', notification: notification
+        %li.list-group-item
+          .media
+            = render "notifications/type/#{notification.target_type.downcase}", notification: notification
 
       = render 'shared/cursored_pagination_dummy', more_data_available: @more_data_available, last_id: @notifications_last_id, permitted_params: %i[type]
 
diff --git a/app/views/notifications/type/_answer.haml b/app/views/notifications/type/_answer.haml
new file mode 100644
index 00000000..ee395f77
--- /dev/null
+++ b/app/views/notifications/type/_answer.haml
@@ -0,0 +1,23 @@
+.pull-left
+  %i.fa.fa-2x.fa-fw.fa-exclamation
+.media-body
+  .notification--heading
+    %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
+    = user_screen_name notification.target.user
+    answered
+    = link_to "your question", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.id)
+    = time_tooltip(notification.target)
+    ago
+  .list-group.notification--list
+    .list-group-item
+      .media.question-media
+        .media-body
+          %h6.notification--list-heading question
+          .notification--list-content
+            = markdown notification.target.question.content[0..60] + "#{notification.target.question.content.length > 60 ? '[...]' : ''}"
+    .list-group-item
+      .media.question-media
+        .media-body
+          %h6.notification--list-heading answer
+          .notification--list-content
+            = markdown notification.target.content[0..60] + "#{notification.target.content.length > 60 ? '[...]' : ''}"
\ No newline at end of file
diff --git a/app/views/notifications/type/_comment.haml b/app/views/notifications/type/_comment.haml
new file mode 100644
index 00000000..6ab20dc1
--- /dev/null
+++ b/app/views/notifications/type/_comment.haml
@@ -0,0 +1,28 @@
+.pull-left
+  %i.fa.fa-2x.fa-fw.fa-comments
+.media-body
+  .notification--heading
+    %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
+    = user_screen_name notification.target.user
+    commented on
+    - if notification.target.answer.user == current_user
+      = link_to "your answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
+    - elsif notification.target.user == notification.target.answer.user
+      = link_to "their answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
+    - else
+      = link_to "#{notification.target.answer.user.screen_name}'s answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
+    = time_tooltip(notification.target)
+    ago
+  .list-group.notification--list
+    .list-group-item
+      .media.question-media
+        .media-body
+          %h6.notification--list-heading answer
+          .notification--list-content
+            = markdown notification.target.answer.content[0..60] + "#{notification.target.answer.content.length > 60 ? '[...]' : ''}"
+    .list-group-item
+      .media.question-media
+        .media-body
+          %h6.notification--list-heading comment
+          .notification--list-content
+            = markdown notification.target.content[0..60] + "#{notification.target.content.length > 60 ? '[...]' : ''}"
\ No newline at end of file
diff --git a/app/views/notifications/type/_commentsmile.haml b/app/views/notifications/type/_commentsmile.haml
new file mode 100644
index 00000000..5c06ce2e
--- /dev/null
+++ b/app/views/notifications/type/_commentsmile.haml
@@ -0,0 +1,17 @@
+.pull-left
+  %i.fa.fa-2x.fa-fw.fa-smile-o
+.media-body
+  .notification--heading
+    %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
+    = user_screen_name notification.target.user
+    smiled
+    = link_to "your comment", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.comment.answer.id)
+    = time_tooltip(notification.target)
+    ago
+  .list-group.notification--list
+    .list-group-item
+      .media.question-media
+        .media-body
+          %h6.notification--list-heading comment
+          .notification--list-content
+            = markdown notification.target.comment.content[0..60] + "#{notification.target.comment.content.length > 60 ? '[...]' : ''}"
\ No newline at end of file
diff --git a/app/views/notifications/type/_relationship.haml b/app/views/notifications/type/_relationship.haml
new file mode 100644
index 00000000..8ee7cde9
--- /dev/null
+++ b/app/views/notifications/type/_relationship.haml
@@ -0,0 +1,7 @@
+.pull-left
+  %img.img-rounded.notification--dropdown-img{src: notification.target.source.profile_picture.url(:small)}
+.media-body
+  %h6.media-heading.notification--dropdown-user
+    = user_screen_name notification.target.source
+  .notification--dropdown-text
+    = raw t('views.notifications.relationship.body', time: time_ago_in_words(notification.target.created_at))
\ No newline at end of file
diff --git a/app/views/notifications/type/_smile.haml b/app/views/notifications/type/_smile.haml
new file mode 100644
index 00000000..01ff40b8
--- /dev/null
+++ b/app/views/notifications/type/_smile.haml
@@ -0,0 +1,17 @@
+.pull-left
+  %i.fa.fa-2x.fa-fw.fa-smile-o
+.media-body
+  .notification--heading
+    %img.notification--img-sm{src: notification.target.user.profile_picture.url(:small)}
+    = user_screen_name notification.target.user
+    smiled
+    = link_to "your answer", show_user_answer_path(username: notification.target.user.screen_name, id: notification.target.answer.id)
+    = time_tooltip(notification.target)
+    ago
+  .list-group.notification--list
+    .list-group-item
+      .media.question-media
+        .media-body
+          %h6.notification--list-heading answer
+          .notification--list-content
+            = markdown notification.target.answer.content[0..60] + "#{notification.target.answer.content.length > 60 ? '[...]' : ''}"
\ No newline at end of file