markdown-body entry-content container-lg" itemprop="text">

postcss-smoothscroll-anchor-polyfill

⚙ PostCSS plugin that updates the standard scroll-behavior property to work with smoothscroll-anchor-polyfill

html {
    scroll-behavior: smooth;
}

compiles to:

html {
    font-family: "scroll-behavior:smooth";
    scroll-behavior: smooth;
}

or if all browsers in your browserslist support CSS Custom Properties:

html {
    --scroll-behavior: smooth;
    scroll-behavior: smooth;
}

Existing `font` and `font-family`

Existing font and font-family declarations are kept and smoothscroll-anchor-polyfill will still work:

👉🏻 Even though the original font declarations are kept, using html { } only for scroll-behavior and declaring your font styles on body { } is prefered.

html {
    scroll-behavior: smooth;
    font-family: "Helvetica Neue";
}

/* Compiles to: */

html {
    scroll-behavior: smooth;
    font-family: "scroll-behavior:smooth", "Helvetica Neue";
}

html {
    scroll-behavior: smooth;
    font: strong 1em/1.4 "Helvetica Neue";
}

/* Compiles to: */

html {
    scroll-behavior: smooth;
    font: strong 1em/1.4 "Helvetica Neue";
    font-family: "scroll-behavior:smooth", "Helvetica Neue";
}

Installation

npm:

npm install postcss-smoothscroll-anchor-polyfill --save-dev

or yarn:

yarn add --dev postcss-smoothscroll-anchor-polyfill

Usage

postcss([ require('postcss-smoothscroll-anchor-polyfill') ])

See PostCSS docs for examples for your environment.

Thanks to

This PostCSS plugin is based on a fork of postcss-object-fit-images, which was built by:

postcss-smoothscroll-anchor-polyfill

Existing font and font-family

Installation

Usage

Thanks to

Existing `font` and `font-family`

License

jonaskuske/postcss-smoothscroll-anchor-polyfill

About

Topics

Resources

License

Stars

Watchers

Forks

Releases 4

Packages 0

Contributors 7

Languages

Packages