src/pages/NewsDetail.jsx

@@ -3,13 +3,6 @@ import { useParams, Link } from 'react-router-dom';
 import { wpApi } from '../api/wordpress';
 
 
-// Helper to handle raw markdown formatting if present
-const formatContent = (htmlContent) => {
-    if (!htmlContent) return '';
-    // Replace **text** with <strong>text</strong> (Basic bold support)
-    return htmlContent.replace(/\*\*(.*?)\*\*/g, '<strong>$1</strong>');
-};
-
 const NewsDetail = () => {
     const { slug } = useParams();
     const [post, setPost] = useState(null);
@@ -88,7 +81,7 @@ const NewsDetail = () => {
                 {/* Content */}
                 <div
                     className="article-content"
-                    dangerouslySetInnerHTML={{ __html: formatContent(post.content.rendered) }}
+                    dangerouslySetInnerHTML={{ __html: post.content.rendered }}
                 />
 
                 {/* Footer / Navigation */}

src/styles/main.css

@@ -67,6 +67,7 @@ img {
     -khtml-user-drag: none;
     -moz-user-drag: none;
     -o-user-drag: none;
+    user-drag: none;
     pointer-events: none;
     /* Prevents right-click context menu on images */
 }
@@ -1326,7 +1327,7 @@ img {
 
 .news-article {
     background-color: var(--white);
-    max-width: 1200px;
+    max-width: 800px;
     width: 100%;
     margin: 0 20px;
     padding: 3rem;
@@ -1373,16 +1374,6 @@ img {
     border-radius: 0.75rem;
     overflow: hidden;
     box-shadow: var(--shadow);
-    display: flex;
-    justify-content: center;
-    background-color: var(--light-gray);
-    /* Optional: background for transparent images */
-}
-
-.article-image {
-    max-width: 100%;
-    height: auto;
-    object-fit: contain;
 }
 
 /* ... NewsDetail content styles ... */
@@ -1482,138 +1473,4 @@ img {
     border-color: var(--primary-color);
     transform: translateY(-2px);
     box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
-}
-
-/* =========================================
-   6. ARTICLE CONTENT STYLES (WordPress)
-   ========================================= */
-.article-content {
-    line-height: 1.8;
-    color: var(--text-color);
-    font-size: 1.05rem;
-}
-
-.article-content p {
-    margin-bottom: 1.5rem;
-}
-
-.article-content h1,
-.article-content h2,
-.article-content h3,
-.article-content h4,
-.article-content h5,
-.article-content h6 {
-    margin-top: 2.5rem;
-    margin-bottom: 1rem;
-    font-weight: 700;
-    line-height: 1.3;
-    color: var(--text-color);
-}
-
-.article-content h1 {
-    font-size: 2rem;
-}
-
-.article-content h2 {
-    font-size: 1.75rem;
-    border-bottom: 2px solid var(--border-color);
-    padding-bottom: 0.5rem;
-}
-
-.article-content h3 {
-    font-size: 1.5rem;
-}
-
-.article-content h4 {
-    font-size: 1.25rem;
-}
-
-.article-content h5 {
-    font-size: 1.1rem;
-}
-
-.article-content h6 {
-    font-size: 1rem;
-}
-
-.article-content ul,
-.article-content ol {
-    margin-bottom: 1.5rem;
-    padding-left: 1.5rem;
-}
-
-.article-content ul {
-    list-style-type: disc;
-}
-
-.article-content ol {
-    list-style-type: decimal;
-}
-
-.article-content li {
-    margin-bottom: 0.5rem;
-}
-
-.article-content strong,
-.article-content b {
-    font-weight: 700;
-    color: #0f172a;
-}
-
-.article-content a {
-    color: var(--primary-color);
-    text-decoration: underline;
-}
-
-.article-content img {
-    max-width: 100%;
-    height: auto;
-    border-radius: 8px;
-    margin: 2rem 0;
-    box-shadow: var(--shadow);
-}
-
-.article-content blockquote {
-    border-left: 4px solid var(--primary-color);
-    padding: 1rem;
-    margin: 1.5rem 0;
-    background-color: var(--light-gray);
-    border-radius: 0 8px 8px 0;
-    font-style: italic;
-}
-
-/* Helper Classes for Alignments */
-.article-content .aligncenter {
-    display: block;
-    margin: 0 auto 2rem;
-    text-align: center;
-}
-
-.article-content .alignright {
-    float: right;
-    margin-left: 1.5rem;
-    margin-bottom: 1.5rem;
-}
-
-.article-content .alignleft {
-    float: left;
-    margin-right: 1.5rem;
-    margin-bottom: 1.5rem;
-}
-
-/* Gutenberg Text Alignment */
-.article-content .has-text-align-center {
-    text-align: center;
-}
-
-.article-content .has-text-align-right {
-    text-align: right;
-}
-
-.article-content .has-text-align-left {
-    text-align: left;
-}
-
-.article-content .has-text-align-justify {
-    text-align: justify;
 }