Skip to content

Commit c76f0a4

Browse files
l5x5ll5x5l
authored
Merge pull request #32 from YAPP-Github/ui/#11-style_guide
[UI/#11] 스타일 가이드 구현
2 parents bb19540 + dda6186 commit c76f0a4

17 files changed

Lines changed: 394 additions & 64 deletions

‎core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/Color.kt‎

Lines changed: 0 additions & 11 deletions
This file was deleted.

‎core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/Theme.kt‎

Lines changed: 25 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,41 @@
11
package com.threegap.bitnagil.designsystem
22

3-
import android.os.Build
43
import androidx.compose.foundation.isSystemInDarkTheme
5-
import androidx.compose.material3.MaterialTheme
6-
import androidx.compose.material3.darkColorScheme
7-
import androidx.compose.material3.dynamicDarkColorScheme
8-
import androidx.compose.material3.dynamicLightColorScheme
9-
import androidx.compose.material3.lightColorScheme
104
import androidx.compose.runtime.Composable
11-
import androidx.compose.ui.platform.LocalContext
5+
import androidx.compose.runtime.CompositionLocalProvider
6+
import androidx.compose.runtime.ReadOnlyComposable
7+
import com.threegap.bitnagil.designsystem.color.BitnagilColors
8+
import com.threegap.bitnagil.designsystem.color.LocalBitnagilColors
9+
import com.threegap.bitnagil.designsystem.color.bitnagilColorsDark
10+
import com.threegap.bitnagil.designsystem.color.bitnagilColorsLight
11+
import com.threegap.bitnagil.designsystem.typography.BitnagilTypography
12+
import com.threegap.bitnagil.designsystem.typography.LocalBitnagilTypography
1213

13-
private val DarkColorScheme =
14-
darkColorScheme(
15-
primary = Purple80,
16-
secondary = PurpleGrey80,
17-
tertiary = Pink80,
18-
)
14+
object BitnagilTheme {
15+
val colors: BitnagilColors
16+
@Composable
17+
@ReadOnlyComposable
18+
get() = LocalBitnagilColors.current
1919

20-
private val LightColorScheme =
21-
lightColorScheme(
22-
primary = Purple40,
23-
secondary = PurpleGrey40,
24-
tertiary = Pink40,
25-
)
20+
val typography: BitnagilTypography
21+
@Composable
22+
@ReadOnlyComposable
23+
get() = LocalBitnagilTypography.current
24+
}
2625

2726
@Composable
2827
fun BitnagilTheme(
2928
darkTheme: Boolean = isSystemInDarkTheme(),
30-
// Dynamic color is available on Android 12+
31-
dynamicColor: Boolean = true,
3229
content: @Composable () -> Unit,
3330
) {
34-
val colorScheme =
35-
when {
36-
dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
37-
val context = LocalContext.current
38-
if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
39-
}
40-
41-
darkTheme -> DarkColorScheme
42-
else -> LightColorScheme
43-
}
31+
val colors = when {
32+
darkTheme -> bitnagilColorsDark()
33+
else -> bitnagilColorsLight()
34+
}
4435

45-
MaterialTheme(
46-
colorScheme = colorScheme,
47-
typography = Typography,
36+
CompositionLocalProvider(
37+
LocalBitnagilTypography provides LocalBitnagilTypography.current,
38+
LocalBitnagilColors provides colors,
4839
content = content,
4940
)
5041
}

‎core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/Type.kt‎

Lines changed: 0 additions & 19 deletions
This file was deleted.

‎core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/color/BitnagilColors.kt‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
package com.threegap.bitnagil.designsystem.color
2+
3+
import androidx.compose.runtime.Immutable
4+
import androidx.compose.runtime.staticCompositionLocalOf
5+
import androidx.compose.ui.graphics.Color
6+
7+
@Immutable
8+
data class BitnagilColors(
9+
val white: Color = White,
10+
val black: Color = Black,
11+
val kakao: Color = Kakao,
12+
val error: Color = Error,
13+
val emotionHappy: Color = EmotionHappy,
14+
val emotionLethargy: Color = EmotionLethargy,
15+
val emotionLonely: Color = EmotionLonely,
16+
val emotionSad: Color = EmotionSad,
17+
val emotionAnxiety: Color = EmotionAnxiety,
18+
val coolGray99: Color = CoolGray99,
19+
val coolGray98: Color = CoolGray98,
20+
val coolGray97: Color = CoolGray97,
21+
val coolGray96: Color = CoolGray96,
22+
val coolGray95: Color = CoolGray95,
23+
val coolGray90: Color = CoolGray90,
24+
val coolGray80: Color = CoolGray80,
25+
val coolGray70: Color = CoolGray70,
26+
val coolGray60: Color = CoolGray60,
27+
val coolGray50: Color = CoolGray50,
28+
val coolGray40: Color = CoolGray40,
29+
val coolGray30: Color = CoolGray30,
30+
val coolGray20: Color = CoolGray20,
31+
val coolGray10: Color = CoolGray10,
32+
val navy900: Color = Navy900,
33+
val navy800: Color = Navy800,
34+
val navy700: Color = Navy700,
35+
val navy600: Color = Navy600,
36+
val navy500: Color = Navy500,
37+
val navy400: Color = Navy400,
38+
val navy300: Color = Navy300,
39+
val navy200: Color = Navy200,
40+
val navy100: Color = Navy100,
41+
val navy50: Color = Navy50,
42+
val lightBlue900: Color = LightBlue900,
43+
val lightBlue800: Color = LightBlue800,
44+
val lightBlue700: Color = LightBlue700,
45+
val lightBlue600: Color = LightBlue600,
46+
val lightBlue500: Color = LightBlue500,
47+
val lightBlue400: Color = LightBlue400,
48+
val lightBlue300: Color = LightBlue300,
49+
val lightBlue200: Color = LightBlue200,
50+
val lightBlue100: Color = LightBlue100,
51+
val lightBlue75: Color = LightBlue75,
52+
val lightBlue50: Color = LightBlue50,
53+
val orange900: Color = Orange900,
54+
val orange800: Color = Orange800,
55+
val orange700: Color = Orange700,
56+
val orange600: Color = Orange600,
57+
val orange500: Color = Orange500,
58+
val orange400: Color = Orange400,
59+
val orange300: Color = Orange300,
60+
val orange200: Color = Orange200,
61+
val orange100: Color = Orange100,
62+
val orange50: Color = Orange50,
63+
)
64+
65+
internal fun bitnagilColorsLight(): BitnagilColors = BitnagilColors()
66+
internal fun bitnagilColorsDark(): BitnagilColors = BitnagilColors()
67+
68+
internal val LocalBitnagilColors = staticCompositionLocalOf { bitnagilColorsLight() }

‎core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/color/Color.kt‎

Lines changed: 64 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,64 @@
1+
package com.threegap.bitnagil.designsystem.color
2+
3+
import androidx.compose.ui.graphics.Color
4+
5+
val White = Color(0xFFFFFFFF)
6+
val Black = Color(0xFF000000)
7+
val Kakao = Color(0xFFFEE500)
8+
val Error = Color(0xFFFF6868)
9+
val EmotionHappy = Color(0xFFFBE0AB)
10+
val EmotionLethargy = Color(0xFFFFC0A1)
11+
val EmotionLonely = Color(0xFFC8C1DE)
12+
val EmotionSad = Color(0xFFA9B9FF)
13+
val EmotionAnxiety = Color(0xFF96D8AD)
14+
15+
val CoolGray99 = Color(0xFFF7F7F8)
16+
val CoolGray98 = Color(0xFFF4F4F5)
17+
val CoolGray97 = Color(0xFFEAEBEC)
18+
val CoolGray96 = Color(0xFFE1E2E4)
19+
val CoolGray95 = Color(0xFFDBDCDF)
20+
val CoolGray90 = Color(0xFFC2C4C8)
21+
val CoolGray80 = Color(0xFFAEB0B6)
22+
val CoolGray70 = Color(0xFF989BA2)
23+
val CoolGray60 = Color(0xFF878A93)
24+
val CoolGray50 = Color(0xFF70737C)
25+
val CoolGray40 = Color(0xFF5A5C63)
26+
val CoolGray30 = Color(0xFF46474C)
27+
val CoolGray20 = Color(0xFF292A2D)
28+
val CoolGray10 = Color(0xFF171719)
29+
val CoolGray7 = Color(0xFF0F0F10)
30+
val CoolGray5 = Color(0xFF0F0F10)
31+
32+
val Navy900 = Color(0xFF050B1B)
33+
val Navy800 = Color(0xFF070F24)
34+
val Navy700 = Color(0xFF09132E)
35+
val Navy600 = Color(0xFF0C193B)
36+
val Navy500 = Color(0xFF0D1B41)
37+
val Navy400 = Color(0xFF3D4967)
38+
val Navy300 = Color(0xFF5D6680)
39+
val Navy200 = Color(0xFF9096A8)
40+
val Navy100 = Color(0xFFB4B8C4)
41+
val Navy50 = Color(0xFFE7E8EC)
42+
43+
val LightBlue900 = Color(0xFF47576B)
44+
val LightBlue800 = Color(0xFF5D728C)
45+
val LightBlue700 = Color(0xFF7894B5)
46+
val LightBlue600 = Color(0xFF9ABDE8)
47+
val LightBlue500 = Color(0xFFA9D0FF)
48+
val LightBlue400 = Color(0xFFBAD9FF)
49+
val LightBlue300 = Color(0xFFC5E0FF)
50+
val LightBlue200 = Color(0xFFD7E9FF)
51+
val LightBlue100 = Color(0xFFE4F0FF)
52+
val LightBlue75 = Color(0xFFF0F7FF)
53+
val LightBlue50 = Color(0xFFF6FAFF)
54+
55+
val Orange900 = Color(0xFF6B2F06)
56+
val Orange800 = Color(0xFF8C3D08)
57+
val Orange700 = Color(0xFFB54F0B)
58+
val Orange600 = Color(0xFFE8650E)
59+
val Orange500 = Color(0xFFFF6F0f)
60+
val Orange400 = Color(0xFFFF8C3F)
61+
val Orange300 = Color(0xFFFF9F5E)
62+
val Orange200 = Color(0xFFFFBD91)
63+
val Orange100 = Color(0xFFFFD2B5)
64+
val Orange50 = Color(0xFFFFF1E7)

‎core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/font/Font.kt‎

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
package com.threegap.bitnagil.designsystem.font
2+
3+
import androidx.compose.ui.text.font.Font
4+
import androidx.compose.ui.text.font.FontFamily
5+
import androidx.compose.ui.text.font.FontStyle
6+
import androidx.compose.ui.text.font.FontWeight
7+
import com.threegap.bitnagil.designsystem.R
8+
9+
val pretendard = FontFamily(
10+
Font(R.font.pretendard_black, FontWeight.Black, FontStyle.Normal),
11+
Font(R.font.pretendard_extra_bold, FontWeight.ExtraBold, FontStyle.Normal),
12+
Font(R.font.pretendard_bold, FontWeight.Bold, FontStyle.Normal),
13+
Font(R.font.pretendard_semi_bold, FontWeight.SemiBold, FontStyle.Normal),
14+
Font(R.font.pretendard_medium, FontWeight.Medium, FontStyle.Normal),
15+
Font(R.font.pretendard_regular, FontWeight.Normal, FontStyle.Normal),
16+
Font(R.font.pretendard_light, FontWeight.Light, FontStyle.Normal),
17+
Font(R.font.pretendard_extra_light, FontWeight.ExtraLight, FontStyle.Normal),
18+
Font(R.font.pretendard_thin, FontWeight.Thin, FontStyle.Normal),
19+
)

‎core/designsystem/src/main/java/com/threegap/bitnagil/designsystem/typography/BitnagilTextStyle.kt‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
package com.threegap.bitnagil.designsystem.typography
2+
3+
import androidx.compose.runtime.Composable
4+
import androidx.compose.ui.platform.LocalDensity
5+
import androidx.compose.ui.text.TextStyle
6+
import androidx.compose.ui.text.font.FontFamily
7+
import androidx.compose.ui.text.font.FontWeight
8+
import androidx.compose.ui.text.style.TextDecoration
9+
import androidx.compose.ui.unit.Density
10+
import androidx.compose.ui.unit.TextUnit
11+
import androidx.compose.ui.unit.dp
12+
import androidx.compose.ui.unit.sp
13+
14+
internal data class BitnagilTextStyle(
15+
val fontFamily: FontFamily,
16+
val fontWeight: FontWeight,
17+
val fontSize: Int,
18+
val lineHeight: Int,
19+
val letterSpacing: Float = 0f,
20+
val decoration: TextDecoration? = null,
21+
) {
22+
val toDpTextStyle: TextStyle
23+
@Composable get() =
24+
TextStyle(
25+
fontWeight = fontWeight,
26+
fontFamily = fontFamily,
27+
fontSize = fontSize.textDp,
28+
letterSpacing = letterSpacing.textDp,
29+
lineHeight = lineHeight.textDp,
30+
textDecoration = decoration,
31+
)
32+
33+
val toSpTextStyle: TextStyle
34+
@Composable get() =
35+
TextStyle(
36+
fontWeight = fontWeight,
37+
fontFamily = fontFamily,
38+
fontSize = fontSize.sp,
39+
letterSpacing = letterSpacing.sp,
40+
lineHeight = lineHeight.sp,
41+
textDecoration = decoration,
42+
)
43+
}
44+
45+
private fun Int.textDp(density: Density): TextUnit =
46+
with(density) {
47+
this@textDp.dp.toSp()
48+
}
49+
50+
private val Int.textDp: TextUnit
51+
@Composable get() = this.textDp(density = LocalDensity.current)
52+
53+
private fun Float.textDp(density: Density): TextUnit =
54+
with(density) {
55+
this@textDp.dp.toSp()
56+
}
57+
58+
private val Float.textDp: TextUnit
59+
@Composable get() = this.textDp(density = LocalDensity.current)

0 commit comments

Comments
 (0)