export function Table ( props ) { return ( < div className = "max-w-full overflow-auto" > < table className = "align-middle w-full break-words text-sm rounded-md border-collapse overflow-hidden" { ... props } /> < /div>); } export function TableHead ( props ) { return < thead className = "dark:bord-white text-left border-b-2 dark:border-black border-gray-300" { ... props } />; } export function TableHeader ( props ) { return < th className = "p-2 px-3 bg-gray-200 dark:bg-table-head-background-dark uppercase" { ... props } />; } export function TableRow ( props ) { return ( < tr className = "dark:even:bg-trueGray-900 dark:text-text-dark text-text-light bg-gray-100 even:bg-gray-50 dark:bg-trueGray-800" { ... props } />); } export function TableData ( props ) { return < td className = "p-2 px-3 max-w-xs" { ... props } />; }