Refactor: 변경된 mediaquries에 맞춰서 Positions, Stack 컴포넌트 수정 (#146)

co-kkiri/src/components/commons/Positions.tsx

@@ -6,7 +6,6 @@ import styled from "styled-components";
 import PositionChip from "./Chips/PositionChip";
 import DefaultChip from "./Chips/DefaultChip";
 import useResponsiveSidebar from "@/hooks/useResponsiveSideBar";
-import { breakpoints } from "@/styles/tokens";
 import { ICONS } from "@/constants/icons";
 import { POSITION_CHIP_LIMIT } from "@/constants/cardChipLimits";
 
@@ -23,16 +22,15 @@ export default function Positions({ positions, variant = "profile", page = "home
 
   useLayoutEffect(() => {
     if (variant === "card") {
-      const { tablet, desktop } = breakpoints;
       const pageLimits = POSITION_CHIP_LIMIT[page];
 
       let limit = pageLimits.mobile;
 
-      if (windowWidth >= tablet) {
+      if (windowWidth >= 768) {
         limit = pageLimits.tablet;
       }
 
-      if (windowWidth >= desktop) {
+      if (windowWidth >= 1200) {
         limit = isSidebarOpenNarrow ? pageLimits.desktopNarrow : pageLimits.desktopWide;
       }
 

co-kkiri/src/components/commons/Stacks.tsx

@@ -23,12 +23,11 @@ export default function Stacks({ stacks, variant = "profile" }: StacksProps) {
 
   useLayoutEffect(() => {
     if (variant === "card") {
-      const { desktop } = breakpoints;
       const { mobile, desktopNarrow, desktopWide } = STACK_CHIP_LIMIT;
 
       let limit = mobile;
 
-      if (windowWidth >= desktop) {
+      if (windowWidth >= 1200) {
         limit = isSidebarOpenNarrow ? desktopNarrow : desktopWide;
       }
       setDisplayPositions(stacks.slice(0, limit));