search

ts4nfdi / terminology-service-suite

The Terminology Service Suite project is a collection of interactive widgets designed to ease the integration of terminology service functions into third-party applications.
https://ts4nfdi.github.io/terminology-service-suite/comp/latest/
MIT License
16 stars 2 forks source link

styles: first try of removing global eui styles #156

Open jusa3 opened 4 weeks ago

jusa3 commented 4 weeks ago

With great help from @Pooya-Oladazimi we found a possible solution for global style injection and overwriting consuming app syles. Solves https://github.com/ts4nfdi/terminology-service-suite/issues/144

We disabled the global style option in the Elastic UI Provider (EuiProvider) and created a wrapper with the missing styles from EuiProvider.

Applied to Autocomplete and DataContent widgets as a test.

What do you think of this implementation @Pooya-Oladazimi ?

Pooya-Oladazimi commented 4 weeks ago

@jusa3

Thanks for the quick implementation. It is nice. We just need to introduce a wrapper CSS class like ".sem-widget" and use that to narrow down the CSS file selectors. like instead of: a{} we use .sem-widget a {}

so that we only change the anchor style inside the widgets and not globally.

Pooya-Oladazimi commented 2 weeks ago

@jusa3

one potential approach is to use another UI lib Material UI. especially because of this: https://mui.com/material-ui/getting-started/usage/#globals