feat: feat: images sizes and blockquote styles

Author: vladislavkeblysh

src/App.scss

@@ -49,7 +49,22 @@ $input-focus-box-shadow: $input-box-shadow; // hack to get upgrade to paragon 4.
       right: 1rem !important;
     }
   }
+
   .confirm-modal .pgn__modal-body {
     overflow: hidden;
   }
+
+  .pgn__modal-body-content {
+    & img {
+      object-fit: contain;
+      max-width: 100%;
+      height: auto;
+    }
+
+    & blockquote > p {
+      border-left: 2px solid $gray-200;
+      margin-left: 1.5rem;
+      padding-left: 1rem;
+    }
+  }
 }

src/containers/ResponseDisplay/index.jsx

@@ -11,6 +11,7 @@ import parse from 'html-react-parser';
 import { selectors } from 'data/redux';
 import { fileUploadResponseOptions } from 'data/services/lms/constants';
 
+import { getConfig } from '@edx/frontend-platform';
 import SubmissionFiles from './SubmissionFiles';
 import PreviewDisplay from './PreviewDisplay';
 
@@ -26,7 +27,13 @@ export class ResponseDisplay extends React.Component {
   }
 
   get textContents() {
-    return this.props.response.text.map(text => parse(this.purify.sanitize(text)));
+    const { text } = this.props.response;
+
+    const formattedText = text
+      .map((item) => item.replaceAll(/\.\.\/asset/g, `${getConfig().LMS_BASE_URL}/asset`))
+      .map((item) => parse(this.purify.sanitize(item)));
+
+    return formattedText;
   }
 
   get submittedFiles() {