[REFACTOR] #125 : 설문 응답 OverView 페이지 UI 변경

pknu-wap · Feb 16, 2024 · add34aa · add34aa
1 parent 721106c
commit add34aa
Showing 1 changed file with 34 additions and 18 deletions.
diff --git a/feature/survey/src/main/java/com/wap/wapp/feature/survey/answer/SurveyOverview.kt b/feature/survey/src/main/java/com/wap/wapp/feature/survey/answer/SurveyOverview.kt
@@ -1,15 +1,21 @@
 package com.wap.wapp.feature.survey.answer
 
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
+import androidx.compose.foundation.layout.Row
+import androidx.compose.foundation.layout.Spacer
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.draw.clip
 import androidx.compose.ui.res.stringResource
-import androidx.compose.ui.text.SpanStyle
-import androidx.compose.ui.text.buildAnnotatedString
-import androidx.compose.ui.text.withStyle
 import androidx.compose.ui.unit.dp
 import com.wap.designsystem.WappTheme
 import com.wap.designsystem.component.WappButton
@@ -59,19 +65,29 @@ internal fun SurveyOverview(
 
 @Composable
 private fun SurveyOverviewText(category: String, content: String) {
-    Text(
-        text = buildAnnotatedString {
-            withStyle(
-                SpanStyle(color = WappTheme.colors.white),
-            ) {
-                append("$category : ")
-            }
-            withStyle(
-                SpanStyle(color = WappTheme.colors.yellow34),
-            ) {
-                append(content)
-            }
-        },
-        style = WappTheme.typography.titleBold,
-    )
+    Row(modifier = Modifier.fillMaxWidth()) {
+        Text(
+            text = category,
+            color = WappTheme.colors.white,
+            style = WappTheme.typography.titleBold,
+        )
+
+        Spacer(modifier = Modifier.weight(1f))
+
+        Box(
+            modifier = Modifier
+                .width(200.dp)
+                .clip(RoundedCornerShape(8.dp))
+                .background(WappTheme.colors.black25),
+        ) {
+            Text(
+                text = content,
+                color = WappTheme.colors.white,
+                style = WappTheme.typography.contentMedium,
+                modifier = Modifier
+                    .align(Alignment.Center)
+                    .padding(vertical = 10.dp),
+            )
+        }
+    }
 }