Skip to content

Commit 3c4908b

Browse files
junseo511junseo511
authored
Merge pull request #543 from Team-WSS/feat/542
feat: 웹소소 컴포즈 대응 디자인 시스템 추가
2 parents 7148332 + 47515e1 commit 3c4908b

3 files changed

Lines changed: 261 additions & 0 deletions

File tree

‎app/src/main/java/com/into/websoso/designsystem/theme/Color.kt‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
package com.into.websoso.designsystem.theme
2+
3+
import androidx.compose.ui.geometry.Offset
4+
import androidx.compose.ui.graphics.Brush
5+
import androidx.compose.ui.graphics.Color
6+
7+
val Primary20 = Color(0xFFF5F7FF)
8+
val Primary50 = Color(0xFFF1EFFF)
9+
val Primary100 = Color(0xFF6A5DFD)
10+
val Primary200 = Color(0xFF240991)
11+
12+
val Secondary50 = Color(0xFFFFAA8F)
13+
val Secondary100 = Color(0xFFFF675D)
14+
15+
val White = Color(0xFFFFFFFF)
16+
val Gray20 = Color(0xFFFAFAFA)
17+
val Gray50 = Color(0xFFF4F5F8)
18+
val Gray70 = Color(0xFFDFDFE3)
19+
val Gray80 = Color(0xFFDDDDE3)
20+
val Gray100 = Color(0xFFCBCBD1)
21+
val Gray200 = Color(0xFFAEADB3)
22+
val Gray300 = Color(0xFF52515F)
23+
val Black = Color(0xFF111118)
24+
25+
val GrayToast = Color(0xCC394258)
26+
val Black60 = Color(0x99000000)
27+
val Warning = Color(0xFFFF675D)
28+
29+
val Transparent = Color(0x00000000)
30+
31+
val BgGradientGray = Brush.linearGradient(
32+
colors = listOf(
33+
Color(0xCC070A25),
34+
Color(0xFF000215),
35+
),
36+
start = Offset(0f, 0f),
37+
end = Offset(0f, Float.POSITIVE_INFINITY),
38+
)
39+
40+
val BgSelectedGradient = Brush.linearGradient(
41+
colors = listOf(
42+
Color(0xFF6341F0),
43+
Color(0xFFAD00FF),
44+
),
45+
start = Offset(0f, 0f),
46+
end = Offset(0f, Float.POSITIVE_INFINITY),
47+
)

‎app/src/main/java/com/into/websoso/designsystem/theme/Theme.kt‎

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
package com.into.websoso.designsystem.theme
2+
3+
import android.os.Build
4+
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
10+
import androidx.compose.runtime.Composable
11+
import androidx.compose.runtime.CompositionLocalProvider
12+
import androidx.compose.runtime.remember
13+
import androidx.compose.runtime.staticCompositionLocalOf
14+
import androidx.compose.ui.platform.LocalContext
15+
16+
private val DarkColorScheme = darkColorScheme(
17+
primary = Primary100,
18+
onPrimary = White,
19+
primaryContainer = Primary200,
20+
onPrimaryContainer = Gray20,
21+
secondary = Secondary100,
22+
onSecondary = White,
23+
secondaryContainer = Secondary50,
24+
onSecondaryContainer = Gray50,
25+
tertiary = Gray300,
26+
onTertiary = White,
27+
background = Black,
28+
onBackground = Gray20,
29+
surface = Gray80,
30+
onSurface = Gray200,
31+
error = Warning,
32+
onError = White,
33+
)
34+
35+
private val LightColorScheme = lightColorScheme(
36+
primary = Primary100,
37+
onPrimary = White,
38+
primaryContainer = Primary50,
39+
onPrimaryContainer = Gray20,
40+
secondary = Secondary100,
41+
onSecondary = White,
42+
secondaryContainer = Secondary50,
43+
onSecondaryContainer = Gray50,
44+
tertiary = Gray300,
45+
onTertiary = Black,
46+
background = White,
47+
onBackground = Gray300,
48+
surface = Gray20,
49+
onSurface = Gray70,
50+
error = Warning,
51+
onError = White,
52+
)
53+
54+
private val LocalWebsosoTypography = staticCompositionLocalOf<WebsosoTypography> {
55+
error("No WebsosoTypography Provided")
56+
}
57+
58+
object WebsosoTheme {
59+
val typography: WebsosoTypography
60+
@Composable get() = LocalWebsosoTypography.current
61+
}
62+
63+
@Composable
64+
fun ProvideWebsosoTypography(typography: WebsosoTypography, content: @Composable () -> Unit) {
65+
val provideTypography = remember { typography.copy() }
66+
provideTypography.update(typography)
67+
CompositionLocalProvider(
68+
LocalWebsosoTypography provides provideTypography,
69+
content = content,
70+
)
71+
}
72+
73+
@Composable
74+
fun WebsosoTheme(
75+
darkTheme: Boolean = isSystemInDarkTheme(),
76+
dynamicColor: Boolean = true,
77+
content: @Composable () -> Unit,
78+
) {
79+
val colorScheme =
80+
when {
81+
dynamicColor && Build.VERSION.SDK_INT >= Build.VERSION_CODES.S -> {
82+
val context = LocalContext.current
83+
if (darkTheme) dynamicDarkColorScheme(context) else dynamicLightColorScheme(context)
84+
}
85+
86+
darkTheme -> DarkColorScheme
87+
else -> LightColorScheme
88+
}
89+
val typography = websosoTypography()
90+
91+
ProvideWebsosoTypography(typography) {
92+
MaterialTheme(
93+
colorScheme = colorScheme,
94+
content = content,
95+
)
96+
}
97+
}

