Render line breaks in post content

client/src/App.css

@@ -0,0 +1,3 @@
+.post-content {
+  white-space: pre-line;
+}

client/src/App.jsx

@@ -15,6 +15,8 @@ import Stack from 'react-bootstrap/Stack';
 import Modal from 'react-bootstrap/Modal';
 import Form from 'react-bootstrap/Form';
 
+import './App.css';
+
 import useList from './utils/List';
 import { getContractByChainId, getContractNameByAddress } from './utils/contract-config';
 import Web3Context from './contexts/Web3Context';
@@ -324,7 +326,9 @@ function App() {
           <Modal.Title>View Post</Modal.Title>
         </Modal.Header>
         <Modal.Body>
-          {viewPostContent}
+          <p className="post-content">
+            {viewPostContent}
+          </p>
         </Modal.Body>
         <Modal.Footer>
           <Button variant="secondary" onClick={handleCloseViewPost}>