corbado/javascript

Reset general stylings from parent in Corbado UI components

Closed this issue · 2 comments

Aby-JS commented

Describe the bug
When there are stylings applied for general components like anchors, buttons, etc applied generally in the application using Corbado authentication components, then the stylings are inherited by our components as well. Investigate the following two points:

  1. Is it possible to reset stylings for general HTML elements from parent
  2. If the Clerk resets the stylings?

To Reproduce
Steps to reproduce the behavior:
To check for Clerk's components behaviors please add stylings for general elements in an application which renders Clerk's components and check if it inherits those stylings.

Expected behavior

  • If it is possible to reset stylings and add the missing functionality in our components. If not then state findings.
  • Verify if the Clerk's components are affected by application's stylings.
Aby-JS commented

Answer after detailed research:

  1. We cannot reset styles entirely. There are CSS reset libraries which we can use like normalize.css but they are for cross-browser styling consistency and not resetting parent stylings. This is not possible.
  2. Clerk also inherits stylings from parents
Aby-JS commented

Also, for reference, Cross-Browser styling consistency is not a big issue anymore as most of the famously used browser's now have similar default stylings and our components have been tested already on all of those browser. Any styling issues found have already been fixed without using any third party library.