Replaced all the css into tailwind css on ScreenReaderOnly component (#…

…1758)
OperationCode · Nov 4, 2023 · b995c61 · b995c61 · vercel · Nov 4, 2023
1 parent 33ed32b
commit b995c61
Show file tree

Hide file tree

Showing 3 changed files with 2 additions and 13 deletions.
diff --git a/components/ScreenReaderOnly/ScreenReaderOnly.js b/components/ScreenReaderOnly/ScreenReaderOnly.js
@@ -1,6 +1,5 @@
 import { node } from 'prop-types';
 import { SCREEN_READER_ONLY } from 'common/constants/testIDs';
-import styles from './ScreenReaderOnly.module.css';
 
 export const toggleMessages = {
   open: 'Show more',
@@ -13,7 +12,7 @@ ScreenReaderOnly.propTypes = {
 
 function ScreenReaderOnly({ children }) {
   return (
-    <span className={styles.ScreenReaderOnly} data-testid={SCREEN_READER_ONLY}>
+    <span className="sr-only" data-testid={SCREEN_READER_ONLY}>
       {children}
     </span>
   );

diff --git a/components/ScreenReaderOnly/ScreenReaderOnly.module.css b/components/ScreenReaderOnly/ScreenReaderOnly.module.css
diff --git a/components/ScreenReaderOnly/__tests__/__snapshots__/ScreenReaderOnly.test.js.snap b/components/ScreenReaderOnly/__tests__/__snapshots__/ScreenReaderOnly.test.js.snap
@@ -6,7 +6,7 @@ Array [
     Content never displayed, but it is rendered
   </span>,
   <span
-    className="ScreenReaderOnly"
+    className="sr-only"
     data-testid="SCREEN_READER_ONLY"
   >
     ScreenReader content