Naturally Processed Meals

    @threespot/fluid-svg-polyfill

    1.1.0 • Public • Published

    Fluid SVG Polyfill

    npm Build Status Coverage Status

    Fix SVG responsive scaling in IE 11 and below using the “padding hack” technique. Inspired by https://gist.github.com/Heydon/369185d08d9ce2426f01863625e95525

    More info on “padding hack” technique:

    Install

    $ yarn add @threespot/fluid-svg-polyfill

    Usage

    import fluidSVGPolyfill from "@threespot/fluid-svg-polyfill";
    
    // Add “is-fluid” class to any SVGs that are fluid width
    const svgs = document.querySelectorAll('.is-fluid');
    
    svgs.forEach( el => fluidSVGPolyfill(el) );

    You can also specify a custom class to add to the wrapper <div>:

    fluidSVGPolyfill(el, { wrapperClass: "custom-class" });

    License

    This is free software and may be redistributed under the terms of the MIT license.

    About Threespot

    Threespot is an independent digital agency hell-bent on helping those, and only those, who are committed to helping others. Find out more at https://www.threespot.com.

    Threespot

    Install

    npm i @threespot/fluid-svg-polyfill

    DownloadsWeekly Downloads

    10

    Version

    1.1.0

    License

    MIT

    Unpacked Size

    1.73 MB

    Total Files

    59

    Last publish

    Collaborators

    • dayvod
    • tedw
    • mbrady