🐛 Fix: DateTimePicker 동작개선

Author: yulrang

src/components/common/crew-list/crew-card-list.tsx

@@ -33,7 +33,7 @@ export default function CrewCardList({ data, inWhere }: CrewCardListProps) {
     );
 
   return (
-    <ul className={`mx-auto grid w-full grid-cols-1 gap-x-2 gap-y-2 ${gridColsStyle}`}>
+    <ul className={`mx-auto grid w-full grid-cols-1 gap-x-4 gap-y-6 ${gridColsStyle}`}>
       {crewDataList.map((inform) => (
         <li key={inform?.id} className="w-full">
           <CrewCard

src/components/common/input/date-time-picker/index.tsx

@@ -18,10 +18,18 @@ export default function DateTimePicker({ fullDate, onChange }: DateTimePickerPro
   const [minute, setMinute] = useState<string | null>('분');
 
   const handleSelect = (date: Date) => {
+    const newDate = new Date(selected);
     const isSelected = selected;
 
+    newDate.setFullYear(Number(date.getFullYear()));
+    newDate.setMonth(Number(date.getMonth()));
+    newDate.setDate(Number(date.getDate()));
+
+    const kstDate = new Date(newDate.getTime() - newDate.getTimezoneOffset() * 60000).toISOString();
+
     if (isSelected) {
-      setSelected(date);
+      setSelected(newDate);
+      onChange(kstDate);
     }
   };
 
@@ -53,7 +61,7 @@ export default function DateTimePicker({ fullDate, onChange }: DateTimePickerPro
             })}
             firstDayOfWeek={0}
             classNames={{
-              day: 'w-full aspect-square text-gray-800 data-[selected=true]:text-white flex',
+              day: 'w-full aspect-square text-gray-800 data-[selected=true]:text-white data-[selected=true]:rounded-xl flex',
               monthCell: 'w-[calc(14.285vw-5.714px)] aspect-square md:w-[85px]',
               monthsListCell:
                 'w-[calc(33.333vw-13.333px)] h-[10vw] md:w-[200px] md:h-[80px] text-gray-800',

src/components/common/skeleton/crew-skeleton-list/index.tsx

@@ -8,7 +8,7 @@ interface CrewSkeletonListProps {
 export default function CrewSkeletonList({ num, column }: CrewSkeletonListProps) {
   const columnStyle = column === 2 ? 'lg:grid-cols-2' : 'lg:grid-cols-1';
   return (
-    <div className={`grid grid-cols-1 gap-2 ${columnStyle}`} aria-label="콘텐츠 로딩 중">
+    <div className={`grid grid-cols-1 gap-x-4 gap-y-6 ${columnStyle}`} aria-label="콘텐츠 로딩 중">
       {[...Array(num)].map((_, index) => (
         // eslint-disable-next-line react/no-array-index-key
         <CrewSkeleton key={index} />