I am using polymer1.x. Polymer is the best !! I am working on a migration after version 2.0 is released this time. However, I found out that the css library (semantic ui) that is loaded as a link does not apply globally.
So I reviewed the 2.0 version of the document, tried to search it, and I tried everything and found that it was impossible to apply. Is it really impossible? If I do not apply the external css library like boostrap globally, I will not be able to go to 2.0.
I would like a detailed answer.
Global styles are controversal to the web components approach. You still can to create a shared style module, put your CSS there and reuse it via <style include="shared-styles">, but I would revommend to split those styles across components, e. g. button should keep its styles encapsulated, and then you will instanciate it using custom element, not <div class="btn">.
What you are probably seeing is Polymer 2.0 transitioning to use ShadowDOM by default.
Given that ShadowDOM provides an encapsulation mechanism for styling, your global stylesheet is no longer able to deeply apply styling.
If you absolutely need to use your global style, you can add a script to your application with window.ShadyDOM = {force: true} before webcomponents-lite.js
However, I would advise that you reconsider your use of global stylesheets, as forcing ShadyDOM incurs a performance and code size penalty for your users.
Also, as @web-padawan pointed out, if you can split your use of your styling library in such a way as it can be applied only to the elements that need it, that would be the best scenario.
Most helpful comment
Global styles are controversal to the web components approach. You still can to create a shared style module, put your CSS there and reuse it via
<style include="shared-styles">, but I would revommend to split those styles across components, e. g. button should keep its styles encapsulated, and then you will instanciate it using custom element, not<div class="btn">.