{"action":"closed","issue":{"url":"https://api.github.com/repos/styled-components/styled-components/issues/520","repository_url":"https://api.github.com/repos/styled-components/styled-components","labels_url":"https://api.github.com/repos/styled-components/styled-components/issues/520/labels{/name}","comments_url":"https://api.github.com/repos/styled-components/styled-components/issues/520/comments","events_url":"https://api.github.com/repos/styled-components/styled-components/issues/520/events","html_url":"https://github.com/styled-components/styled-components/issues/520","id":208798097,"number":520,"title":"How to tell a component to inject it's css at the end","user":{"login":"kopax","id":1866564,"avatar_url":"https://avatars3.githubusercontent.com/u/1866564?v=3","gravatar_id":"","url":"https://api.github.com/users/kopax","html_url":"https://github.com/kopax","followers_url":"https://api.github.com/users/kopax/followers","following_url":"https://api.github.com/users/kopax/following{/other_user}","gists_url":"https://api.github.com/users/kopax/gists{/gist_id}","starred_url":"https://api.github.com/users/kopax/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/kopax/subscriptions","organizations_url":"https://api.github.com/users/kopax/orgs","repos_url":"https://api.github.com/users/kopax/repos","events_url":"https://api.github.com/users/kopax/events{/privacy}","received_events_url":"https://api.github.com/users/kopax/received_events","type":"User","site_admin":false},"labels":[{"id":425493754,"url":"https://api.github.com/repos/styled-components/styled-components/labels/question","name":"question","color":"cc317c","default":true}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":5,"created_at":"2017-02-20T06:55:27Z","updated_at":"2017-03-01T07:22:01Z","closed_at":"2017-03-01T07:22:01Z","body":"I have created a component that inject all my CSS utilities, this component wrap my application like this : \r\n\r\n```jsx\r\n    <Provider store={store}>\r\n      <LanguageProvider messages={messages}>\r\n        <BootstrapProvider\r\n          utils={{\r\n            align: true,\r\n            background: true,\r\n            border: true,\r\n            clearfix: true,\r\n            display: true,\r\n            flex: true,\r\n            float: true,\r\n            position: true,\r\n            screenreaders: true,\r\n            sizing: true,\r\n            spacing: true,\r\n            text: true,\r\n            visibility: true,\r\n          }}\r\n        >\r\n          <Router\r\n            history={history}\r\n            routes={rootRoute}\r\n            onUpdate={hashLinkScroll}\r\n            render={\r\n              applyRouterMiddleware(useScroll())\r\n            }\r\n          />\r\n        </BootstrapProvider>\r\n      </LanguageProvider>\r\n    </Provider>,\r\n```\r\n\r\nI only use `injectGlobal` for settings the __html__ and __body__ for the font.\r\n\r\nI have noticed that the css of this component is injected before all overs in the html.\r\n\r\nThis make my utility less prioritized. I want to add them at the end, is there a chance to see this in a future version ?\r\n\r\nThe only fix I have for the CSS is to use `!important` which is not recommended."}}
{"actor":{"display_login":"mxstbr"}}