graph & timeline

src/components/Graph.tsx

@@ -10,7 +10,8 @@ const backgroundcolorscale = [
           'rgba(244, 204, 30, 0.2)',
           'rgba(130, 149, 164, 0.2)',
           'rgba(0, 101, 48, 0.2)',
-          'rbga(184, 91, 209, 0.2)'
+          'rbga(184, 91, 209, 0.2)',
+          'rbga(50, 35, 44, 0.2'
 ]
 
 
@@ -22,7 +23,8 @@ const bordercolorscale = [
               'rgba(244, 204, 30, 1)',
               'rgba(130, 149, 164, 1)',
               'rgba(0, 101, 48, 1)',
-              'rbga(184, 91, 209, 1)'
+              'rbga(184, 91, 209, 1)',
+              'rbga(50, 35, 44, 1'
 ]
  
 ChartJS.register(ArcElement, Tooltip, Legend, CategoryScale,
@@ -208,6 +210,7 @@ export const HowOftenTreatmentatients: React.FC = () => {
       labels,
       datasets: [
         {
+          label: "",
           data: [
               6.49,
               6.49,

src/components/Tabs.tsx

@@ -40,6 +40,12 @@ import Collapsible from "./Collapsible";
         problem = true;
         problem_desc.push("interview language"); 
       }
+      
+      /* Expert on  */
+      let expert = ""; 
+      if (data[i].experton) {
+        expert = `Expert on ${data[i].experton}`; 
+      }
 
       /* Aim/Goal */
       var goalheading: string = ""; 
@@ -152,14 +158,15 @@ import Collapsible from "./Collapsible";
                   <div className="row">
                     <div className="col-6">
                       <div className={"t-tag " + data[i].tag}>
-                          {data[i].job}
+                          {data[i].job} {data[i].affiliation}
                       </div>
                     </div>
-                    <div className="col-3">{lang}</div>
+                    <div className="col" style={{padding: "5px"}}>{expert}</div>
+                    <div className="col" style={{width: "20%", flex: "1 0 0%", padding: "5px"}}>{lang}</div>
                   </div>
                   <div className="row">
                     <div className="col">
-                      <BlockQuoteB text={data[i].quote} cite={quoted}></BlockQuoteB>
+
                     </div>
                     <div className="col-3">
                       <img className="middle sechpro" src={data[i].pictureurl}/>
@@ -189,6 +196,9 @@ import Collapsible from "./Collapsible";
                      
                     {imp_img}
                   </div>
+                  <div className="col">
+                      <BlockQuoteB text={data[i].quote} cite={quoted}></BlockQuoteB>
+                  </div>
                   {int}
                   {refs}
             </>

src/data/hptimelinedata.tsx

@@ -29,6 +29,7 @@ export interface TimelineDatenpunkt {
   references?: Array<React.ReactNode>;  /* Muss HTML Code sein - Liliana erstellt den aus Bib dateien */
   interview?: React.ReactNode; 
   text?: string | Array<string> | Array<React.ReactNode>; /* Extra Text */
+  experton?: string;  
 }
 
 type StakeholderTag = 'Industry' | 'Academia' | 'Patient' | 'Medical Professional' | 'Milestone' | 'Other';