diff --git a/src/components/partials/Comments.vue b/src/components/partials/Comments.vue
new file mode 100644
index 0000000000000000000000000000000000000000..33472a0064aefb1d1ad21a361d267e4f3793dbf6
--- /dev/null
+++ b/src/components/partials/Comments.vue
@@ -0,0 +1,155 @@
+<template>
+  <div id="placeholder">
+    <div id="comments-container">
+      <h4 class="font-weight-bold">Komentar ({{rows}})</h4>
+      <b-card
+        bg-variant="light"
+        class="item"
+        v-for="comment in lists"
+        :key=comment.id
+      >
+        <div><small class="font-weight-bold">{{comment.name}}</small></div>
+        <b-card-text>{{comment.content}}</b-card-text>
+        <div><small class="text-muted font-italic">{{comment.timestamp}}</small></div>
+      </b-card>
+    </div>
+    <div id="comment-box">
+      <b-pagination
+        v-model="currentPage"
+        :total-rows="rows"
+        :per-page="perPage"
+        align="center"
+      />
+      <div id="comment-section">
+        <b-form-textarea
+          id="textarea"
+          v-model="text"
+          placeholder="Masukkan komentar..."
+          no-resize
+        />
+        <b-button variant="primary">Kirim</b-button>
+      </div>
+      <div>
+        <small class="text-muted font-italic">
+          Dengan mengirim komentar, Anda tunduk terhadap UU ITE yang berlaku.
+        </small>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Comments',
+  components: {
+
+  },
+  data() {
+    return {
+      perPage: 5,
+      currentPage: 1,
+      text: '',
+      items: [
+        {
+          id: 6,
+          userid: 1,
+          name: "David Timothy Panjaitan",
+          content: "Sama",
+          timestamp: "28 Maret 2019, 02.15 WIB"
+        },
+        {
+          id: 5,
+          userid: 1,
+          name: "Rifo Ahmad Genadi",
+          content: "Ngantuk",
+          timestamp: "28 Maret 2019, 02.14 WIB"
+        },
+        {
+          id: 4,
+          userid: 1,
+          name: "Rizky Andyno Ramadhan",
+          content: "Tidur tidur",
+          timestamp: "28 Maret 2019, 02.14 WIB"
+        },
+        {
+          id: 3,
+          userid: 1,
+          name: "William Rukmansa",
+          content: "Ada apa ini?",
+          timestamp: "28 Maret 2019, 00.35 WIB"
+        },
+        {
+          id: 2,
+          userid: 1,
+          name: "David Timothy Panjaitan",
+          content: "Saya masih tidak setuju",
+          timestamp: "28 Maret 2019, 00.31 WIB"
+        },
+        {
+          id: 1,
+          userid: 1,
+          name: "David Timothy Panjaitan",
+          content: "Saya tidak setuju",
+          timestamp: "28 Maret 2019, 00.28 WIB"
+        },
+        {
+          id: 0,
+          userid: 0,
+          name: "Ricky Kennedy",
+          content: "Bagus ini",
+          timestamp: "28 Maret 2019, 00.25 WIB"
+        },
+      ]
+    }
+  },
+  computed: {
+    rows() {
+      return this.items.length
+    },
+    lists() {
+      // Return just page of items needed
+      return this.items.slice(
+        (this.currentPage - 1) * this.perPage,
+        this.currentPage * this.perPage
+      )
+    },
+  },
+  methods: {
+
+  }
+}
+</script>
+
+
+<style lang="scss" scoped>
+@import 'src/assets/css/style.scss';
+
+#placeholder {
+  width: 100%;
+  height: 100%;
+  padding: 20px;
+
+  #comments-container {
+    height: 60%;
+    overflow: auto;
+
+    .item {
+      width: 100%;
+      margin-bottom: 5px;
+      box-shadow: 0 5px 10px rgba(0, 0, 0, 0.25);
+    }
+  }
+
+  #comment-box {
+    height: 30%;
+    margin: 5% 0;
+
+    #comment-section {
+      display: flex;
+    }
+  }
+}
+
+
+
+</style>
\ No newline at end of file