Ionic Rescript bindings

Not related to Rescript lol but using style in Ionic is a bit of anti-pattern. I see it in devs that are used to Tailwaind but in Ionic you are supposed to use regular CSS and often edit CSS variables.

The reason is because most components have shadow-elements and pseudo-elements that are not easy to theme with inline styles, and because style varies quite a lot between ios and md your inline changes might not look as good in both modes.

For example if you want to edit a button it should look like this:

/* Set the color on all ion-button elements */
ion-button {
  --color: #222;
}

And if you want to style a specific part of the shadow-tree it should be like this

ion-select::part(placeholder) {
  color: blue;
  opacity: 1;
}

I recommend avoiding inline styles and using classes only when necessary.

It’s a different flow than with other frameworks but at end it allows you to have very coherent theming, which I think it’s one of Ionic’s strongest features.