JSFiddle - React, Tailwind, and code Playground

JavaScript

@for (int currentLineNumber = 1; currentLineNumber < Model[i].Services[j].ServiceDescription.Split('\n').Length+1; currentLineNumber++) //how many lines does my description has
     {// plus one because at the end there is no line break(at the end)
         //Model[i].Services[j].ServiceDescription[k]
         switch (currentLineNumber)
         {
             case 1: //first line
                 <h1>First line</h1>
                 break;  
             case 2: //second line
             <h1>Second line</h1>
                 break;
             case 3: //second line
             <text>
                 Third line
             </text>
                 break;
             default://for everything that is bigger than the third line if it contains "-" otherwise display a normal text
                 if (currentLineNumber > 3)
                 {
                     <ul><li>@currentLineNumber line</li></ul>
                 }
                 break;
         }
     }