Dev

README.md

@@ -35,6 +35,22 @@ Work on your branch, then open a PR to `dev` for integration/staging. Once valid
 | Dev | `http://services-host.ing.unimore.it:8096` | Unimore network only |
 | Production | `https://reportx.unimore.it` | Public |
 
+## Local development
+
+Build and run the container locally with Docker Compose:
+
+```bash
+docker compose up --build
+```
+
+The site will be available at `http://localhost:8096`. File changes are picked up live via the bind mount — no rebuild needed for HTML/CSS/JS edits.
+
+To stop:
+
+```bash
+docker compose down
+```
+
 ## Deploying
 
 **Do not run `docker compose` manually.** Deploys are fully automated via GitHub Actions.

clinicians.html

@@ -17,12 +17,12 @@
           <a class="brand" href="index.html">ReportX</a>
           <a class="powered-by" href="https://aimagelab.unimore.it/" aria-label="Powered by AI Image Lab">
             <span>Powered by</span>
-            <span class="aimagelab-wordmark" aria-hidden="true"><span class="ai-part">AI</span><span class="mage-part">mage</span><span class="lab-part">Lab</span></span>
+            <img src="assets/logo_full.svg" alt="AImageLab" class="aimagelab-logo">
           </a>
         </div>
         <div class="nav-links">
-          <a href="dataset-release.html">Dataset release</a>
           <a href="clinicians.html">Annotators</a>
+          <a href="#">Protocol</a>
           <button class="share-button" type="button" data-share-button>Share</button>
         </div>
       </nav>
@@ -37,7 +37,7 @@ <h1>One template, three ways in.</h1>
           <div class="landing-links" aria-label="Documentation entry points">
             <a class="landing-card dataset-card" href="dataset-release.html">
               <span class="card-kicker">Dataset</span>
-              <strong>Release template</strong>
+              <strong>Small Dataset Release</strong>
               <span>Field definitions, tumor region legend, and machine/annotator ownership.</span>
             </a>
             <a class="landing-card clinician-card" href="clinicians.html">
@@ -1100,10 +1100,9 @@ <h2>Utilizzo della piattaforma ToothFairy4M</h2>
     </main>
 
     <footer class="footer">
-      <p>ReportX Dataset Template</p>
+      <p>ReportX Dataset</p>
       <div class="footer-links">
-        <a href="mailto:omar.carpentiero@unimore.it?subject=BraTS%20Reports%20website%20feedback">Feedback / issues</a>
-        <a href="#top">Back to top</a>
+        <a href="feedback.html">Feedback / issues</a>
       </div>
     </footer>
     <script src="site.js"></script>

dataset-release.html

@@ -17,12 +17,12 @@
           <a class="brand" href="index.html">ReportX</a>
           <a class="powered-by" href="https://aimagelab.unimore.it/" aria-label="Powered by AI Image Lab">
             <span>Powered by</span>
-            <span class="aimagelab-wordmark" aria-hidden="true"><span class="ai-part">AI</span><span class="mage-part">mage</span><span class="lab-part">Lab</span></span>
+            <img src="assets/logo_full.svg" alt="AImageLab" class="aimagelab-logo">
           </a>
         </div>
         <div class="nav-links">
-          <a href="dataset-release.html">Dataset release</a>
           <a href="clinicians.html">Annotators</a>
+          <a href="#">Protocol</a>
           <button class="share-button" type="button" data-share-button>Share</button>
         </div>
       </nav>
@@ -37,7 +37,7 @@ <h1>One template, three ways in.</h1>
           <div class="landing-links" aria-label="Documentation entry points">
             <a class="landing-card dataset-card" href="dataset-release.html">
               <span class="card-kicker">Dataset</span>
-              <strong>Release template</strong>
+              <strong>Small Dataset Release</strong>
               <span>Field definitions, tumor region legend, and machine/annotator ownership.</span>
             </a>
             <a class="landing-card clinician-card" href="clinicians.html">
@@ -749,10 +749,9 @@ <h2>Utilizzo della piattaforma ToothFairy4M</h2>
     </main>
 
     <footer class="footer">
-      <p>ReportX Dataset Template</p>
+      <p>ReportX Dataset</p>
       <div class="footer-links">
-        <a href="mailto:omar.carpentiero@unimore.it?subject=BraTS%20Reports%20website%20feedback">Feedback / issues</a>
-        <a href="#top">Back to top</a>
+        <a href="feedback.html">Feedback / issues</a>
       </div>
     </footer>
     <script src="site.js"></script>

feedback.html

