🔀 :: (#54) Role Check 페이지를 퍼블리싱 했습니다.

core/common/.gitignore

@@ -1,3 +1,4 @@
 /build
 /consumer-rules.pro
-/proguard-rules.pro
+/proguard-rules.pro
+.idea

core/design-system/src/main/java/com/stackknowledge/design_system/component/button/StackKnowledgeButton.kt

@@ -2,7 +2,6 @@ package com.stackknowledge.design_system.component.button
 
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults

core/design-system/src/main/res/values/strings.xml

@@ -30,4 +30,7 @@
     <string name="evaluation">채점</string>
     <string name="create_mission">만들기</string>
     <string name="shop">상점</string>
+    <string name="student">학생</string>
+    <string name="teacher">선생님</string>
+    <string name="select_role_text">사용자가 학생인지\n 선생님인지 선택해주세요.</string>
 </resources>

feature/login/src/main/java/com/stackknowledge/login/RoleCheckScreen.kt

@@ -0,0 +1,82 @@
+package com.stackknowledge.login
+
+import androidx.compose.foundation.background
+import com.stackknowledge.design_system.R
+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.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.foundation.layout.padding
+import androidx.compose.foundation.layout.width
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.text.style.TextAlign
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.stackknowledge.design_system.component.button.StackKnowledgeButton
+import com.stackknowledge.design_system.theme.StackKnowledgeAndroidTheme
+import com.stackknowledge.login.background.LoginBackground
+
+@Composable
+fun RoleCheckScreen(
+    modifier: Modifier = Modifier,
+) {
+    StackKnowledgeAndroidTheme { colors, typography ->
+        Box(
+            modifier = modifier.background(color = colors.WHITE),
+        ) {
+            LoginBackground()
+            Column(
+                modifier = modifier
+                    .fillMaxSize()
+                    .padding(horizontal = 16.dp),
+                horizontalAlignment = Alignment.CenterHorizontally
+            ) {
+                Spacer(modifier = modifier.height(260.dp))
+
+                Text(
+                    text = stringResource(id = R.string.select_role_text),
+                    style = typography.titleMedium,
+                    color = colors.BLACK,
+                    textAlign = TextAlign.Center
+                )
+
+                Spacer(modifier = modifier.weight(1f))
+
+                Row(
+                    modifier = modifier.fillMaxWidth()
+                ) {
+                    StackKnowledgeButton(
+                        text = stringResource(id = R.string.student),
+                        modifier = modifier
+                            .height(60.dp)
+                            .weight(1f)
+                    )
+
+                    Spacer(modifier = modifier.width(8.dp))
+
+                    StackKnowledgeButton(
+                        text = stringResource(id = R.string.teacher),
+                        modifier = modifier
+                            .height(60.dp)
+                            .weight(1f)
+                    )
+                }
+
+                Spacer(modifier = modifier.height(102.dp))
+            }
+        }
+    }
+}
+
+@Preview
+@Composable
+fun RoleCheckScreenPre() {
+    RoleCheckScreen()
+}