diff --git a/frontend/src/store/modules/submission-notes.ts b/frontend/src/store/modules/submission-notes.ts
index 96688676fc644d0559edda5c014beff1f79057ce..9f7286bef81fbc611ed82b939b4f240f7344bae7 100644
--- a/frontend/src/store/modules/submission-notes.ts
+++ b/frontend/src/store/modules/submission-notes.ts
@@ -4,6 +4,7 @@ import * as api from '@/api'
 import { Feedback, FeedbackComment, SubmissionNoType } from '@/models'
 import { RootState } from '@/store/store'
 import { getStoreBuilder, BareActionContext } from 'vuex-typex'
+import { syntaxPostProcess } from '@/util/helpers';
 
 export interface SubmissionNotesState {
   submission: SubmissionNoType
@@ -63,15 +64,12 @@ const submissionGetter = mb.read(function submission (state, getters) {
     ? getters.submissionType.programmingLanguage
     : 'c'
   const highlighted = hljs.highlight(language, state.submission.text || '', true).value
-  
-  let commentFlag = false
-  return highlighted.split('\n').reduce((acc: {[k: number]: string}, cur, index) => {
-    if (cur.includes("/*")) commentFlag = true
-    cur = commentFlag ? '<span class="hljs-comment">' + cur + '</span>' : cur
-    if (cur.includes("*/")) commentFlag = false // so that the ending line will also be greyed out
+  const postProcessed = syntaxPostProcess(highlighted);
+  const splitted = postProcessed.split('\n').reduce((acc: {[k: number]: string}, cur, index) => {
     acc[index + 1] = cur
     return acc
   }, {})
+  return splitted;
 })
 const scoreGetter = mb.read(function score (state) {
   return state.updatedFeedback.score !== undefined ? state.updatedFeedback.score : state.origFeedback.score
diff --git a/frontend/src/util/helpers.ts b/frontend/src/util/helpers.ts
index 07e06414dc4e52958ad4bae819255b23b2585f9a..8b55485f18d516ccee2c995635e7da2242fc26ce 100644
--- a/frontend/src/util/helpers.ts
+++ b/frontend/src/util/helpers.ts
@@ -124,3 +124,18 @@ export function once (fn: Function, context?: object): OnceFunc {
   wrapped.reset = function () { result = undefined }
   return wrapped
 }
+
+export function syntaxPostProcess (code: string): string {
+  const spanPrefix = '<span class="hljs-comment">'
+  const spanSuffix = '</span>'
+  
+  code = code.replace(/(<span class="hljs-comment">)([\s\S]*?)(<\/span>)/gim, (match, p1, p2, p3) => {
+    const splitted = p2.split(/\n/)
+    for (let i = 0; i < splitted.length; i++) {
+      splitted[i] = spanPrefix + splitted[i] + spanSuffix
+    }
+    
+    return splitted.join("\n")
+  })
+  return code
+}