@@ -0,0 +1,81 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <title>Feedback &amp; Issues — ReportX</title>
+    <link rel="stylesheet" href="styles.css">
+    <style>
+      .feedback-page {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        min-height: calc(100vh - 80px);
+        padding: 48px 24px;
+        text-align: center;
+      }
+      .feedback-page h1 {
+        margin: 0 0 16px;
+        font-size: clamp(1.8rem, 4vw, 2.8rem);
+        color: var(--dark);
+      }
+      .feedback-page p {
+        margin: 0 0 32px;
+        color: var(--muted);
+        font-size: 1.05rem;
+        max-width: 480px;
+      }
+      .feedback-page a.email-link {
+        display: inline-block;
+        padding: 14px 28px;
+        border-radius: 8px;
+        background: var(--primary);
+        color: #ffffff;
+        font-weight: 800;
+        font-size: 1rem;
+        text-decoration: none;
+        box-shadow: 0 16px 36px rgba(37, 99, 235, 0.2);
+        transition: transform 160ms ease, box-shadow 160ms ease;
+      }
+      .feedback-page a.email-link:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 20px 44px rgba(37, 99, 235, 0.28);
+      }
+    </style>
+  </head>
+  <body>
+    <header class="site-header">
+      <nav class="topbar" aria-label="Primary navigation">
+        <div class="brand-lockup">
+          <a class="brand" href="index.html" aria-label="ReportX home">
+            <span class="brand-name">ReportX</span>
+          </a>
+        </div>
+        <div class="nav-links">
+          <a href="clinicians.html">Annotators</a>
+          <a href="#">Protocol</a>
+          <button class="share-button" type="button" data-share-button>Share</button>
+        </div>
+      </nav>
+    </header>
+
+    <main>
+      <div class="feedback-page">
+        <h1>Feedback &amp; Issues</h1>
+        <p>For any feedback, bug reports, or questions about ReportX, please reach out by email.</p>
+        <a class="email-link" href="mailto:omar.carpentiero@unimore.it?subject=ReportX%20feedback">
+          omar.carpentiero@unimore.it
+        </a>
+      </div>
+    </main>
+
+    <footer class="footer">
+      <p>ReportX Dataset</p>
+      <div class="footer-links">
+        <a href="feedback.html">Feedback / issues</a>
+      </div>
+    </footer>
+    <script src="site.js"></script>
+  </body>
+</html>

index.html

@@ -17,12 +17,12 @@
           <a class="brand" href="index.html">ReportX</a>
           <a class="powered-by" href="https://aimagelab.unimore.it/" aria-label="Powered by AI Image Lab">
             <span>Powered by</span>
-            <span class="aimagelab-wordmark" aria-hidden="true"><span class="ai-part">AI</span><span class="mage-part">mage</span><span class="lab-part">Lab</span></span>
+            <img src="assets/logo_full.svg" alt="AImageLab" class="aimagelab-logo">
           </a>
         </div>
         <div class="nav-links">
-          <a href="dataset-release.html">Dataset release</a>
           <a href="clinicians.html">Annotators</a>
+          <a href="#">Protocol</a>
           <button class="share-button" type="button" data-share-button>Share</button>
         </div>
       </nav>
@@ -36,16 +36,16 @@ <h1>ReportX</h1>
             annotation, machine-readable findings, and clear dataset documentation.
           </p>
             <div class="landing-links" aria-label="Documentation entry points">
-              <a class="landing-card dataset-card" href="dataset-release.html">
-                <span class="card-kicker">Dataset</span>
-                <strong>Release template</strong>
-                <span>Field definitions, tumor region legend, and machine/annotator ownership.</span>
-              </a>
               <a class="landing-card clinician-card" href="clinicians.html">
                 <span class="card-kicker">Annotators</span>
                 <strong>Annotator guide</strong>
                 <span>Annotation protocol, annotation fields, examples, and language selector.</span>
               </a>
+              <a class="landing-card protocol-card" href="#">
+                <span class="card-kicker">Protocol</span>
+                <strong>Experimental Protocol</strong>
+                <span>Study design, acquisition parameters, and experimental setup.</span>
+              </a>
             </div>
             <a class="join-button" href="join.html">Join the project</a>
           </div>
@@ -752,10 +752,9 @@ <h2>Utilizzo della piattaforma ToothFairy4M</h2>
     </main>
 
     <footer class="footer">
-      <p>ReportX Dataset Template</p>
+      <p>ReportX Dataset</p>
       <div class="footer-links">
