diff --git a/frontend/src/components/ObservationEntry.vue b/frontend/src/components/ObservationEntry.vue
new file mode 100644
index 0000000..c786e92
--- /dev/null
+++ b/frontend/src/components/ObservationEntry.vue
@@ -0,0 +1,48 @@
+<template>
+  <b-col cols="6">
+    <b-row>
+      <b-col cols="3">
+        <p>{{ description }}</p>
+        <h4 v-bind:class="{ scorewarn: scenariofundamental.rating < 3 }">{{ scenariofundamental.rating }}</h4>
+      </b-col>
+      <b-col cols="9">
+        <b-form-textarea
+          :value="scenariofundamental.strengths"
+          placeholder="-"
+          :rows="1"
+          :max-rows="2"
+          no-resize
+          class="strength"
+          readonly
+        ></b-form-textarea>
+        <b-form-textarea
+          :value="scenariofundamental.improvements"
+          placeholder="-"
+          :rows="1"
+          :max-rows="2"
+          no-resize
+          class="afi"
+          readonly
+        ></b-form-textarea>
+      </b-col>
+    </b-row>
+  </b-col>
+</template>
+
+<script>
+export default {
+  props: ["scenariofundamental", "description"]
+};
+</script>
+
+<style scoped>
+.strength {
+  background-color: honeydew;
+}
+.afi {
+  background-color: mistyrose;
+}
+.scorewarn {
+  color: red;
+}
+</style>