Feature/#125 : 일정 UI

core/designsystem/src/main/java/com/yapp/core/designsystem/theme/Color.kt

@@ -8,6 +8,7 @@ import androidx.compose.ui.graphics.Color
 
 internal val LightColorScheme = YappColorScheme(
     primaryNormal = Color(0xFFFA6027),
+    secondaryNormal = Color(0xFFFFAD31),
 
     labelNormal = Color(0xFF171719),
     labelStrong = Color(0xFF000000),
@@ -44,11 +45,25 @@ internal val LightColorScheme = YappColorScheme(
     staticWhite = Color(0xFFFFFFFF),
     staticBlack = Color(0xFF000000),
 
+    accentLightBlue = Color(0xFF00AEFF),
+    accentLightBlueWeak = Color(0xFFE5F7FF),
+
+    accentRed = Color(0xFFE32908),
+    accentRedWeak = Color(0xFFFEE6E1),
+
+    accentViolet = Color(0xFF6541F2),
+    accentVioletWeak = Color(0xFFECE7FD),
+
+    coolNeutral50 = Color(0xFF70737C),
+    neutral40 = Color(0xFF5C5C5C),
+    neutral95 = Color(0xFFDCDCDC),
     orange99 = Color(0xFFFFF8F5),
+    yellow95 = Color(0xFFFFF7EA),
 
     materialDimmer = Color(0x85171719),
 
     semanticFillString = Color(0x2970737C),
+    semanticFillAlternative = Color(0xFFDFDFDF),
 
     skeleton = Brush.linearGradient(
         colors = listOf(
@@ -63,6 +78,7 @@ internal val LightColorScheme = YappColorScheme(
 @Immutable
 data class YappColorScheme(
     val primaryNormal: Color,
+    val secondaryNormal: Color,
 
     val labelNormal: Color,
     val labelStrong: Color,
@@ -99,11 +115,25 @@ data class YappColorScheme(
     val staticWhite: Color,
     val staticBlack: Color,
 
+    val accentLightBlue: Color,
+    val accentLightBlueWeak: Color,
+
+    val accentRed: Color,
+    val accentRedWeak: Color,
+
+    val accentViolet: Color,
+    val accentVioletWeak: Color,
+
+    val coolNeutral50: Color,
+    val neutral40: Color,
+    val neutral95: Color,
     val orange99: Color,
+    val yellow95: Color,
 
     val materialDimmer: Color,
 
     val semanticFillString: Color,
+    val semanticFillAlternative: Color,
 
     val skeleton: Brush,
 
@@ -112,6 +142,7 @@ data class YappColorScheme(
 val LocalColorScheme = staticCompositionLocalOf {
     YappColorScheme(
         primaryNormal = Color.Unspecified,
+        secondaryNormal = Color.Unspecified,
         labelNormal = Color.Unspecified,
         labelStrong = Color.Unspecified,
         labelNeutral = Color.Unspecified,
@@ -140,9 +171,20 @@ val LocalColorScheme = staticCompositionLocalOf {
         statusNegative = Color.Unspecified,
         staticWhite = Color.Unspecified,
         staticBlack = Color.Unspecified,
+        accentLightBlue = Color.Unspecified,
+        accentLightBlueWeak = Color.Unspecified,
+        accentRed = Color.Unspecified,
+        accentRedWeak = Color.Unspecified,
+        accentViolet = Color.Unspecified,
+        accentVioletWeak = Color.Unspecified,
+        coolNeutral50 = Color.Unspecified,
+        neutral40 = Color.Unspecified,
+        neutral95 = Color.Unspecified,
         orange99 = Color.Unspecified,
+        yellow95 = Color.Unspecified,
         materialDimmer = Color.Unspecified,
         semanticFillString = Color.Unspecified,
+        semanticFillAlternative = Color.Unspecified,
         skeleton = Brush.linearGradient(
             colors = listOf(Color.Unspecified, Color.Unspecified)
         )

core/designsystem/src/main/res/drawable/icon_location.xml

@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="16dp"
+    android:height="16dp"
+    android:viewportWidth="16"
+    android:viewportHeight="16">
+  <group>
+    <clip-path
+        android:pathData="M3.786,3.367C4.885,2.059 6.443,1.4 7.998,1.4C9.554,1.4 11.105,2.052 12.211,3.367C14.121,5.638 13.824,8.988 11.77,11.05L11.769,11.051C10.604,12.217 9.262,13.634 8.699,14.228C8.661,14.269 8.626,14.305 8.595,14.338C8.272,14.683 7.725,14.683 7.401,14.338C7.371,14.305 7.336,14.269 7.297,14.228C6.735,13.634 5.393,12.217 4.227,11.051L4.227,11.05C2.173,8.989 1.875,5.632 3.786,3.367ZM7.998,2.6C6.781,2.6 5.565,3.114 4.704,4.139L4.704,4.14C3.228,5.889 3.424,8.544 5.076,10.203C6.149,11.275 7.365,12.554 7.998,13.223C8.632,12.554 9.848,11.275 10.92,10.203C12.572,8.544 12.769,5.895 11.292,4.139C10.425,3.108 9.216,2.6 7.998,2.6ZM7.998,6.24C7.636,6.24 7.345,6.531 7.345,6.893C7.345,7.255 7.636,7.547 7.998,7.547C8.36,7.547 8.652,7.255 8.652,6.893C8.652,6.531 8.36,6.24 7.998,6.24ZM6.145,6.893C6.145,5.869 6.974,5.04 7.998,5.04C9.023,5.04 9.852,5.869 9.852,6.893C9.852,7.918 9.023,8.747 7.998,8.747C6.974,8.747 6.145,7.918 6.145,6.893Z"
+        android:fillType="evenOdd"/>
+    <path
+        android:pathData="M0,0h16v16h-16z"
+        android:fillColor="#37383C"
+        android:fillAlpha="0.61"/>
+  </group>
+</vector>

core/designsystem/src/main/res/drawable/icon_time.xml

@@ -0,0 +1,15 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="16dp"
+    android:height="16dp"
+    android:viewportWidth="16"
+    android:viewportHeight="16">
+  <group>
+    <clip-path
+        android:pathData="M1.4,8C1.4,7.782 1.411,7.566 1.432,7.353L2.626,7.47C2.609,7.644 2.6,7.821 2.6,8C2.6,10.982 5.018,13.4 8,13.4C10.983,13.4 13.4,10.982 13.4,8C13.4,5.018 10.983,2.6 8,2.6C7.821,2.6 7.644,2.609 7.47,2.626L7.354,1.431C7.567,1.41 7.782,1.4 8,1.4C11.646,1.4 14.6,4.355 14.6,8C14.6,11.645 11.646,14.6 8,14.6C4.355,14.6 1.4,11.645 1.4,8ZM6.084,1.683C5.666,1.809 5.266,1.976 4.888,2.178L5.455,3.236C5.764,3.071 6.091,2.934 6.432,2.831L6.084,1.683ZM3.813,2.898C3.479,3.172 3.173,3.479 2.899,3.813L3.826,4.574C4.05,4.301 4.301,4.05 4.575,3.825L3.813,2.898ZM2.179,4.888C1.976,5.266 1.81,5.666 1.683,6.084L2.832,6.432C2.935,6.09 3.071,5.763 3.237,5.454L2.179,4.888ZM7.067,5V8.667V8.904L7.229,9.077L9.229,11.21L10.105,10.389L8.267,8.429V5H7.067Z"
+        android:fillType="evenOdd"/>
+    <path
+        android:pathData="M0,0h16v16h-16z"
+        android:fillColor="#37383C"
+        android:fillAlpha="0.61"/>
+  </group>
+</vector>

core/ui/src/main/java/com/yapp/core/ui/component/AttendanceStatusChip.kt

@@ -0,0 +1,111 @@
+package com.yapp.core.ui.component
+
+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.padding
+import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.stringResource
+import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
+import com.yapp.core.designsystem.theme.YappTheme
+import com.yapp.core.ui.R
+
+enum class AttendanceStatus {
+    SCHEDULED,
+    ATTENDED,
+    LATE,
+    ABSENT,
+    EARLY_LEAVE,
+    EXCUSED,
+}
+
+@Composable
+fun AttendanceStatusChip(
+    status: AttendanceStatus,
+) {
+    val text = when (status) {
+        AttendanceStatus.SCHEDULED -> stringResource(id = R.string.attendance_status_scheduled)
+        AttendanceStatus.ATTENDED -> stringResource(id = R.string.attendance_status_attended)
+        AttendanceStatus.LATE -> stringResource(id = R.string.attendance_status_late)
+        AttendanceStatus.ABSENT -> stringResource(id = R.string.attendance_status_absent)
+        AttendanceStatus.EARLY_LEAVE -> stringResource(id = R.string.attendance_status_early_leave)
+        AttendanceStatus.EXCUSED -> stringResource(id = R.string.attendance_status_excused)
+    }
+
+    val backgroundColor = when (status) {
+        AttendanceStatus.SCHEDULED -> YappTheme.colorScheme.yellow95
+        AttendanceStatus.ATTENDED -> YappTheme.colorScheme.accentLightBlueWeak
+        AttendanceStatus.LATE -> YappTheme.colorScheme.semanticFillAlternative
+        AttendanceStatus.ABSENT -> YappTheme.colorScheme.accentRedWeak
+        AttendanceStatus.EARLY_LEAVE -> YappTheme.colorScheme.accentVioletWeak
+        AttendanceStatus.EXCUSED -> YappTheme.colorScheme.neutral95
+    }
+
+    val textColor = when (status) {
+        AttendanceStatus.SCHEDULED -> YappTheme.colorScheme.secondaryNormal
+        AttendanceStatus.ATTENDED -> YappTheme.colorScheme.accentLightBlue
+        AttendanceStatus.LATE -> YappTheme.colorScheme.coolNeutral50
+        AttendanceStatus.ABSENT -> YappTheme.colorScheme.accentRed
+        AttendanceStatus.EARLY_LEAVE -> YappTheme.colorScheme.accentViolet
+        AttendanceStatus.EXCUSED -> YappTheme.colorScheme.neutral40
+    }
+
+    Box(
+        modifier = Modifier
+            .background(
+                color = backgroundColor,
+                shape = RoundedCornerShape(6.dp)
+            )
+            .padding(
+                horizontal = 8.dp,
+                vertical = 2.dp
+            )
+    ) {
+        Text(
+            text = text,
+            color = textColor,
+            style = YappTheme.typography.caption2Medium
+        )
+    }
+}
+
+@Preview(
+    showBackground = true
+)
+@Composable
+private fun AttendanceStatusChipPreview() {
+    YappTheme {
+        Column(
+            verticalArrangement = Arrangement.spacedBy(20.dp)
+        ) {
+            AttendanceStatusChip(
+                status = AttendanceStatus.SCHEDULED
+            )
+
+            AttendanceStatusChip(
+                status = AttendanceStatus.ATTENDED
+            )
+
+            AttendanceStatusChip(
+                status = AttendanceStatus.LATE
+            )
+
+            AttendanceStatusChip(
+                status = AttendanceStatus.ABSENT
+            )
+
+            AttendanceStatusChip(
+                status = AttendanceStatus.EARLY_LEAVE
+            )
+
+            AttendanceStatusChip(
+                status = AttendanceStatus.EXCUSED
+            )
+        }
+    }
+}

core/ui/src/main/java/com/yapp/core/ui/extension/Modifier.kt

@@ -2,10 +2,13 @@ package com.yapp.core.ui.extension
 
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.drawBehind
+import androidx.compose.ui.geometry.CornerRadius
 import androidx.compose.ui.geometry.Offset
+import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.graphics.PathEffect
+import androidx.compose.ui.graphics.drawscope.Stroke
 import androidx.compose.ui.unit.Dp
 import androidx.compose.ui.unit.dp
-import androidx.compose.ui.graphics.Color
 
 fun Modifier.borderBottom(
     color: Color,
@@ -23,4 +26,26 @@ fun Modifier.borderBottom(
             strokeWidth = strokeWidthPx
         )
     }
-)
+)
+
+fun Modifier.dashedBorder(
+    color: Color,
+    strokeWidth: Dp = 1.dp,
+    dashLength: Dp = 10.dp,
+    gapLength: Dp = 5.dp,
+    cornerRadius: Dp = 0.dp
+): Modifier = drawBehind {
+    val stroke = Stroke(
+        width = strokeWidth.toPx(),
+        pathEffect = PathEffect.dashPathEffect(
+            floatArrayOf(dashLength.toPx(), gapLength.toPx()),
+            0f
+        )
+    )
+    drawRoundRect(
+        color = color,
+        size = size,
+        cornerRadius = CornerRadius(cornerRadius.toPx()),
+        style = stroke
+    )
+}

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

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<resources>
+    <string name="attendance_status_scheduled">예정</string>
+    <string name="attendance_status_attended">출석</string>
+    <string name="attendance_status_late">지각</string>
+    <string name="attendance_status_absent">결석</string>
+    <string name="attendance_status_early_leave">조퇴</string>
+    <string name="attendance_status_excused">공결</string>
+</resources>