convert ContactUsCards to styled components

Author: thorrellt

components/ContactUsCards.js

@@ -1,6 +1,7 @@
-import contactCardStyles from '@/styles/ContactUsCards.module.scss';
 import CardsColumns from './containers/CardColumns/CardsColumns';
 import RevealContentContainer from './containers/RevealContentContainer/RevealContentContainer';
+import styled from 'styled-components';
+import { $white } from '@/styles/_variables';
 
 const cards = [
   {
@@ -29,12 +30,16 @@ const cards = [
   },
 ];
 
+const ContactCardsContainer = styled.div`
+  background-color: ${$white};
+`;
+
 export default function ContactUsCards() {
   return (
-    <div className={contactCardStyles.contactCards}>
+    <ContactCardsContainer>
       <RevealContentContainer>
         <CardsColumns cards={cards} customClass='contact-cards' />
       </RevealContentContainer>
-    </div>
+    </ContactCardsContainer>
   );
 }

styles/ContactUsCards.module.scss

@@ -1,6 +1,6 @@
-@use './mixins' as *;
-@use './variables' as *;
+// @use './mixins' as *;
+// @use './variables' as *;
 
-.contactCards {
-  background-color: $white;
-}
+// .contactCards {
+//   background-color: $white;
+// }