‎app/src/main/java/com/into/websoso/designsystem/theme/Type.kt‎

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
package com.into.websoso.designsystem.theme
2+
3+
import androidx.compose.runtime.Composable
4+
import androidx.compose.runtime.Stable
5+
import androidx.compose.runtime.getValue
6+
import androidx.compose.runtime.mutableStateOf
7+
import androidx.compose.runtime.setValue
8+
import androidx.compose.ui.platform.LocalDensity
9+
import androidx.compose.ui.text.TextStyle
10+
import androidx.compose.ui.text.font.Font
11+
import androidx.compose.ui.text.font.FontFamily
12+
import androidx.compose.ui.text.font.FontWeight
13+
import androidx.compose.ui.unit.Dp
14+
import androidx.compose.ui.unit.dp
15+
import com.into.websoso.R
16+
17+
val PretendardBold = FontFamily(Font(R.font.pretendard_bold, FontWeight.Bold))
18+
val PretendardSemiBold = FontFamily(Font(R.font.pretendard_semibold, FontWeight.SemiBold))
19+
val PretendardMedium = FontFamily(Font(R.font.pretendard_medium, FontWeight.Medium))
20+
val PretendardRegular = FontFamily(Font(R.font.pretendard_regular, FontWeight.Normal))
21+
22+
@Stable
23+
class WebsosoTypography internal constructor(
24+
headline: TextStyle,
25+
title1: TextStyle,
26+
title2: TextStyle,
27+
body1: TextStyle,
28+
body2: TextStyle,
29+
body3: TextStyle,
30+
caption: TextStyle,
31+
button: TextStyle,
32+
label: TextStyle,
33+
) {
34+
var headline: TextStyle by mutableStateOf(headline)
35+
private set
36+
var title1: TextStyle by mutableStateOf(title1)
37+
private set
38+
var title2: TextStyle by mutableStateOf(title2)
39+
private set
40+
var body1: TextStyle by mutableStateOf(body1)
41+
private set
42+
var body2: TextStyle by mutableStateOf(body2)
43+
private set
44+
var body3: TextStyle by mutableStateOf(body3)
45+
private set
46+
var caption: TextStyle by mutableStateOf(caption)
47+
private set
48+
var button: TextStyle by mutableStateOf(button)
49+
private set
50+
var label: TextStyle by mutableStateOf(label)
51+
private set
52+
53+
fun copy(
54+
headline: TextStyle = this.headline,
55+
title1: TextStyle = this.title1,
56+
title2: TextStyle = this.title2,
57+
body1: TextStyle = this.body1,
58+
body2: TextStyle = this.body2,
59+
body3: TextStyle = this.body3,
60+
caption: TextStyle = this.caption,
61+
button: TextStyle = this.button,
62+
label: TextStyle = this.label,
63+
): WebsosoTypography = WebsosoTypography(
64+
headline,
65+
title1,
66+
title2,
67+
body1,
68+
body2,
69+
body3,
70+
caption,
71+
button,
72+
label,
73+
)
74+
75+
fun update(other: WebsosoTypography) {
76+
headline = other.headline
77+
title1 = other.title1
78+
title2 = other.title2
79+
body1 = other.body1
80+
body2 = other.body2
81+
body3 = other.body3
82+
caption = other.caption
83+
button = other.button
84+
label = other.label
85+
}
86+
}
87+
88+
@Composable
89+
fun websosoTypography(): WebsosoTypography {
90+
val density = LocalDensity.current
91+
92+
fun textStyle(
93+
fontFamily: FontFamily,
94+
fontWeight: FontWeight,
95+
fontSizeDp: Dp,
96+
lineHeightDp: Dp,
97+
): TextStyle {
98+
return TextStyle(
99+
fontFamily = fontFamily,
100+
fontWeight = fontWeight,
101+
fontSize = with(density) { fontSizeDp.toSp() },
102+
lineHeight = with(density) { lineHeightDp.toSp() },
103+
)
104+
}
105+
106+
return WebsosoTypography(
107+
headline = textStyle(PretendardBold, FontWeight.Bold, 24.dp, 32.dp),
108+
title1 = textStyle(PretendardSemiBold, FontWeight.SemiBold, 20.dp, 28.dp),
109+
title2 = textStyle(PretendardMedium, FontWeight.Medium, 18.dp, 25.dp),
110+
body1 = textStyle(PretendardRegular, FontWeight.Normal, 16.dp, 24.dp),
111+
body2 = textStyle(PretendardRegular, FontWeight.Normal, 14.dp, 21.dp),
112+
body3 = textStyle(PretendardRegular, FontWeight.Normal, 12.dp, 18.dp),
113+
caption = textStyle(PretendardRegular, FontWeight.Normal, 10.dp, 15.dp),
114+
button = textStyle(PretendardBold, FontWeight.Bold, 14.dp, 20.dp),
115+
label = textStyle(PretendardSemiBold, FontWeight.SemiBold, 13.dp, 19.dp),
116+
)
117+
}

0 commit comments

Comments
 (0)