[Feature/BAR-281] 입력창, 탭 배경색 변경 (#100)

* style(끄적이는): 입력창 배경색 변경 * style: 탭 배경색 변경
YAPP-Github · Mar 25, 2024 · d2daefc · d2daefc
1 parent 6f47191
commit d2daefc
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/src/components/Layout/style.css.ts b/src/components/Layout/style.css.ts
@@ -202,8 +202,11 @@ export const mainWrapper = style({
 
 export const tab = style({
   position: 'fixed',
-  top: '84px',
+  top: '64px',
   left: '50%',
+  padding: '20px 100%',
+  background:
+    'linear-gradient(180deg, #FFF 36.93%, rgba(255, 255, 255, 0.00) 100%)',
   transform: 'translate(-50%, 0)',
   zIndex: 50,
 });

diff --git a/src/domain/끄적이는/components/WriteTabContent/style.css.ts b/src/domain/끄적이는/components/WriteTabContent/style.css.ts
@@ -7,6 +7,7 @@ export const container = style({
   padding: '0 40px',
   marginBottom,
   scrollMarginBottom,
+
   '::-webkit-scrollbar': {
     display: 'none',
   },
@@ -15,14 +16,18 @@ export const container = style({
 export const inputWrapper = style({
   position: 'fixed',
   left: '50%',
-  bottom: '48px',
+  bottom: 0,
   width: '100%',
-  transform: 'translateX(-50%)',
   maxWidth: '1120px',
+  padding: '56px 0',
+  transform: 'translateX(-50%)',
+  background:
+    'linear-gradient(180deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%)',
   zIndex: 10,
+
   '@media': {
     'screen and (max-width: 1200px)': {
-      padding: '0 40px',
+      padding: '56px 40px',
     },
   },
 });