grafana / oncall

Developer-friendly incident response with brilliant Slack integration
GNU Affero General Public License v3.0
3.32k stars 262 forks source link

OnCall Grafana Plugin: Please namespace your css custom properties #4088

Open jackw opened 3 months ago

jackw commented 3 months ago

What would you like to see!

Currently the usage of css custom properties are set on the root element and use the theme-light and theme-dark classes. Due to the nature of css custom properties these are globals and could conflict with anything else that sets a css custom property with the same name.

I think it would be worth considering namespaces for your custom properties to either a classname that wraps all usage or a prefix to the custom property names themselves to avoid conflicts with other plugins or Grafana itself (if it ever starts using css custom properties).

e.g.

.grafana-oncall-app {
  --opacity: 0.5;
}

.theme-light .grafana-oncall-app {
  --opacity: 1;
}

or

:root {
  --oncall-app__opacity: 0.5;
}

.theme-light {
  --oncall-app__opacity: 1;
}

Product Area

Other

Anything else to add?

No response

github-actions[bot] commented 3 months ago

The current version of Grafana OnCall, at the time this issue was opened, is v1.3.112. If your issue pertains to an older version of Grafana OnCall, please be sure to list it in the PR description. Thank you :smile:!