fix: Apply linter <span> rule

Signed-off-by: Carlos Esteban Lopez <lcarlosesteb@vmware.com>

plugins/home/src/homePageComponents/WelcomeTitle/WelcomeTitle.tsx

@@ -19,6 +19,7 @@ import {
   useApi,
 } from '@backstage/core-plugin-api';
 import { Tooltip } from '@material-ui/core';
+import Typography from '@material-ui/core/Typography';
 import React, { useEffect, useMemo } from 'react';
 import useAsync from 'react-use/lib/useAsync';
 import { getTimeBasedGreeting } from './timeUtil';
@@ -43,9 +44,9 @@ export const WelcomeTitle = () => {
 
   return (
     <Tooltip title={greeting.language}>
-      <span>{`${greeting.greeting}${
+      <Typography component="span">{`${greeting.greeting}${
         profile?.displayName ? `, ${profile?.displayName}` : ''
-      }!`}</span>
+      }!`}</Typography>
     </Tooltip>
   );
 };