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

getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } } by creating a project using yarn create-expo-app -e with-router-tailwind #461

Open
NoobMahbub opened this issue Jan 24, 2024 · 1 comment

Comments

@NoobMahbub
Copy link

NoobMahbub commented Jan 24, 2024

Describe the bug
created a new project with yarn create expo -e with-router-tailwind and run with yarn start, after that getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } }

Here is the repo url: https://github.com/expo/examples/tree/master/with-router-tailwind

To Reproduce

you should fix the issues with shadow property

Expected behavior
It should add shadow to explore button but it is not adding

Screenshots

image

Desktop (please complete the following information):

  • OS: Windows

Smartphone (please complete the following information):

  • Device: Realme Narzo 50
  • OS: Linux

Additional context
created a new project with yarn create expo -e with-router-tailwind and run with yarn start, after that getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } }

I have found that it is because of shadow style of Explore button

        ```<Link
            suppressHighlighting
            className="flex h-9 items-center justify-center overflow-hidden rounded-md bg-gray-900 px-4 py-2 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-gray-900/90 active:bg-gray-400/90 web:focus-visible:outline-none web:focus-visible:ring-1 focus-visible:ring-gray-950 disabled:pointer-events-none disabled:opacity-50 dark:bg-gray-50 dark:text-gray-900 dark:hover:bg-gray-50/90 dark:focus-visible:ring-gray-300"
            href="#"
          >
            Explore
          </Link>```

Here is the repo url: https://github.com/expo/examples/tree/master/with-router-tailwind

When I click on this button I can see this error on my terminal
Also I checked with shadow-lg but same error and no effect on the button

@NoobMahbub NoobMahbub changed the title getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } } getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } } by creating a project using npx create-expo-app -e with-router-tailwind Jan 24, 2024
@NoobMahbub NoobMahbub changed the title getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } } by creating a project using npx create-expo-app -e with-router-tailwind getting this ERROR Warning: You are setting the style { shadowOffset: ... } as a prop. You should nest it in a style object. E.g. { style: { shadowOffset: ... } } by creating a project using yarn create-expo-app -e with-router-tailwind Jan 24, 2024
@fahad-islam
Copy link

+1 same issue

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