Skip to content

[BUG] Styles set in theme.css are applied to any project using this library #86

@parmvirthind

Description

@parmvirthind

Describe the bug
In theme.css we define base styles for the component library using :root. When this library is installed into a project, these styles will apply to the :root of that project.

To Reproduce
This library uses a base font-size of 14px. We'll use the steps below to show that gets applied to the entire web app.

  1. Create a new web app, or use a pre-existing one where you can install this library.
  2. Note the value of 1rem in the web app. This can be done by setting the font-size of some text to 1rem and inspecting it using dev tools. This will probably be 16px as that is the default for most apps. (See screenshot on where to find the pixel value for the font-size for the text). If for some reason this value is 14px this example to reproduce this issue will not work.
  3. Install this library into the project
  4. Inspect the same text, and note that the font-size is now 14px.
Image

Expected behaviour
It would be expected that installing this library would not affect any styling outside of the components in this library.

Desktop (please complete the following information):

  • OS: MacOS
  • Browser Chrome

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions