Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature Request: Allow dom-modules with shared styles to be used inside Angular2 components. #70

Closed
alexeygt opened this issue Oct 31, 2017 · 1 comment
Assignees
Labels
Milestone

Comments

@alexeygt
Copy link

alexeygt commented Oct 31, 2017

UseCase:

  1. I have polymer dom-modules with some custom shared styles published by other team on my project or published by polymer team (like iron-flex-layout/iron-flex-layout-classes.html)
  2. I would like to be able to use these styles in some of my Angular2 components.
  3. Currently it's not possible to access styles defined within dom-module in Angular2 component.

Example of possible implementation for re-use of iron-flex-layout/iron-flex-layout-classes.html:

@Component({
  stylesIncludeFromPolymer: ['iron-flex', 'iron-flex-reverse', 'iron-flex-alignment']
  template: `
    <div class="layout horizontal-reverse center-justified">
      <div>This div is styled from the Polymer iron-flex-layout-classes.html</div>
      <div>Another div that should be positioned to the left of previous one</div>
    </div>
  `
})
@hotforfeature hotforfeature self-assigned this Oct 31, 2017
@hotforfeature hotforfeature added this to the 2.0.0 milestone Oct 31, 2017
@hotforfeature hotforfeature removed this from the 2.0.0 milestone Mar 9, 2018
@hotforfeature hotforfeature added this to the 3.0.0 milestone Aug 23, 2018
@asyncLiz
Copy link
Collaborator

Added to v3:

import { IncludeStyles } from '@codebakery/origami/styles';

@IncludeStyles('iron-flex', 'iron-flex-reverse', 'iron-flex-alignment')
@Component({
  template: `
    <div class="layout horizontal-reverse center-justified">
      <div>This div is styled from the Polymer iron-flex-layout-classes.html</div>
      <div>Another div that should be positioned to the left of previous one</div>
    </div>
  `
})

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants