Skip to content

Commit

Permalink
feat(odyssey-react): withTheme for Text
Browse files Browse the repository at this point in the history
BREAKING CHANGE: Text prop fontWeight "regular" renamed to "normal"

BREAKING CHANGE: Text props color "heading" "danger-disabled" and "code" removed

BREAKING CHANGE: Text prop fontSize "lede" removed

BREAKING CHANGE: Text props textTransform "full-width" and "full-size-kana" removed

BREAKING CHANGE: Text prop lineHeight "font" removed

BREAKING CHANGE: Text prop overflowWrap "anywhere" removed
  • Loading branch information
Jeff Belser committed Jan 20, 2022
1 parent 3a34cd6 commit 83ddd3f
Show file tree
Hide file tree
Showing 13 changed files with 249 additions and 198 deletions.
5 changes: 4 additions & 1 deletion packages/odyssey-design-tokens/src/color/border.json
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,10 @@
"base": { "value": "{color.danger.base.value}" },
"dark": { "value": "{color.danger.dark.value}" }
},
"primary": { "value": "{color.primary.base.value}" }
"primary": {
"base": { "value": "{color.primary.base.value}" },
"dark": { "value": "{color.primary.dark.value}" }
}
}
}
}
2 changes: 1 addition & 1 deletion packages/odyssey-design-tokens/src/color/text.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
"value": "{color.primary.base.value}"
},
"danger": { "value": "{color.danger.base.value}" },
"dangerDisabled": { "value": "{color.danger.light.value}" }
"sub": { "value": "{color.neutral.base.value}" }
}
}
}
1 change: 0 additions & 1 deletion packages/odyssey-design-tokens/src/font.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,6 @@
}
},
"size": {
"base": { "value": "16px" },
"body": { "value": "1rem" },
"caption": { "value": "0.871rem" },
"heading6": { "value": "1rem" },
Expand Down
4 changes: 2 additions & 2 deletions packages/odyssey-react/src/components/Box/Box.theme.ts
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ export const theme: ThemeReducer = (theme) => ({
FontFamilyBase: theme.FontFamilyBase,
FontWeightNormal: theme.FontWeightNormal,
FontStyleNormal: theme.FontStyleNormal,
FontSizeBase: theme.FontSizeBase,
FontSize: theme.FontSizeBody,
FontLineHeightBase: theme.FontLineHeightBase,
ColorTextBody: theme.ColorTextBody,

Expand All @@ -36,7 +36,7 @@ export const theme: ThemeReducer = (theme) => ({
ColorBorderBase: "transparent",
ColorBorderUi: theme.ColorBorderUi,
ColorBorderDisplay: theme.ColorBorderDisplay,
ColorBorderPrimary: theme.ColorBorderPrimary,
ColorBorderPrimary: theme.ColorBorderPrimaryBase,
ColorBorderDanger: theme.ColorBorderDangerBase,

// Focus Outline
Expand Down
2 changes: 1 addition & 1 deletion packages/odyssey-react/src/components/Box/_box-text.scss
Original file line number Diff line number Diff line change
Expand Up @@ -35,7 +35,7 @@
}

.fontSizeBase {
font-size: var(--FontSizeBase);
font-size: var(--FontSize);
}

.fontSizeInherit {
Expand Down
4 changes: 2 additions & 2 deletions packages/odyssey-react/src/components/Button/Button.theme.ts
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ export const theme: ThemeReducer = (theme) => ({
ColorBackgroundPrimaryHover: theme.ColorPrimaryDark,
ColorBorderPrimary: "transparent",
ColorBorderPrimaryDisabled: "transparent",
ColorBorderPrimaryHover: theme.ColorPrimaryDark,
ColorBorderPrimaryHover: theme.ColorBorderPrimaryDark,
Gutter: theme.SpaceRemS,

// Secondary Variant
Expand Down Expand Up @@ -93,7 +93,7 @@ const root: ThemeReducer = (theme) => ({
ColorText: theme.ColorTextBodyInverse,
FontFamily: theme.FontFamilyBase,
FontLineHeight: theme.FontLineHeightBase,
FontSize: theme.FontSizeBase,
FontSize: theme.FontSizeBody,
FontWeight: theme.FontWeightBold,
FontWhiteSpace: "nowrap",

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export const theme: ThemeReducer = (theme) => ({
FocusOutlineWidth: theme.FocusOutlineWidthSmall,
MarginBlockEnd: theme.SpaceRemXs,
LabelPaddingInlineStart: theme.SpaceEmS,
FontSize: theme.FontSizeBase,
FontSize: theme.FontSizeBody,
FontWeight: theme.FontWeightNormal,
BorderRadius: theme.BorderRadiusBase,
BoxSize: "1em",
Expand Down
6 changes: 2 additions & 4 deletions packages/odyssey-react/src/components/Field/Field.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -133,15 +133,13 @@ function Label(props: LabelProps) {
alignItems="flex-end"
justifyContent="space-between"
>
<Text color="heading" fontWeight="bold">
{children}
</Text>
<Text fontWeight="bold">{children}</Text>
{!required && optionalLabel && (
<span className={styles.optionalLabel}>
<Text
color="sub"
fontSize="caption"
fontWeight="regular"
fontWeight="normal"
lineHeight="normal"
>
{optionalLabel}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@ export const theme: ThemeReducer = (theme) => ({
ColorTextInvalid: theme.ColorTextDanger,
MarginBlockEnd: theme.SpaceRemXs,
LabelPaddingInlineStart: theme.SpaceEmS,
FontSize: theme.FontSizeBase,
FontSize: theme.FontSizeBody,
FontWeight: theme.FontWeightNormal,
CircleSize: "1em",
BorderSize: "2px",
Expand Down
Loading

0 comments on commit 83ddd3f

Please sign in to comment.