data-grunticon-embed doesn't resize the svg

[Stephen Shaw]

Hello,

I'm using data-grunticon-embed to colour the svg, but when you add data-grunticon-embed it ignores the resizing capabilities such as background-size: contain;

Is there a work around?

Thanks, Stephen

[Dominik Wilkowski]

To resize an embedded SVG that is not a background anymore you will need to change the width and height of the SVG itself.

In a preprocessor that would look like this:

.icon {
    &.icon-size-sm {
        background-size: 16px 16px;
        width: 16px;
        height: 16px;

        svg {
            width: 16px;
            height: 16px;
        }
    }

    &.icon-size-lg {
        background-size: 64px 64px;
        width: 64px;
        height: 64px;

        svg {
            width: 64px;
            height: 64px;
        }
    }
}