Skip to content

chore: remove global styles and CSS reset #556

@kurtdoherty

Description

@kurtdoherty

Context

  • Console Cloud has AngularJS-based UI rendered in the same document as Reapit Elements UI;
  • The AngularJS UI relies on styles that collide with Elements' stylesheet and the global CSS it applies;
  • We currently workaround this by manually "undoing" Elements' global style changes, but we do not want to maintain that kind of CSS.

Proposal

Elements should not need to reset user-agent styling because each individual class/component should apply the CSS it needs to render correctly, regardless of what other global CSS is applied by a consumer. So I'm proposing that:

  1. Elements moves it's global "CSS reset" styles to a separate stylesheet, @reapit/elements/reset.css;
  2. Elements components that have implicitly relied on these resets are updated to explicitly set the necessary CSS properties to display how they are intended to display; and,
  3. Consumers that implicitly rely on these resets can include the separate @reapit/elements/reset.css stylesheet prior to the standard Elements' stylesheet.

Metadata

Metadata

Assignees

Labels

housekeepingThe issue relates to a housekeeping task or chore

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions