diff --git a/client/src/components/school-class/ClassSelectionWidget.vue b/client/src/components/school-class/ClassSelectionWidget.vue
index e5786d16..f4415289 100644
--- a/client/src/components/school-class/ClassSelectionWidget.vue
+++ b/client/src/components/school-class/ClassSelectionWidget.vue
@@ -50,7 +50,7 @@
   import CurrentClass from '@/components/school-class/CurrentClass';
   import AddIcon from '@/components/icons/AddIcon';
 
-  import updateSelectedClassMixin from '@/mixins/updateSelectedClass';
+  import updateSelectedClassMixin from '@/mixins/update-selected-class';
   import sidebarMixin from '@/mixins/sidebar';
   import meMixin from '@/mixins/me';
 
diff --git a/client/src/helpers/survey-solutions.js b/client/src/helpers/survey-solutions.js
index 60761b6b..3e2b82ae 100644
--- a/client/src/helpers/survey-solutions.js
+++ b/client/src/helpers/survey-solutions.js
@@ -11,11 +11,9 @@ const extractAnswerFromQuestion = (previous, question) => {
       return text;
     }); // get the keys as they appear in the question, without punctuation at the end
 
-    const answers = keys.map(key => `${key}: ${correctAnswer[key]}`);
-
-    answer = answers.join('\n');
+    answer = keys.map(key => `${key}: ${correctAnswer[key]}`); // return an array, it gets converted to a string further up
   }
