{"action":"created","issue":{"url":"https://api.github.com/repos/Polymer/polymer/issues/2229","labels_url":"https://api.github.com/repos/Polymer/polymer/issues/2229/labels{/name}","comments_url":"https://api.github.com/repos/Polymer/polymer/issues/2229/comments","events_url":"https://api.github.com/repos/Polymer/polymer/issues/2229/events","html_url":"https://github.com/Polymer/polymer/issues/2229","id":99756678,"number":2229,"title":"Document new style recommendations","user":{"login":"sorvell","id":78891,"avatar_url":"https://avatars.githubusercontent.com/u/78891?v=3","gravatar_id":"","url":"https://api.github.com/users/sorvell","html_url":"https://github.com/sorvell","followers_url":"https://api.github.com/users/sorvell/followers","following_url":"https://api.github.com/users/sorvell/following{/other_user}","gists_url":"https://api.github.com/users/sorvell/gists{/gist_id}","starred_url":"https://api.github.com/users/sorvell/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sorvell/subscriptions","organizations_url":"https://api.github.com/users/sorvell/orgs","repos_url":"https://api.github.com/users/sorvell/repos","events_url":"https://api.github.com/users/sorvell/events{/privacy}","received_events_url":"https://api.github.com/users/sorvell/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/Polymer/polymer/labels/p1","name":"p1","color":"eb6420"}],"state":"open","locked":false,"assignee":{"login":"sorvell","id":78891,"avatar_url":"https://avatars.githubusercontent.com/u/78891?v=3","gravatar_id":"","url":"https://api.github.com/users/sorvell","html_url":"https://github.com/sorvell","followers_url":"https://api.github.com/users/sorvell/followers","following_url":"https://api.github.com/users/sorvell/following{/other_user}","gists_url":"https://api.github.com/users/sorvell/gists{/gist_id}","starred_url":"https://api.github.com/users/sorvell/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sorvell/subscriptions","organizations_url":"https://api.github.com/users/sorvell/orgs","repos_url":"https://api.github.com/users/sorvell/repos","events_url":"https://api.github.com/users/sorvell/events{/privacy}","received_events_url":"https://api.github.com/users/sorvell/received_events","type":"User","site_admin":false},"milestone":null,"comments":4,"created_at":"2015-08-08T01:05:08Z","updated_at":"2015-08-27T09:11:32Z","closed_at":null,"body":"As a result of #1876, we're changing our recommendation for how styles should be loaded and shared (will be merged via #2198).\r\n\r\n* `<link rel=\"import\" type=\"css\">` will be *deprecated*. This syntax allowed users to use a pure .css file, but the file is parsed as HTML which is a security and performance concern.\r\n* Instead, `<dom-module>` is the recommended way to share style data. Styles should be defined in a `<template>` inside a `<dom-module>` so they are not parsed by the browser, and the `<dom-module>` should be placed in an HTMLImport that's used where needed. We'll be providing a tool to help turn .css files into this format. Here's an example of the syntax:\r\n\r\n  ```html\r\n  <!-- shared-styles.html -->\r\n  <dom-module id=\"shared-styles\">\r\n    <template>\r\n      <style>\r\n        .red { color: red; }\r\n      </style> \r\n    </template>\r\n  </dom-module>\r\n```\r\n\r\n* Style data contained in `<dom-module>`'s can be 'included' in element styles or `custom-style` elements using the `include` attribute. For example,\r\n\r\n  ```html\r\n  <!-- using shared styles in an element -->\r\n  <link rel=\"import\" href=\"../shared-styles/shared-styles.html\">\r\n  <dom-module id=\"x-foo\">\r\n    <template>\r\n      <style include=\"shared-styles\"></style>\r\n      <style>:host { display: block; }</style>\r\n      Hi\r\n    </template>\r\n    <script>Polymer({is: 'x-foo'});</script>\r\n  </dom-module>\r\n\r\n  <!-- or -->\r\n  <!-- using shared styles in a custom-style -->\r\n  <link rel=\"import\" href=\"../shared-styles/shared-styles.html\">\r\n  <style is=\"custom-style\" include=\"shared-styles\"></style>\r\n  ```\r\n * Previously we recommended that `<style>`s be placed inside an element's `<dom-module>` but outside the template. This is still supported but it is slower than placing the styles in the template so it's no longer recommended."},"comment":{"url":"https://api.github.com/repos/Polymer/polymer/issues/comments/135354195","html_url":"https://github.com/Polymer/polymer/issues/2229#issuecomment-135354195","issue_url":"https://api.github.com/repos/Polymer/polymer/issues/2229","id":135354195,"user":{"login":"nazar-pc","id":928965,"avatar_url":"https://avatars.githubusercontent.com/u/928965?v=3","gravatar_id":"","url":"https://api.github.com/users/nazar-pc","html_url":"https://github.com/nazar-pc","followers_url":"https://api.github.com/users/nazar-pc/followers","following_url":"https://api.github.com/users/nazar-pc/following{/other_user}","gists_url":"https://api.github.com/users/nazar-pc/gists{/gist_id}","starred_url":"https://api.github.com/users/nazar-pc/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nazar-pc/subscriptions","organizations_url":"https://api.github.com/users/nazar-pc/orgs","repos_url":"https://api.github.com/users/nazar-pc/repos","events_url":"https://api.github.com/users/nazar-pc/events{/privacy}","received_events_url":"https://api.github.com/users/nazar-pc/received_events","type":"User","site_admin":false},"created_at":"2015-08-27T09:11:32Z","updated_at":"2015-08-27T09:11:32Z","body":"Why do we need one more tool just to import style? This seems to be an overkill from any point of view.\r\nThere should be always possibility to imprort arbitraty CSS file directly."}}