-        <a href="mailto:omar.carpentiero@unimore.it?subject=BraTS%20Reports%20website%20feedback">Feedback / issues</a>
-        <a href="#top">Back to top</a>
+        <a href="feedback.html">Feedback / issues</a>
       </div>
     </footer>
     <script src="site.js"></script>

join.html

@@ -17,12 +17,12 @@
           <a class="brand" href="index.html">ReportX</a>
           <a class="powered-by" href="https://aimagelab.unimore.it/" aria-label="Powered by AI Image Lab">
             <span>Powered by</span>
-            <span class="aimagelab-wordmark" aria-hidden="true"><span class="ai-part">AI</span><span class="mage-part">mage</span><span class="lab-part">Lab</span></span>
+            <img src="assets/logo_full.svg" alt="AImageLab" class="aimagelab-logo">
           </a>
         </div>
         <div class="nav-links">
-          <a href="dataset-release.html">Dataset release</a>
           <a href="clinicians.html">Annotators</a>
+          <a href="#">Protocol</a>
           <button class="share-button" type="button" data-share-button>Share</button>
         </div>
       </nav>
@@ -45,9 +45,9 @@ <h1>We are still recruiting.</h1>
     </main>
 
     <footer class="footer">
-      <p>ReportX Dataset Template</p>
+      <p>ReportX Dataset</p>
       <div class="footer-links">
-        <a href="mailto:omar.carpentiero@unimore.it?subject=BraTS%20Reports%20website%20feedback">Feedback / issues</a>
+        <a href="feedback.html">Feedback / issues</a>
         <a href="index.html">Back home</a>
       </div>
     </footer>

styles.css

@@ -1,14 +1,16 @@
+@import url('https://rsms.me/inter/inter.css');
+
 :root {
   --primary: #2563eb;
-  --dark: #374d81;
-  --aimagelab-red: #a50021;
+  --dark: #0f1e3d;
+  --aimagelab-red: #f04e22;
   --muted: #6b7280;
-  --light: #f3f4f6;
+  --light: #eff4ff;
   --paper: #ffffff;
-  --ink: #172033;
-  --clinician: #fac898;
-  --machine: #c1e1c1;
-  --line: #d8deea;
+  --ink: #0f1e3d;
+  --clinician: #fcd5b5;
+  --machine: #c8e6c9;
+  --line: #dbe4f5;
   --ed: #ef4444;
   --netc: #22c55e;
   --et: #2563eb;
@@ -24,9 +26,11 @@ html {
 
 body {
   margin: 0;
+  padding-bottom: 80px;
   color: var(--ink);
   background: var(--paper);
-  font-family: Arial, Helvetica, sans-serif;
+  font-family: "Inter", Arial, Helvetica, sans-serif;
+  font-feature-settings: 'liga' 1, 'calt' 1, 'ss04' 1;
   line-height: 1.55;
 }
 
@@ -35,7 +39,7 @@ a {
 }
 
 .site-header {
-  background: linear-gradient(135deg, #eef4ff 0%, #ffffff 55%, #eef8f1 100%);
+  background: linear-gradient(135deg, #eef4ff 0%, #ffffff 55%, #eef4ff 100%);
   border-bottom: 1px solid var(--line);
 }
 
@@ -109,8 +113,8 @@ a {
   display: grid;
   align-items: center;
   justify-items: center;
-  min-height: calc(100vh - 64px);
-  padding: clamp(56px, 9vw, 112px) clamp(20px, 5vw, 72px);
+  min-height: auto;
+  padding: clamp(32px, 5vw, 64px) clamp(20px, 5vw, 72px);
 }
 
 .hero-content {
@@ -247,6 +251,10 @@ h3 {
   background: var(--machine);
 }
 
+.protocol-card .card-kicker {
+  background: #bfdbfe;
+}
+
 .powered-by {
   display: flex;
   align-items: center;
@@ -276,11 +284,17 @@ h3 {
   white-space: nowrap;
 }
 
+.aimagelab-logo {
+  height: clamp(1.35rem, 1.95vw, 1.8rem);
+  width: auto;
+  display: block;
+}
+
 .aimagelab-wordmark {
   display: inline-flex;
   align-items: center;
   color: #1f2937;
-  font-family: Arial, Helvetica, sans-serif;
+  font-family: "Inter", Arial, Helvetica, sans-serif;
   font-size: clamp(1.35rem, 1.95vw, 1.8rem);
   font-weight: 800;
   letter-spacing: 0;
@@ -821,6 +835,11 @@ figcaption {
 }
 
 .footer {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 100;
   display: flex;
   justify-content: space-between;
   gap: 20px;