Skip to content
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.

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

Create examples #13

Open
naporin0624 opened this issue Feb 13, 2024 · 1 comment
Open

Create examples #13

naporin0624 opened this issue Feb 13, 2024 · 1 comment
Assignees
Labels
documentation Improvements or additions to documentation

Comments

@naporin0624
Copy link
Member

naporin0624 commented Feb 13, 2024

  • Create content comparing color-mix and alpha-blend in css
  • Write that it is valid to use with react-native.
  • Add Usage to README
@naporin0624
Copy link
Member Author

react-native cannot use css and mix-color is not present. Therefore, alpha-blend is valid.

const Button = () => {
  const style = ({ pressed }: PressableStateCallbackType) => {
    return StyleSheet.flatten(StyleSheet.compose([styles.button, pressed ? styles.pressed : undefined]))
  }
  
  return (
    <Pressable style={style}>
      <Text>press here!</Text>
    </Pressable>
  )
}

const styles = StyleSheet.create({
  button: {
    backgroundColor: buttonColor,
  },
  pressed: {
    backgroundColor: alphaBlend(buttonColor, OVERLAY_COLOR)
  }
})

@naporin0624 naporin0624 self-assigned this Feb 13, 2024
@naporin0624 naporin0624 added the documentation Improvements or additions to documentation label Feb 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation
Projects
None yet
Development

No branches or pull requests

1 participant