Skip to content

chore: design-tokens 자동 반영 #68

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Roy-wonji wants to merge 1 commit into
base: dev
Choose a base branch
from
Open

chore: design-tokens 자동 반영 #68

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 14 additions & 11 deletions app/src/main/java/com/picke/app/ui/theme/tokens/BrandColorTokens.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,6 @@ object BrandColorTokens {
val primary700: Color = Color(0xFF71372A)
val primary800: Color = Color(0xFF653226)
val primary900: Color = Color(0xFF4E2A21)
val primaryAlpha8: Color = Color(0xFF893825)
val secondary50: Color = Color(0xFFFCF8F1)
val secondary100: Color = Color(0xFFF9F1E3)
val secondary200: Color = Color(0xFFF3E3C7)
Expand All @@ -35,14 +34,18 @@ object BrandColorTokens {
val beige700: Color = Color(0xFFDAD1BF)
val beige800: Color = Color(0xFFCEC1A8)
val beige900: Color = Color(0xFFB7A88B)
val neutral50: Color = Color(0xFFEBEBEB)
val neutral100: Color = Color(0xFFD7D7D7)
val neutral200: Color = Color(0xFFB0AFAE)
val neutral300: Color = Color(0xFF888786)
val neutral400: Color = Color(0xFF615F5D)
val neutral500: Color = Color(0xFF393735)
val neutral600: Color = Color(0xFF2B2A28)
val neutral700: Color = Color(0xFF222120)
val neutral800: Color = Color(0xFF1A1918)
val neutral900: Color = Color(0xFF131212)
val gray50: Color = Color(0xFFEBEBEB)
val gray100: Color = Color(0xFFD7D7D7)
val gray200: Color = Color(0xFFB0AFAE)
val gray300: Color = Color(0xFF888786)
val gray400: Color = Color(0xFF615F5D)
val gray500: Color = Color(0xFF393735)
val gray600: Color = Color(0xFF2B2A28)
val gray700: Color = Color(0xFF222120)
val gray800: Color = Color(0xFF1A1918)
val gray900: Color = Color(0xFF131212)
val errorDefault: Color = Color(0xFFC92D33)
val errorAlpha: Color = Color(0x66C92D33)
val warningDefault: Color = Color(0xFFFFB400)
val warningSlpha: Color = Color(0x66FFB400)
}
93 changes: 72 additions & 21 deletions app/src/main/java/com/picke/app/ui/theme/tokens/ComponentColorTokens.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,29 +4,80 @@ package com.picke.app.ui.theme.tokens
import androidx.compose.ui.graphics.Color

object ComponentColorTokens {
val bedgeFilledBackgroundDefault: Color = Color(0xFFEFEAE0)
val bedgeFilledBackgroundInverse: Color = Color(0xFF893825)
val bedgeFilledTextDefault: Color = Color(0xFF893825)
val bedgeFilledTextInverse: Color = Color(0xFFFEFEFD)
val bedgeOutlineText: Color = Color(0xFF893825)
val bedgeOutlineBackround: Color = Color(0xFFFEFEFD)
val bedgeOutlineBorder: Color = Color(0xFFE7D7D3)
val inputBorderDefault: Color = Color(0xFFEFEAE0)
val inputBorderActive: Color = Color(0xFFDAD1BF)
val inputBorderError: Color = Color(0xFFC92D33)
val inputSurfaceDefault: Color = Color(0xFFFEFEFD)
val inputSurfaceDisabled: Color = Color(0xFFF9F7F2)
val inputTextDefault: Color = Color(0xFF888786)
val inputTextActive: Color = Color(0xFF393735)
val inputTextError: Color = Color(0xFFC92D33)
val avatarBackround: Color = Color(0xFFEFEAE0)
val buttonPrimaryBackgroundDefault: Color = Color(0xFF893825)
val buttonPrimaryBackgroundPressed: Color = Color(0xFF653226)
val buttonPrimaryBackgroundDisabled: Color = Color(0xFFD0AFA8)
val buttonPrimaryTextDefault: Color = Color(0xFFFEFEFD)
val buttonSecondaryBackgroundDefault: Color = Color(0xFFF9F7F2)
val buttonSecondaryBackgroundPressed: Color = Color(0xFFF7F4EE)
val buttonSecondaryBorderDefault: Color = Color(0xFFEFEAE0)
val buttonSecondaryBorderPressed: Color = Color(0xFFE1B974)
val buttonSecondaryTextDefault: Color = Color(0xFF2B2A28)
val buttonSecondaryTextDisabled: Color = Color(0xFF888786)
val buttonIconBackgroundDefault: Color = Color(0xFF893825)
val buttonIconBackgroundDisabled: Color = Color(0xFFD0AFA8)
val buttonSecondaryBackgroundDefault: Color = Color(0xFFFCF8F1)
val buttonSecondaryBackgroundPressed: Color = Color(0xFFEFEAE0)
val buttonSecondaryTextDefault: Color = Color(0xFF893825)
val badgeFilledBackground: Color = Color(0xFFEFEAE0)
val badgeFilledText: Color = Color(0xFF893825)
val badgeOutlineBackground: Color = Color(0xFFFEFEFD)
val badgeOutlineBorder: Color = Color(0xFFE7D7D3)
val badgeOutlineText: Color = Color(0xFF893825)
val badgePrimaryBackground: Color = Color(0xFF893825)
val badgePrimaryText: Color = Color(0xFFFEFEFD)
val badgeCounterBackground: Color = Color(0xFF393735)
val badgeCounterTextActive: Color = Color(0xFFFEFEFD)
val badgeCounterTextDefault: Color = Color(0xFF888786)
val chipBackgroundDefault: Color = Color(0xFF893825)
val chipBackgroundSelected: Color = Color(0xFFF3EBE9)
val chipBorderDefault: Color = Color(0xFF893825)
val chipTextDefault: Color = Color(0xFFFEFEFD)
val chipTextSelected: Color = Color(0xFF893825)
val toggleTrackOn: Color = Color(0xFF893825)
val toggleTrackOff: Color = Color(0xFFD7D7D7)
val toggleThumbDefault: Color = Color(0xFFFEFEFD)
val cardBaseBackgroundDefault: Color = Color(0xFFFEFEFD)
val cardBaseBackgroundBeige: Color = Color(0xFFF7F4EE)
val cardBaseBorderDefault: Color = Color(0xFFEFEAE0)
val cardBaseBorderSelected: Color = Color(0xFFE1B974)
val cardBaseBorderPrimary: Color = Color(0xFF893825)
val cardBaseTextTitle: Color = Color(0xFF393735)
val cardBaseTextDecription: Color = Color(0xFF888786)
val cardBaseTextBody: Color = Color(0xFF615F5D)
val cardBaseTextSecondary: Color = Color(0xFFE1B974)
val cardBaseTextPrimary: Color = Color(0xFF893825)
val cardBaseTextInverse: Color = Color(0xFFFEFEFD)
val cardGrayBackgroundDefault: Color = Color(0xFF222120)
val cardGrayBackgroundPressed: Color = Color(0xFF131212)
val cardGrayBorderSelected: Color = Color(0xFFE1B974)
val cardOpinionBackgroundDefault: Color = Color(0xFFF9F7F2)
val cardOpinionBackgroundPressed: Color = Color(0xFFF7F4EE)
val cardOpinionBorderDefault: Color = Color(0xFFEFEAE0)
val cardOpinionBorderPressed: Color = Color(0xFFE1B974)
val inputTextfieldBackgroundDefault: Color = Color(0xFFFEFEFD)
val inputTextfieldBackgroundDisabled: Color = Color(0xFFF7F4EE)
val inputTextfieldBorderDefault: Color = Color(0xFFEFEAE0)
val inputTextfieldBorderFocus: Color = Color(0xFFDAD1BF)
val inputTextfieldBorderError: Color = Color(0xFFE7D7D3)
val inputTextfieldTextDefault: Color = Color(0xFF888786)
val inputTextfieldTextFocus: Color = Color(0xFF393735)
val inputTextfieldTextError: Color = Color(0xFFC92D33)
val inputTextareaBackgroundDefault: Color = Color(0xFFFEFEFD)
val inputTextareaBackgroundDisabled: Color = Color(0xFFEFEAE0)
val inputTextareaTextDefault: Color = Color(0xFF888786)
val inputTextareaTextFocus: Color = Color(0xFF393735)
val inputTextareaTextError: Color = Color(0xFFC92D33)
val inputTextareaBorderError: Color = Color(0x66C92D33)
val navigationTabTextDefault: Color = Color(0xFF888786)
val navigationTabTextActive: Color = Color(0xFF893825)
val navigationTabBorderDefault: Color = Color(0xFFD7D7D7)
val navigationTabBorderActive: Color = Color(0xFF893825)
val popupBackground: Color = Color(0xFFF7F4EE)
val popupBorder: Color = Color(0xFF893825)
val popupText: Color = Color(0xFF1A1918)
val listItemAgreementBackgroundDefault: Color = Color(0xFFFAFAF9)
val listItemAgreementBorderDefault: Color = Color(0xFFEBEBEB)
val listItemAgreementBorderError: Color = Color(0x66C92D33)
val listItemAgreementTextDefualt: Color = Color(0xFF1A1918)
val listItemAgreementTextError: Color = Color(0xFFC92D33)
val checkboxBackgroundDefault: Color = Color(0xFFF3EBE9)
val checkboxBackgroundSelected: Color = Color(0xFF893825)
val checkboxBorderDefault: Color = Color(0xFFE7D7D3)
val checkboxBorderSelected: Color = Color(0xFF71372A)
}
74 changes: 73 additions & 1 deletion app/src/main/java/com/picke/app/ui/theme/tokens/ComponentNumberTokens.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,5 +5,77 @@ import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp

object ComponentNumberTokens {
val buttonRadius: Dp = 2.dp
val iconXs: Dp = 12.dp
val iconSm: Dp = 16.dp
val iconMd: Dp = 20.dp
val iconLg: Dp = 24.dp
val avatarSm: Dp = 36.dp
val avatarMd: Dp = 40.dp
val avatarLg: Dp = 68.dp
val controlSm: Dp = 28.dp
val controlMd: Dp = 52.dp
val gap0: Dp = 0.dp
val gap2: Dp = 2.dp
val gap4: Dp = 4.dp
val gap6: Dp = 6.dp
val gap8: Dp = 8.dp
val gap12: Dp = 12.dp
val gap16: Dp = 16.dp
val gap20: Dp = 20.dp
val gap24: Dp = 24.dp
val gap32: Dp = 32.dp
val gap40: Dp = 40.dp
val paddingScreenHorizontal: Dp = 16.dp
val paddingContainer8: Dp = 8.dp
val paddingContainer12: Dp = 12.dp
val paddingContainer16: Dp = 16.dp
val paddingContainer20: Dp = 20.dp
val paddingContainer24: Dp = 24.dp
val paddingContainer32: Dp = 32.dp
val paddingContainer40: Dp = 40.dp
val paddingComponent2: Dp = 2.dp
val paddingComponent4: Dp = 4.dp
val paddingComponent6: Dp = 6.dp
val paddingComponent8: Dp = 8.dp
val paddingComponent12: Dp = 12.dp
val paddingComponent16: Dp = 16.dp
val paddingButtonPrimaryLargeHorizontal: Dp = 12.dp
val paddingButtonPrimaryLargeVertical: Dp = 12.dp
val paddingButtonPrimaryMediumHorizontal: Dp = 12.dp
val paddingButtonPrimaryMediumVertical: Dp = 12.dp
val paddingButtonPrimarySmallHorizontal: Dp = 12.dp
val paddingButtonPrimarySmallVertical: Dp = 12.dp
val paddingChipHorizontal: Dp = 12.dp
val paddingChipVertical: Dp = 6.dp
val paddingBadgeHorizontal: Dp = 6.dp
val paddingBadgeVertical: Dp = 2.dp
val paddingCardBase: Dp = 16.dp
val paddingInputHorizontal: Dp = 8.dp
val paddingNavigationTabHorizontal: Dp = 12.dp
val paddingNavigationTabVertical: Dp = 12.dp
val paddingAppbarHorizontal: Dp = 16.dp
val paddingAppbarVertical: Dp = 12.dp
val borderWidthRegular: Dp = 1.dp
val borderWidthMedium: Dp = 1.5.dp
val borderWidthLarge: Dp = 4.dp
val buttonPrimaryLargeWidth: Dp = 343.dp
val buttonPrimaryLargeHeight: Dp = 52.dp
val buttonPrimaryMediumWidth: Dp = 343.dp
val buttonPrimaryMediumHeight: Dp = 42.dp
val buttonPrimarySmallWidth: Dp = 100.dp
val buttonPrimarySmallHeight: Dp = 42.dp
val buttonIconSize: Dp = 36.dp
val toggleThumbSize: Dp = 14.dp
val toggleWidth: Dp = 32.dp
val toggleHeight: Dp = 18.dp
val cardAvatarMd: Dp = 40.dp
val cardAvatarLg: Dp = 68.dp
val cardAvatarSm: Dp = 36.dp
val inputTextfieldWidth: Dp = 343.dp
val inputTextfieldHeight: Dp = 44.dp
val popupWidth: Dp = 393.dp
val thumbnailWidth: Dp = 196.dp
val thumbnailHeight: Dp = 140.dp
val checkboxWidth: Dp = 24.dp
val checkboxHeight: Dp = 24.dp
}
3 changes: 1 addition & 2 deletions app/src/main/java/com/picke/app/ui/theme/tokens/RadiusTokens.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,6 @@ import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp

object RadiusTokens {
val none: Dp = 0.dp
val default: Dp = 2.dp
val full: Dp = 999.dp
val max: Dp = 999.dp
}
67 changes: 41 additions & 26 deletions app/src/main/java/com/picke/app/ui/theme/tokens/SemanticColorTokens.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,32 +4,47 @@ package com.picke.app.ui.theme.tokens
import androidx.compose.ui.graphics.Color

object SemanticColorTokens {
val textPrimary: Color = Color(0xFF131212)
val textSecondary: Color = Color(0xFF222120)
val textTertiary: Color = Color(0xFF393735)
val textMuted: Color = Color(0xFF888786)
val textInverse: Color = Color(0xFFFEFEFD)
val textBrand: Color = Color(0xFF893825)
val borderDefault: Color = Color(0xFFEFEAE0)
val borderSubtle: Color = Color(0xFFDAD1BF)
val borderDisabled: Color = Color(0xFFF5F1EA)
val borderSelected: Color = Color(0xFFE1B974)
val borderStrong: Color = Color(0xFF893825)
val borderFocus: Color = Color(0xFFDAD1BF)
val borderError: Color = Color(0xFFC92D33)
val surfaceDefault: Color = Color(0xFFFEFEFD)
val surfaceSubtle: Color = Color(0xFFF9F7F2)
val surfaceTertiary: Color = Color(0xFFF7F4EE)
val surfaceSelected: Color = Color(0xFF893825)
val surfaceDisabled: Color = Color(0xFFD0AFA8)
val iconGrayDefault: Color = Color(0xFF131212)
val iconGraySubtle: Color = Color(0xFF888786)
val iconGrayInverse: Color = Color(0xFFFEFEFD)
val iconPrimaryDefault: Color = Color(0xFF893825)
val backgroundDefault: Color = Color(0xFFFAFAF9)
val backgroundSubtle: Color = Color(0xFFF5F5F4)
val backgroundTertiary: Color = Color(0xFFEBEBEB)
val backgroundBrand: Color = Color(0xFFFBF9F7)
val backgroundInverse: Color = Color(0xFF1A1918)
val backgroundOverlay: Color = Color(0xFF000000)
val statusErrorError: Color = Color(0xFFC92D33)
val statusErrorAlpha: Color = Color(0xFFC92D33)
val statusWarningWarning: Color = Color(0xFFFFB400)
val statusWarningAlpha: Color = Color(0xFFFFB400)
val backgroundSubtler: Color = Color(0xFFEBEBEB)
val backgroundBeige: Color = Color(0xFFFBF9F7)
val textDefault: Color = Color(0xFF1A1918)
val textSubtle: Color = Color(0xFF222120)
val textSubtler: Color = Color(0xFF393735)
val textMuted: Color = Color(0xFF888786)
val textInverse: Color = Color(0xFFFEFEFD)
val textPrimary: Color = Color(0xFF893825)
val textBody: Color = Color(0xFF615F5D)
val textSecondary: Color = Color(0xFFE1B974)
val textError: Color = Color(0xFFC92D33)
val borderBeigeSelected: Color = Color(0xFFDAD1BF)
val borderBeigeDisabled: Color = Color(0xFFF5F1EA)
val borderBeigeFocus: Color = Color(0xFFDAD1BF)
val borderBeigeDefault: Color = Color(0xFFEFEAE0)
val borderSecondarySelected: Color = Color(0xFFE1B974)
val borderPrimaryDefault: Color = Color(0xFF893825)
val borderErrorDefault: Color = Color(0x66C92D33)
val borderWarningDefault: Color = Color(0x66FFB400)
val borderGrayDefault: Color = Color(0xFFD7D7D7)
val borderGraySubtle: Color = Color(0xFFEBEBEB)
val surfaceBeigeDefault: Color = Color(0xFFFEFEFD)
val surfaceBeigeSubtle: Color = Color(0xFFF9F7F2)
val surfaceBeigeStrong: Color = Color(0xFFF7F4EE)
val surfacePrimaryDefault: Color = Color(0xFF893825)
val surfacePrimarySubtle: Color = Color(0xFFF3EBE9)
val actionPrimaryDefault: Color = Color(0xFF893825)
val actionPrimaryPressed: Color = Color(0xFF653226)
val actionPrimaryDisabled: Color = Color(0xFFD0AFA8)
val actionPrimarySubtle: Color = Color(0xFFE7D7D3)
val actionBeigeDefault: Color = Color(0xFFF9F7F2)
val actionBeigeSubtle: Color = Color(0xFFFEFEFD)
val actionBeigePressed: Color = Color(0xFFF7F4EE)
val actionBeigeStrong: Color = Color(0xFFEFEAE0)
val actionSecondaryDefault: Color = Color(0xFFFCF8F1)
val actionGrayDefault: Color = Color(0xFF222120)
val actionGrayPressed: Color = Color(0xFF131212)
}
5 changes: 4 additions & 1 deletion app/src/main/java/com/picke/app/ui/theme/tokens/SpacingTokens.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ import androidx.compose.ui.unit.dp

object SpacingTokens {
val s0: Dp = 0.dp
val s2: Dp = 2.dp
val s4: Dp = 4.dp
val s2: Dp = 2.dp
val s8: Dp = 8.dp
val s16: Dp = 16.dp
val s24: Dp = 24.dp
Expand All @@ -17,4 +17,7 @@ object SpacingTokens {
val s64: Dp = 64.dp
val s80: Dp = 80.dp
val s96: Dp = 96.dp
val s6: Dp = 6.dp
val s12: Dp = 12.dp
val s20: Dp = 20.dp
}