Closed zmrhaljiri closed 7 years ago
@zmrhaljiri @ronaldruzicka The original Idea was to have a base class .icon
for general styles like display property or resolution and modifier class for minor changes like different colors.
@janpanschab I think now it's done exactly this way. (<svg class="icon {{modifier}}">
)
However I can imagine situations when you would need to use a modifier class to control the display property, e.g. if you have more icons in one component.
I talked with @janpanschab and we agreed we can use it like this. Basic styles for general icons are styled with icon
class and with modifier for svg
we can then style custom sizes or colors.
As @ronaldruzicka mentioned in #101 about SVG nunjucks macro, his concern was the
<use>
element has class used for styling, but it's wrapped by<svg>
element that needs to by styled also (for example some dimensions etc.)With this approach only one class is present to handle all the styling - on
<svg>
element.