Merge pull request #66 from Nexters/fix/home-design

홈 화면에서 변경된 디자인을 적용합니다.

Author: eshc123

core/designsystem/src/main/res/values/strings.xml

@@ -6,7 +6,7 @@
     <string name="home_bottom_sheet_stop_text">멈추기</string>
     <string name="home_bottom_create_gathering_description">모임을 생성하고\n넌지시 만남을 제안해 보세요</string>
     <string name="home_bottom_create_gathering_button_text">모임 생성하기</string>
-    <string name="home_last_alarm">마지막 알람</string>
+    <string name="home_last_alarm">마지막 연락</string>
     <string name="home_random_proposal_description_prefix">말이 안되는거 알지만\n\n\n우리,</string>
     <string name="home_random_proposal_description_suffix">어때</string>
     <string name="home_proposals">받은 초대장</string>

feature/home/src/main/java/com/plottwist/feature/home/HomeScreen.kt

@@ -317,27 +317,41 @@ private fun HomeScreen(
             HomeAppBar(onMyPageClick)
 
             Column(
-                modifier = Modifier.fillMaxSize().padding(
-                    bottom = BOTTOM_SHEET_PEEK_HEIGHT.dp
-                ).verticalScroll(verticalScrollState)
+                modifier = Modifier
+                    .fillMaxSize()
+                    .padding(
+                        bottom = BOTTOM_SHEET_PEEK_HEIGHT.dp
+                    )
+                    .verticalScroll(verticalScrollState)
             ) {
                 HomeTitle(
                     modifier = Modifier.height(HOME_TITLE_HEIGHT.dp),
                     name = if(userName is UiState.Success) userName.value else ""
                 )
-
-                HomeContent(
-                    modifier = Modifier
-                        .padding(
-                            top = homeContentTopPadding - HOME_TITLE_HEIGHT.dp - 40.dp,
-                            bottom = 40.dp
-                        ),
-                    gatherings = if(gatherings is UiState.Success) gatherings.value else Gatherings(),
+                if(gatherings is UiState.Success && gatherings.value.gatheringOverviews.size >= 2) {
+                    HomeContent(
+                        modifier = Modifier
+                            .padding(top = 80.dp, bottom = 80.dp),
+                        gatherings =  gatherings.value,
                     onAddGatheringClick = onAddGatheringClick,
                     onGatheringClick = onGatheringClick
-                )
+                    )
+                }
             }
         }
+        if(gatherings !is UiState.Success || gatherings.value.gatheringOverviews.size < 2){
+            HomeContent(
+                modifier = Modifier.align(Alignment.Center),
+                gatherings =  if(gatherings is UiState.Success && gatherings.value.gatheringOverviews.size <= 1) {
+                    gatherings.value
+                } else {
+                    Gatherings()
+                },
+                onAddGatheringClick = onAddGatheringClick,
+                onGatheringClick = onGatheringClick
+            )
+        }
+
         if(proposalTags is UiState.Success) {
             HomeBottomSheet(
                 modifier = Modifier

feature/home/src/main/java/com/plottwist/feature/home/component/GatheringsCard.kt

@@ -27,6 +27,8 @@ import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
 import com.plottwist.core.designsystem.R
 import com.plottwist.core.designsystem.foundation.TukColorTokens.Gray000
+import com.plottwist.core.designsystem.foundation.TukColorTokens.Gray800
+import com.plottwist.core.designsystem.foundation.TukColorTokens.Gray900
 import com.plottwist.core.designsystem.foundation.type.TukPretendardTypography
 import com.plottwist.core.domain.model.Gatherings
 
@@ -46,7 +48,7 @@ fun GatheringsCard(
                 blur = 6.dp
             )
             .background(
-                color = Color(0x35FFFFFF),
+                color = Color(0x88FFFFFF),
                 shape = RoundedCornerShape(20.dp)
             )
             .border(
@@ -63,7 +65,7 @@ fun GatheringsCard(
         )
         if(gatherings.gatheringOverviews.isNotEmpty()) {
             HorizontalDivider(
-                color = Color(0xFFEFEFEF)
+                color = Color(0xFFEAEAEA)
             )
 
             gatherings.gatheringOverviews.forEach { gathering ->
@@ -107,7 +109,7 @@ fun CreateGatheringText(
         Text(
             text = "모임 생성",
             style = TukPretendardTypography.body14R,
-            color = Color(0xFF1F1F1F)
+            color = Gray900
         )
     }
 }
@@ -123,7 +125,7 @@ fun GatheringItem(
         modifier
             .fillMaxWidth()
             .clip(RoundedCornerShape(20.dp))
-            .padding(vertical = 12.dp)
+            .padding(vertical = 6.dp)
             .clickable(
                 interactionSource = null,
                 indication = null
@@ -142,22 +144,22 @@ fun GatheringItem(
                 style = TukPretendardTypography.body14M,
                 maxLines = 1,
                 overflow = TextOverflow.Ellipsis,
-                color = Color(0xFF1f1f1f)
+                color = Gray900
             )
 
             Row (
                 horizontalArrangement = Arrangement.spacedBy(5.dp)
             ) {
                 Text(
                     text = stringResource(R.string.home_last_alarm),
-                    style = TukPretendardTypography.body14R,
-                    color = Color(0xFF888888)
+                    style = TukPretendardTypography.body12R,
+                    color = Gray800
                 )
 
                 Text(
                     text = lastAlarm,
-                    style = TukPretendardTypography.body14R,
-                    color = Color(0xFF888888)
+                    style = TukPretendardTypography.body12R,
+                    color = Gray800
                 )
             }
         }

feature/home/src/main/java/com/plottwist/feature/home/component/HomeBottomSheet.kt

@@ -40,6 +40,7 @@ import androidx.compose.ui.unit.IntOffset
 import androidx.compose.ui.unit.dp
 import com.plottwist.core.designsystem.R
 import com.plottwist.core.designsystem.foundation.TukColorTokens.Gray800
+import com.plottwist.core.designsystem.foundation.TukColorTokens.Gray900
 import com.plottwist.core.designsystem.foundation.type.TukSerifTypography
 import com.plottwist.core.ui.extension.borderExceptBottom
 import com.plottwist.core.ui.extension.dropShadow
@@ -264,7 +265,8 @@ fun DraggableBottomSheet(
                     ) {
                         Text(
                             text = stringResource(R.string.home_bottom_sheet_nudging_text),
-                            style = TukSerifTypography.body14R
+                            style = TukSerifTypography.body14R,
+                            color = Gray900
                         )
                     }
                 }