Skip to content
This repository has been archived by the owner on Mar 4, 2020. It is now read-only.

feat(Input): add placeholderColor variable for Teams theme #1092

Merged
merged 2 commits into from
Mar 22, 2019
Merged

feat(Input): add placeholderColor variable for Teams theme #1092

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
962a160
feat(Input): add `placeholderColor` variable for Teams theme
layershifter Mar 22, 2019
e1c9987
Merge branches 'feat/placeholder-value' and 'master' of https://githu…
layershifter Mar 22, 2019
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
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,6 +32,7 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm

### Features
- Add `Alert` component @Bugaa92 ([#1063](https://github.com/stardust-ui/react/pull/1063))
- Add `placeholderColor` variable for `Input` component in Teams theme @layershifter ([#1092](https://github.com/stardust-ui/react/pull/1092))

<!--------------------------------[ v0.23.1 ]------------------------------- -->
## [v0.23.1](https://github.com/stardust-ui/react/tree/v0.23.1) (2019-03-13)
Expand Down
2 changes: 1 addition & 1 deletion packages/react/src/themes/teams/components/Input/inputStyles.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ const inputStyles: ComponentSlotStylesInput<InputProps, InputVariables> = {
...(p.fluid && { width: '100%' }),
...(p.inline && { float: 'left' }),
'::placeholder': {
color: v.fontColor,
color: v.placeholderColor,
},
':focus': {
borderBottomColor: v.inputFocusBorderBottomColor,
Expand Down
3 changes: 3 additions & 0 deletions packages/react/src/themes/teams/components/Input/inputVariables.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export interface InputVariables {
inputPadding: string
inputFocusBorderBottomColor: string
inputFocusBorderRadius: string
placeholderColor: string
}

export default (siteVars): InputVariables => ({
Expand All @@ -35,4 +36,6 @@ export default (siteVars): InputVariables => ({
inputPadding: `${pxToRem(7)} ${pxToRem(12)}`,
inputFocusBorderBottomColor: siteVars.colors.primary[500],
inputFocusBorderRadius: `${pxToRem(3)} ${pxToRem(3)} ${pxToRem(2)} ${pxToRem(2)}`,

placeholderColor: siteVars.gray02,
})