-  return [...previous, {title: question.title, answer}];
+  return [...previous, {title: question.title, answer, type: question.getType()}];
 };
 
 export const extractSurveySolutions = (prev, element) => {
diff --git a/client/src/mixins/updateSelectedClass.js b/client/src/mixins/update-selected-class.js
similarity index 100%
rename from client/src/mixins/updateSelectedClass.js
rename to client/src/mixins/update-selected-class.js
diff --git a/client/src/pages/oldClasses.vue b/client/src/pages/oldClasses.vue
index 801adb2c..2ab75896 100644
--- a/client/src/pages/oldClasses.vue
+++ b/client/src/pages/oldClasses.vue
@@ -18,7 +18,7 @@
 <script>
   import OLD_CLASSES_QUERY from '@/graphql/gql/oldClasses.gql';
 
-  import updateSelectedClassMixin from '@/mixins/updateSelectedClass';
+  import updateSelectedClassMixin from '@/mixins/update-selected-class';
 
   export default {
     mixins: [updateSelectedClassMixin],
diff --git a/client/src/pages/survey.vue b/client/src/pages/survey.vue
index 43b63963..8889bc6c 100644
--- a/client/src/pages/survey.vue
+++ b/client/src/pages/survey.vue
@@ -15,196 +15,206 @@
 </template>
 
 <script>
-  import * as SurveyVue from 'survey-vue';
-  import {css} from '@/survey.config';
+import * as SurveyVue from 'survey-vue';
+import {css} from '@/survey.config';
 
-  import SURVEY_QUERY from '@/graphql/gql/surveyQuery.gql';
-  import MODULE_QUERY from '@/graphql/gql/moduleByIdQuery.gql';
-  import UPDATE_ANSWER from '@/graphql/gql/mutations/updateAnswer.gql';
-  import Solution from '@/components/content-blocks/Solution';
+import SURVEY_QUERY from '@/graphql/gql/surveyQuery.gql';
+import MODULE_QUERY from '@/graphql/gql/moduleByIdQuery.gql';
+import UPDATE_ANSWER from '@/graphql/gql/mutations/updateAnswer.gql';
+import Solution from '@/components/content-blocks/Solution';
 
-  import {extractSurveySolutions} from '@/helpers/survey-solutions';
-  import {isTeacher} from '@/helpers/is-teacher';
+import {extractSurveySolutions} from '@/helpers/survey-solutions';
+import {isTeacher} from '@/helpers/is-teacher';
 
-  import {meQuery} from '@/graphql/queries';
+import {meQuery} from '@/graphql/queries';
 
-  const Survey = SurveyVue.Survey;
+const Survey = SurveyVue.Survey;
 
-  export default {
-    props: ['id'],
+export default {
+  props: ['id'],
 
-    components: {
-      Solution,
-      Survey
+  components: {
+    Solution,
+    Survey
+  },
+
+  data() {
+    return {
+      survey: this.initSurvey(),
+      title: '',
+      module: {},
+      completed: false,
+      me: {
+        permissions: []
+      },
+    };
+  },
+
+  computed: {
+    surveyComplete() {
+      return this.survey && this.survey.isCompleted;
     },
-
-    data() {
+    showSolution() {
+      return (module.solutionsEnabled || isTeacher) && !this.survey.isCompleted;
+    },
+    solution() {
+      // todo: should this be done inside of Solution.vue?
       return {
-        survey: this.initSurvey(),
-        title: '',
-        module: {},
-        completed: false,
-        me: {
-          permissions: []
-        },
-      };
-    },
-
-    computed: {
-      surveyComplete() {
-        return this.survey && this.survey.isCompleted;
-      },
-      showSolution() {
-        return (module.solutionsEnabled || isTeacher) && !this.survey.isCompleted;
-      },
-      solution() {
-        return {
-          text: this.answers.reduce((previous, answer) => {
-            if (!answer.answer) {
-              return previous;
-            }
-            const answerText = answer.answer.replace(/\n/g, '<br>'); // replace all newlines with line breaks
+        text: this.answers.reduce((previous, answer) => {
+          if (!answer.answer) {
+            return previous;
+          }
+          if (answer.type === 'matrix') {
+            // wrap all the answers inside li tags and convert to a single string
+            const answerText = answer.answer.map(a => `<li class="solution-text__list-item">${a}</li>`).join('');
+            return `
+            ${previous}
+            <h2 class="solution-text__heading">${answer.title}</h2>
+            <ul class="solution-text__answer solution-text__list">${answerText}</ul>
+            `;
+          } else {
             return `
             ${previous}
              <h2 class="solution-text__heading">${answer.title}</h2>
-             <p class="solution-text__answer">${answerText}</p>
+             <p class="solution-text__answer">${answer.answer}</p>
              `;
-          }, '')
-        };
-      },
-      answers() {
-        return this.survey.currentPage && this.survey.currentPage.elements
-          ? this.survey.currentPage.elements.reduce(extractSurveySolutions, [])
-          : [];
-      },
-      isTeacher() {
-        return isTeacher(this);
-      }
+          }
+        }, '')
+      };
     },
+    answers() {
+      return this.survey.currentPage && this.survey.currentPage.elements
+        ? this.survey.currentPage.elements.reduce(extractSurveySolutions, [])
+        : [];
+    },
+    isTeacher() {
+      return isTeacher(this);
+    }
+  },
 
-    methods: {
-      initSurvey(data, answers) {
-        let survey = new SurveyVue.Model(data);
-        const flatAnswers = {};
-        for (let k in answers) {
-          flatAnswers[k] = answers[k].answer;
+  methods: {
+    initSurvey(data, answers) {
+      let survey = new SurveyVue.Model(data);
+      const flatAnswers = {};
+      for (let k in answers) {
+        flatAnswers[k] = answers[k].answer;
+      }
+      survey.data = flatAnswers;
+
+      const saveSurvey = (sender, options) => {
+        // sender.clear(false);
+        //
+        // sender.mode = 'display';
+
+        this.completed = true;
+
+        const data = {};
+
+        for (let k in survey.data) {
+          if (survey.data.hasOwnProperty(k)) {
+            let question = sender.getQuestionByName(k);
+            data[k] = {
+              answer: survey.data[k],
+              correct: question && question.correctAnswer ? question.correctAnswer : ''
+            };
+          }
         }
-        survey.data = flatAnswers;
 
-        const saveSurvey = (sender, options) => {
-          // sender.clear(false);
-          //
-          // sender.mode = 'display';
-
-          this.completed = true;
-
-          const data = {};
-
-          for (let k in survey.data) {
-            if (survey.data.hasOwnProperty(k)) {
-              let question = sender.getQuestionByName(k);
-              data[k] = {
-                answer: survey.data[k],
-                correct: question && question.correctAnswer ? question.correctAnswer : ''
-              };
+        this.$apollo.mutate({
+          mutation: UPDATE_ANSWER,
+          variables: {
+            input: {
+              answer: {
+                surveyId: this.id,
+                data: JSON.stringify(data)
+              }
+            }
+          },
+          // fixme: make the update work instead of refetching
+          update: (store, {data: {updateAnswer: {answer}}}) => {
+            const query = SURVEY_QUERY;
+            const variables = {id: this.id};
+            const queryData = store.readQuery({query, variables});
+            if (queryData.survey) {
+              queryData.survey.answer = answer;
+              store.writeQuery({query, variables, data: queryData});
             }
           }
+        });
+      };
 
-          this.$apollo.mutate({
-            mutation: UPDATE_ANSWER,
+      survey.onComplete.add(saveSurvey);
+      survey.onCurrentPageChanged.add(saveSurvey);
+
+      survey.css = css;
+      survey.locale = 'de';
+      survey.showProgressBar = 'bottom';
+      survey.pageNextText = 'Speichern & Weiter';
+      return survey;
+    },
+    reopen() {
+      this.completed = false;
+      let data = this.survey.data; // save the data
+      this.survey.clear();
+      this.survey.data = data; // reapply it
+    }
+  },
+
+  apollo: {
+    survey: {
+      query: SURVEY_QUERY,
+      variables() {
+        return {
+          id: this.id
+        };
+      },
+      manual: true,
+      result({data, loading, networkStatus}) {
+        if (!loading) {
+          let json = JSON.parse(data.survey.data);
+          json.showTitle = false;
+          let answer = {};
+          if (data.survey.answer && data.survey.answer.data) {
+            answer = JSON.parse(data.survey.answer.data);
+          }
+
+          if (!this.completed) {
+            this.survey = this.initSurvey(json, answer);
+          }
+          this.title = json.title;
+          const module = data.survey.module;
+
+          this.$apollo.addSmartQuery('module', {
+            query: MODULE_QUERY,
             variables: {
-              input: {
-                answer: {
-                  surveyId: this.id,
-                  data: JSON.stringify(data)
-                }
-              }
-            },
-            // fixme: make the update work instead of refetching
-            update: (store, {data: {updateAnswer: {answer}}}) => {
-              const query = SURVEY_QUERY;
-              const variables = {id: this.id};
-              const queryData = store.readQuery({query, variables});
-              if (queryData.survey) {
-                queryData.survey.answer = answer;
-                store.writeQuery({query, variables, data: queryData});
-              }
+              id: module.id
             }
           });
-        };
-
-        survey.onComplete.add(saveSurvey);
-        survey.onCurrentPageChanged.add(saveSurvey);
-
-        survey.css = css;
-        survey.locale = 'de';
-        survey.showProgressBar = 'bottom';
-        survey.pageNextText = 'Speichern & Weiter';
-        return survey;
+        }
       },
-      reopen() {
-        this.completed = false;
-        let data = this.survey.data; // save the data
-        this.survey.clear();
-        this.survey.data = data; // reapply it
-      }
     },
-
-    apollo: {
-      survey: {
-        query: SURVEY_QUERY,
-        variables() {
-          return {
-            id: this.id
-          };
-        },
-        manual: true,
-        result({data, loading, networkStatus}) {
-          if (!loading) {
-            let json = JSON.parse(data.survey.data);
-            json.showTitle = false;
-            let answer = {};
-            if (data.survey.answer && data.survey.answer.data) {
-              answer = JSON.parse(data.survey.answer.data);
-            }
-
-            if (!this.completed) {
-              this.survey = this.initSurvey(json, answer);
-            }
-            this.title = json.title;
-            const module = data.survey.module;
-
-            this.$apollo.addSmartQuery('module', {
-              query: MODULE_QUERY,
-              variables: {
-                id: module.id
-              }
-            });
-          }
-        },
-      },
-      me: meQuery
-    }
-  };
+    me: meQuery
+  }
+};
 </script>
 
 <style scoped lang="scss">
-  @import "@/styles/_variables.scss";
-  @import "@/styles/_mixins.scss";
+@import "@/styles/_variables.scss";
+@import "@/styles/_mixins.scss";
 
-  .survey-page {
-    max-width: 800px;
-    display: grid;
-    grid-template-rows: auto 1fr;
-    grid-auto-rows: auto;
-    grid-row-gap: $large-spacing;
-    justify-self: center;
-    padding: 100px 0;
-    width: 100%;
+.survey-page {
+  max-width: 800px;
+  display: grid;
+  grid-template-rows: auto 1fr;
+  grid-auto-rows: auto;
+  grid-row-gap: $large-spacing;
+  justify-self: center;
+  padding: 100px 0;
+  width: 100%;
 
-    &__title {
-      @include meta-title;
-      margin: 0;
-    }
+  &__title {
+    @include meta-title;
+    margin: 0;
   }
+}
 </style>
diff --git a/client/src/styles/_solutions.scss b/client/src/styles/_solutions.scss
index ae034f0c..84a5ed6e 100644
--- a/client/src/styles/_solutions.scss
+++ b/client/src/styles/_solutions.scss
@@ -8,4 +8,14 @@
     @include regular-text;
     margin-bottom: $medium-spacing;
   }
+
+  &__list {
+    list-style: disc;
+    padding-left: $medium-spacing;
+  }
+
+  &__list-item {
+    @include inline-title;
+    margin-bottom: $medium-spacing;
+  }
 }