Increased size to add the dummy mail and the output label was not being shown correctly

Author: cePuerto

src/features/spam-demo/SpamDemo.tsx

@@ -38,7 +38,7 @@ const SpamDemo = ({ folder }: MailViewProps ) => {
       <p>Current folder: {folder}</p>
       <label >Content: </label>
       <br></br>
-      <textarea ref={textInput} placeholder="Content of the message..."/>
+      <textarea ref={textInput} style={{ width: '100%', height: '300px' }} placeholder="Content of the message..."/>
       <div>
         <button onClick={evalDemo}>Evaluate</button>
         <label id="result">The mail is: {lab}</label>

src/features/spam-demo/detector.ts

@@ -149,7 +149,7 @@ function color(v: any) {
 
 
 function provide_explanation(s_result: string, relevancies: any, outputTokens: any, container: any){
-  let strexp = `<span style ="color:black"> Your document was labeled as `+ s_result+ ` because of the blue tokens: \n </span>`;
+  let strexp = `<span style ="color:white"> Your document was labeled as `+ s_result+ ` because of the blue tokens: \n </span>`;
   for(let i = 0; i<LENTOKENS;i++){  
     strexp = strexp.concat(`<span style="color:${color(relevancies[i])}"> <b> ${finalVocab.get(outputTokens[i])} </b> </s> </span> `);
   }
@@ -191,7 +191,7 @@ export async function spamOrHam(message: string | undefined, result: any, explan
       s_result= "ham";
     }
     else{
-      result.innerHTML= "The mail is: spam";
+      result("The mail is: spam");
       s_result = "spam";
     }
     if (Object.values(running).length > 1 && s_result == "spam"){