Updated scss class names to follow camelcases

Author: Satoshi-Sh

components/containers/Member/Member.module.scss

@@ -1,6 +1,6 @@
 @use '@/styles/mixins' as *;
 
-.Card {
+.card {
   margin: 1rem 1rem 0 0.5rem;
   padding: 1rem;
   border-radius: 1.5rem;
@@ -23,7 +23,7 @@
   }
 }
 
-.Name {
+.name {
   font-style: italic;
   font-family: var(--font-heading);
   font-size: 1.5rem;
@@ -41,26 +41,26 @@
   margin: 0px;
 }
 
-.Title {
+.title {
   @extend %headingStyle;
 }
 
-.Position {
+.position {
   @extend %headingStyle;
 }
 
-.Content {
+.content {
   align-items: center;
   margin: auto;
 }
 
-.Paragraph {
+.paragraph {
   font-size: 1rem;
   text-align: left;
   line-height: normal;
 }
 
-.LinkWrapper {
+.linkWrapper {
   font-size: 1rem;
   display: flex;
   flex-direction: row;
@@ -78,7 +78,7 @@
   }
 }
 
-.ImageWrapper {
+.imageWrapper {
   min-width: 10rem;
   min-height: 10rem;
   position: relative;

components/containers/Member/index.js

@@ -11,19 +11,19 @@ export default function Member({
   portfolio,
 }) {
   return (
-    <div className={styles.Card}>
+    <div className={styles.card}>
       {image && (
-        <div className={styles.ImageWrapper}>
+        <div className={styles.imageWrapper}>
           <Image src={image} alt={name} fill />
         </div>
       )}
 
-      <h2 className={styles.Name}>{name}</h2>
-      <h3 className={styles.Title}>{title}</h3>
-      <h3 className={styles.Position}>{position}</h3>
-      <div className={styles.Content}>
+      <h2 className={styles.name}>{name}</h2>
+      <h3 className={styles.title}>{title}</h3>
+      <h3 className={styles.position}>{position}</h3>
+      <div className={styles.content}>
         {linkedIn && (
-          <div className={styles.LinkWrapper}>
+          <div className={styles.linkWrapper}>
             <Image
               src='/images/svg/linkedin-portfolio.svg'
               alt='LinkedIn'
@@ -40,7 +40,7 @@ export default function Member({
           </div>
         )}
         {portfolio && (
-          <div className={styles.LinkWrapper}>
+          <div className={styles.linkWrapper}>
             <Image
               src='/images/svg/globe.svg'
               alt='Web Site'
@@ -57,7 +57,7 @@ export default function Member({
           </div>
         )}
 
-        <p className={styles.Paragraph}>{about}</p>
+        <p className={styles.paragraph}>{about}</p>
       </div>
     </div>
   );