Merge pull request #4784 from OneCommunityGlobal/harshavarma_show_summaries_raw_html

Harshavarma - Fix: Show Summaries Raw HTML

Author: one-community

src/components/Collaboration/Collaboration.jsx

@@ -113,6 +113,40 @@ function Collaboration() {
     }
   };
 
+  /* ================= SUMMARIES VIEW ================= */
+  if (summaries) {
+    return (
+      <div className={`${styles.jobLanding} ${darkMode ? styles.dark : ''}`}>
+        <div className={styles.jobHeader}>
+          <a href="https://www.onecommunityglobal.org/collaboration/">
+            <img src={OneCommunityImage} alt="One Community Logo" />
+          </a>
+        </div>
+
+        <div className={`${styles.userCollaborationContainer} ${darkMode ? styles.dark : ''}`}>
+          <h2>Job Summaries</h2>
+
+          {summaries.jobs?.length ? (
+            summaries.jobs.map(job => (
+              <div key={job._id} className="job-summary-item">
+                <h4>
+                  <a href={job.jobDetailsLink}>{job.title}</a>
+                </h4>
+                <p>{job.description}</p>
+              </div>
+            ))
+          ) : (
+            <p>No summaries found.</p>
+          )}
+
+          <button className="btn btn-secondary" onClick={() => setSummaries(null)}>
+            ← Back to Job Listings
+          </button>
+        </div>
+      </div>
+    );
+  }
+
   /* ================= MAIN VIEW ================= */
   return (
     <div className={`${styles.jobLanding} ${darkMode ? styles.dark : ''}`}>

src/components/Collaboration/Collaboration.module.css

@@ -283,6 +283,15 @@
    MODAL
    ====================================================== */
 
+.dark {
+  background-color: #1b2a41;
+  color: #f1f1f1;
+}
+
+.dark .userCollaborationContainer {
+  background-color: #1b2a41;
+}
+
 .modalOverlay {
   position: fixed;
   inset: 0;
@@ -305,9 +314,13 @@
 
 /* ================= DARK MODE – MODAL ================= */
 
-.dark .modal {
-  background-color: #020617;
-  color: #e5e7eb;
+.dark .jobAd {
+  background: linear-gradient(135deg, #23272a, #181a1b);
+  border-color: #333;
+}
+
+.dark .jobAd h3 {
+  color: #e0e0e0;
 }
 
 /* ======================================================