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

Examples React Native #4263

Open
Wanderson77 opened this issue Feb 21, 2024 · 1 comment
Open

Examples React Native #4263

Wanderson77 opened this issue Feb 21, 2024 · 1 comment

Comments

@Wanderson77
Copy link

Hello devs, is there any example directory ready for React Native, or do we just have documentation to learn how to use this library?

Thanks!!!!

@mannoeu
Copy link

mannoeu commented Apr 18, 2024

Hello devs, is there any example directory ready for React Native, or do we just have documentation to learn how to use this library?

Thanks!!!!

It works exactly the same as styled-components for the web. The only difference is when creating styled components:

import styled from "styled-components/native";

export const MyButton = styled.TouchableOpacity`
  background-color: black;
  padding: 20px;
`;

You may need to use some CSS commands that only work for react native, such as margin-horizontal, padding-vertical, elevation etc. If you're using typescript-styled-plugin, add this code in jsconfig or tsconfig to prevent these CSS properties from reporting an error.

{
 "plugins": [
      {
        "name": "typescript-styled-plugin",
        "lint": {
          "validProperties": [
            "shadow-color",
            "shadow-opacity",
            "shadow-offset",
            "shadow-radius",
            "padding-horizontal",
            "padding-vertical",
            "margin-vertical",
            "margin-horizontal",
            "text-align-vertical",
            "tint-color",
            "elevation"
          ]
        }
      }
   ]
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants