[FE] FEAT: 컨벤션에 맞도록 컴포넌트명 수정 #1649

innovationacademy-kr · Sep 25, 2024 · 6cd7b0a · 6cd7b0a
1 parent 0b7e061
commit 6cd7b0a
Showing 1 changed file with 9 additions and 9 deletions.
diff --git a/frontend/src/Cabinet/components/Common/DarkModeToggleSwitch.tsx b/frontend/src/Cabinet/components/Common/DarkModeToggleSwitch.tsx
@@ -73,22 +73,22 @@ const DarkModeToggleSwitch = ({ id }: { id: string }) => {
   const isDarkMode = displayStyleType === DisplayStyleType.DARK;
 
   return (
-    <ToggleSwitchContainer>
+    <ToggleWrapperStyled>
       <CheckboxStyled id={id} checked={isDarkMode} onChange={handleToggle} />
       <ToggleSwitchStyled htmlFor={id} isChecked={isDarkMode}>
-        <MoonIconWrapper>
+        <MoonIconWrapperStyled>
           <MoonIcon />
-        </MoonIconWrapper>
-        <SunIconWrapper>
+        </MoonIconWrapperStyled>
+        <SunIconWrapperStyled>
           <SunIcon />
-        </SunIconWrapper>
+        </SunIconWrapperStyled>
         <ToggleKnobStyled isChecked={isDarkMode} />
       </ToggleSwitchStyled>
-    </ToggleSwitchContainer>
+    </ToggleWrapperStyled>
   );
 };
 
-const ToggleSwitchContainer = styled.div`
+const ToggleWrapperStyled = styled.div`
   display: inline-block;
   position: relative;
   margin-right: 10px;
@@ -125,7 +125,7 @@ const ToggleKnobStyled = styled.span<{ isChecked: boolean }>`
   transition: left 0.2s;
 `;
 
-const MoonIconWrapper = styled.div`
+const MoonIconWrapperStyled = styled.div`
   position: absolute;
   left: 5px;
   top: 50%;
@@ -140,7 +140,7 @@ const MoonIconWrapper = styled.div`
   }
 `;
 
-const SunIconWrapper = styled.div`
+const SunIconWrapperStyled = styled.div`
   position: absolute;
   right: 5px;
   top: 50%;