fix: [LINKER-141] 일정/연락처 등록 바텀싯 스타일 수정 (#80)

YAPP-Github · Feb 23, 2024 · a1959a0 · a1959a0
1 parent e29f9be
commit a1959a0
Show file tree

Hide file tree

Showing 6 changed files with 13 additions and 6 deletions.
diff --git a/packages/lds/src/BottomSheet/BottomSheet.css.ts b/packages/lds/src/BottomSheet/BottomSheet.css.ts
@@ -33,7 +33,7 @@ export const content = style({
 
 export const handler = style({
   position: 'sticky',
-  zIndex: 1,
+  zIndex: 10,
   top: 0,
   display: 'flex',
   justifyContent: 'center',
@@ -56,7 +56,7 @@ export const handler = style({
 
 export const buttonGroupWrapper = style({
   position: 'sticky',
-  zIndex: 1,
+  zIndex: 10,
   top: '1.6rem',
   display: 'flex',
   justifyContent: 'space-between',

diff --git a/packages/lds/src/Header/FixedHeader.tsx b/packages/lds/src/Header/FixedHeader.tsx
@@ -19,7 +19,7 @@ interface HeaderProps {
   scrollOver?: number;
 }
 
-const MINIMIZE_SCROLL = HEADER_HEIGHT_NUMBER + TAB_HEIGHT_NUMBER + 15;
+const MINIMIZE_SCROLL = HEADER_HEIGHT_NUMBER + TAB_HEIGHT_NUMBER + 25;
 
 const FixedHeader = forwardRef<HTMLDivElement, HeaderProps>(
   ({ children, leftAddon, rightAddon, className, bgColor, scrollOver = 0 }: HeaderProps, ref) => {

diff --git a/...ices/web/src/features/contact/components/AddFriendBottomSheet/AddFriendBottomSheet.css.ts b/...ices/web/src/features/contact/components/AddFriendBottomSheet/AddFriendBottomSheet.css.ts
@@ -6,6 +6,7 @@ export const container = style({
   display: 'flex',
   flexDirection: 'column',
   alignItems: 'center',
+  marginBottom: '8rem',
   padding: '2.4rem 1.6rem 3.2rem',
 });
 

diff --git a/services/web/src/features/schedule/components/AddScheduleBottomSheet.css.ts b/services/web/src/features/schedule/components/AddScheduleBottomSheet.css.ts
@@ -5,6 +5,7 @@ export const container = style({
   position: 'relative',
   backgroundColor: colors.background,
   height: 'calc(100% - 64px)',
+  marginBottom: '8rem',
 });
 
 export const listRow = style({
@@ -48,7 +49,6 @@ export const textareaContainer = style({
 
 export const textarea = style({
   height: '23.2rem !important',
-  padding: '0 1.6rem',
 });
 
 export const dropdownTrigger = style({

diff --git a/services/web/src/features/schedule/components/SearchContact.css.ts b/services/web/src/features/schedule/components/SearchContact.css.ts
@@ -22,6 +22,12 @@ export const contactInput = style({
   height: '4.8rem !important',
 });
 
+export const contactSearchInput = style({
+  width: '25rem',
+  padding: '1.4rem 2rem !important',
+  height: '4.8rem !important',
+});
+
 export const contactWrapper = style({
   display: 'flex',
   flexDirection: 'column',

diff --git a/services/web/src/features/schedule/components/SearchContact.tsx b/services/web/src/features/schedule/components/SearchContact.tsx
@@ -8,7 +8,7 @@ import { useForm, useWatch } from 'react-hook-form';
 import {
   contactCard,
   contactCardInfo,
-  contactInput,
+  contactSearchInput,
   contactWrapper,
   container,
   inputWrapper,
@@ -48,7 +48,7 @@ const SearchContact = ({ setIsSearchContact }: Props) => {
           <div className={inputWrapper}>
             <Icon name="search" size={32} />
             <Input
-              className={contactInput}
+              className={contactSearchInput}
               type="text"
               placeholder="초대받은 사람 추가"
               errorMessage={errors.contact?.message}