refactor(client): update OfflineWarning to use Alert and Spacer components (freeCodeCamp#60871)

Author: Sky-walkerX

client/src/components/OfflineWarning/offline-warning.tsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { Trans, useTranslation } from 'react-i18next';
+import { Alert, Spacer } from '@freecodecamp/ui';
 
 import './offline-warning.css';
 
@@ -43,8 +44,10 @@ function OfflineWarning({
 
   return showWarning ? (
     <>
-      <div className='offline-warning alert-info'>{message}</div>
-      <div style={{ height: `38px` }} />
+      <Alert variant='info' className='offline-warning'>
+        {message}
+      </Alert>
+      <Spacer size='m' />
     </>
   ) : null;
 }