Repository: jonathantneal/postcss-normalize Branch: main Commit: 1aec48c26829 Files: 53 Total size: 154.9 KB Directory structure: gitextract_3t_i_nkv/ ├── .editorconfig ├── .gitattributes ├── .github/ │ └── workflows/ │ └── test.yml ├── .gitignore ├── .rollup.mjs ├── CHANGELOG.md ├── CONTRIBUTING.md ├── INSTALL.md ├── LICENSE.md ├── README.md ├── SECURITY.md ├── index.cjs ├── index.mjs ├── package.json ├── src/ │ ├── index.js │ └── lib/ │ ├── cssMap.js │ ├── parse.js │ ├── postcssImportNormalize.js │ ├── postcssNormalize.js │ ├── readFile.js │ └── util.js └── test/ ├── _import.mjs ├── _require.cjs ├── _tape.mjs ├── basic-normalize-opinionated.css ├── basic-normalize-opinionated.expect.css ├── basic-normalize.css ├── basic-normalize.expect.css ├── basic-sanitize.css ├── basic-sanitize.expect.css ├── browsers-normalize.css ├── browsers-normalize.expect.css ├── duplicates.allow.expect.css ├── duplicates.css ├── duplicates.expect.css ├── force-normalize.css ├── force-normalize.expect.css ├── force-sanitize-all.css ├── force-sanitize-all.expect.css ├── force-sanitize.css ├── force-sanitize.expect.css ├── import-normalize-opinionated.css ├── import-normalize-opinionated.expect.css ├── import-normalize.css ├── import-normalize.expect.css ├── import-sanitize-all.css ├── import-sanitize-all.expect.css ├── import-sanitize-forms.css ├── import-sanitize-forms.expect.css ├── import-sanitize.css ├── normalize.expect.css ├── postcss-import.expect.css └── sanitize.expect.css ================================================ FILE CONTENTS ================================================ ================================================ FILE: .editorconfig ================================================ root = true [*] charset = utf-8 end_of_line = lf indent_style = tab insert_final_newline = true trim_trailing_whitespace = true [*.md] trim_trailing_whitespace = false [*.{json,md,yml}] indent_size = 2 indent_style = space ================================================ FILE: .gitattributes ================================================ * text=auto eol=lf ================================================ FILE: .github/workflows/test.yml ================================================ name: test on: push: concurrency: group: branch-node-${{ github.ref }} cancel-in-progress: true permissions: contents: read jobs: test: runs-on: ubuntu-latest strategy: matrix: node: [18, 20, 'lts/*'] os: [ubuntu-latest] include: - os: macos-latest node: 'lts/*' - os: windows-latest node: 'lts/*' steps: - uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6.0.2 - uses: actions/setup-node@6044e13b5dc448c55e2357c09f80417699197238 # v6.2.0 with: node-version: ${{ matrix.node }} - run: npm ci - run: npm run build - run: npm run test ================================================ FILE: .gitignore ================================================ node_modules *.log* *.result.css ================================================ FILE: .rollup.mjs ================================================ export default { input: 'src/index.js', output: [ { file: 'index.cjs', format: 'cjs', exports: 'default', sourcemap: false, strict: false }, { file: 'index.mjs', format: 'esm', sourcemap: false, strict: false } ] } ================================================ FILE: CHANGELOG.md ================================================ # Changes to PostCSS Normalize ### 13.0.1 - Maintenance release after updating dependencies ### 13.0.0 - Pin versions of `@csstools/normalize.css` and `sanitize.css` ### 12.0.0 - Remove TypeScript types. This package is a dual published cjs and esm and it isn't worth it, all info is in `README.md`. - Set minimum node version to 18 - Fix resolution of `@csstools/normalize.css` path when using ESM ### 11.0.0 - Cleanup build dependencies ### 10.0.1 (September 15, 2021) - Added: `sanitize.css` to support 13+ (major). This version removes support for `pages.css` yet is released as a patch version to resolve issues in **Create React App**. This is a betrayal of semantic versioning. ### 10.0.0 (April 28, 2021) - Updated: PostCSS support to ^8 (major). - Updated: Node support to 12+ (major). ### 9.0.0 (April 12, 2020) - Updated: `normalize.css` to support any version (major). - Updated: `sanitize.css` to support any version (major). - Updated: Node support to 10.0.0 (major). - Removed: Unused `browserslist` dependency. ### 8.0.1 (June 10, 2019) - Fixed: Issue with Windows failing to resolve normalize. - Updated: `browserslist` to 4.6.2 (patch). - Updated: `postcss` to 7.0.17 (patch). ### 8.0.0 (June 3, 2019) - Added: `sanitize.css` 10.0.0 (major). - Updated: `@csstools/normalize.css` to 10.1.0 (major). - Updated: `browserslist` to 4.5.6 (minor). - Updated: `postcss` to 7.0.16 (patch). - Updated: Node 8+ compatibility (major). ### 7.0.1 (August 24, 2018) - Use postcss-browser-comments 2.0.0 (major, but a patch for this project). PostCSS Browser Comments was using an older version of PostCSS, requiring 2 versions of PostCSS to use PostCSS Normalize. This update resolves that. ### 7.0.0 (August 24, 2018) - Use normalize.css 9.0.1 (major). ### 6.0.0 (June 16, 2018) - Use normalize.css 8 (major). - Include normalize.css comments. - Include normalize.css sourcemap. ### 5.0.0 (June 7, 2018) - Update `browserslist` to 3.2.8 (major). - Update: `postcss` to 6.0.22 (patch). - Update: Node support from 4 to 6 (major). ### 4.0.0 (June 21, 2017) - Require insertion point. Make old behavior an option. - Allow multiple insertion points. ### 3.0.0 (May 26, 2017) - Use csstools/normalize.css 7. - Change the insertion point to `@import-normalize` to avoid confusion or collision with standard import behavior. ### 2.1.0 (May 26, 2017) - Support an insertion point via `@import postcss-normalize`. - Update tree creation to avoid AST issues with source. ### 2.0.1 (May 21, 2017) - Update tree creation to avoid AST issues with other PostCSS plugins. ### 2.0.0 (May 17, 2017) - Support PostCSS 6. - Support Node 4. ### 1.0.0 (May 2, 2017) - Initial version. ================================================ FILE: CONTRIBUTING.md ================================================ # Contributing to PostCSS Normalize You want to help? You rock! Now, take a moment to be sure your contributions make sense to everyone else. ## Reporting Issues Found a problem? Want a new feature? - See if your issue or idea has [already been reported]. - Provide a [reduced test case] or a [live example]. Remember, a bug is a _demonstrable problem_ caused by _our_ code. ## Submitting Pull Requests Pull requests are the greatest contributions, so be sure they are focused in scope and avoid unrelated commits. 1. To begin; [fork this project], clone your fork, and add our upstream. ```bash # Clone your fork of the repo into the current directory git clone git@github.com:YOUR_USER/postcss-normalize.git # Navigate to the newly cloned directory cd postcss-normalize # Assign the original repo to a remote called "upstream" git remote add upstream git@github.com:csstools/postcss-normalize.git # Install the tools necessary for testing npm install ``` 2. Create a branch for your feature or fix: ```bash # Move into a new branch for your feature git checkout -b feature/thing ``` ```bash # Move into a new branch for your fix git checkout -b fix/something ``` 3. If your code follows our practices, then push your feature branch: ```bash # Test current code npm test ``` ```bash # Push the branch for your new feature git push origin feature/thing ``` ```bash # Or, push the branch for your update git push origin update/something ``` That’s it! Now [open a pull request] with a clear title and description. [already been reported]: issues [fork this project]: fork [live example]: https://codepen.io/pen [open a pull request]: https://help.github.com/articles/using-pull-requests/ [reduced test case]: https://css-tricks.com/reduced-test-cases/ ================================================ FILE: INSTALL.md ================================================ # Installing PostCSS Normalize [PostCSS Normalize] runs in all Node environments, with special instructions for: | [Node](#node) | [PostCSS CLI](#postcss-cli) | [Webpack](#webpack) | [Create React App](#create-react-app) | [Gulp](#gulp) | [Grunt](#grunt) | | --- | --- | --- | --- | --- | --- | ## Node Add [PostCSS Normalize] to your project: ```bash npm install postcss-normalize --save-dev ``` Use [PostCSS Normalize] to process your CSS: ```js const postcssNormalize = require('postcss-normalize'); postcssNormalize.process(YOUR_CSS /*, processOptions, pluginOptions */); ``` Or use it as a [PostCSS] plugin: ```js const postcss = require('postcss'); const postcssNormalize = require('postcss-normalize'); postcss([ postcssNormalize(/* pluginOptions */) ]).process(YOUR_CSS /*, processOptions */); ``` ## PostCSS CLI Add [PostCSS CLI] to your project: ```bash npm install postcss-cli --save-dev ``` Use [PostCSS Normalize] in your `postcss.config.js` configuration file: ```js const postcssNormalize = require('postcss-normalize'); module.exports = { plugins: [ postcssNormalize(/* pluginOptions */) ] } ``` ## Webpack Add [PostCSS Loader] to your project: ```bash npm install postcss-loader --save-dev ``` Use [PostCSS Normalize] in your Webpack configuration: ```js const postcssNormalize = require('postcss-normalize'); module.exports = { module: { rules: [ { test: /\.css$/, use: [ 'style-loader', { loader: 'css-loader', options: { importLoaders: 1 } }, { loader: 'postcss-loader', options: { ident: 'postcss', plugins: () => [ postcssNormalize(/* pluginOptions */) ] } } ] } ] } } ``` ## Create React App Starting from **v3.0.0**, [Create React App already includes postcss-normalize](https://facebook.github.io/create-react-app/docs/adding-css-reset). To start using it, use the `@import-normalize` rule: ```pcss // index.css @import-normalize; ``` --- If you're using an ***older version*** of Create React App, add [React App Rewired] and [React App Rewire PostCSS] to your project: ```bash npm install react-app-rewired react-app-rewire-postcss --save-dev ``` Use [React App Rewire PostCSS] and [PostCSS Normalize] in your `config-overrides.js` file: ```js const reactAppRewirePostcss = require('react-app-rewire-postcss'); const postcssNormalize = require('postcss-normalize'); export default config => reactAppRewirePostcss(config, { plugins: () => [ postcssNormalize(/* pluginOptions */) ] }); ``` ## Gulp Add [Gulp PostCSS] to your project: ```bash npm install gulp-postcss --save-dev ``` Use [PostCSS Normalize] in your Gulpfile: ```js const postcss = require('gulp-postcss'); const postcssNormalize = require('postcss-normalize'); gulp.task('css', () => gulp.src('./src/*.css').pipe( postcss([ postcssNormalize(/* pluginOptions */) ]) ).pipe( gulp.dest('.') )); ``` ## Grunt Add [Grunt PostCSS] to your project: ```bash npm install grunt-postcss --save-dev ``` Use [PostCSS Normalize] in your Gruntfile: ```js const postcssNormalize = require('postcss-normalize'); grunt.loadNpmTasks('grunt-postcss'); grunt.initConfig({ postcss: { options: { use: [ postcssNormalize(/* pluginOptions */) ] }, dist: { src: '*.css' } } }); ``` [Gulp PostCSS]: https://github.com/postcss/gulp-postcss [Grunt PostCSS]: https://github.com/nDmitry/grunt-postcss [PostCSS]: https://github.com/postcss/postcss [PostCSS CLI]: https://github.com/postcss/postcss-cli [PostCSS Loader]: https://github.com/postcss/postcss-loader [PostCSS Normalize]: https://github.com/csstools/postcss-normalize [React App Rewire PostCSS]: https://github.com/csstools/react-app-rewire-postcss [React App Rewired]: https://github.com/timarney/react-app-rewired ================================================ FILE: LICENSE.md ================================================ # CC0 1.0 Universal ## Statement of Purpose The laws of most jurisdictions throughout the world automatically confer exclusive Copyright and Related Rights (defined below) upon the creator and subsequent owner(s) (each and all, an “owner”) of an original work of authorship and/or a database (each, a “Work”). Certain owners wish to permanently relinquish those rights to a Work for the purpose of contributing to a commons of creative, cultural and scientific works (“Commons”) that the public can reliably and without fear of later claims of infringement build upon, modify, incorporate in other works, reuse and redistribute as freely as possible in any form whatsoever and for any purposes, including without limitation commercial purposes. These owners may contribute to the Commons to promote the ideal of a free culture and the further production of creative, cultural and scientific works, or to gain reputation or greater distribution for their Work in part through the use and efforts of others. For these and/or other purposes and motivations, and without any expectation of additional consideration or compensation, the person associating CC0 with a Work (the “Affirmer”), to the extent that he or she is an owner of Copyright and Related Rights in the Work, voluntarily elects to apply CC0 to the Work and publicly distribute the Work under its terms, with knowledge of his or her Copyright and Related Rights in the Work and the meaning and intended legal effect of CC0 on those rights. 1. Copyright and Related Rights. A Work made available under CC0 may be protected by copyright and related or neighboring rights (“Copyright and Related Rights”). Copyright and Related Rights include, but are not limited to, the following: 1. the right to reproduce, adapt, distribute, perform, display, communicate, and translate a Work; 2. moral rights retained by the original author(s) and/or performer(s); 3. publicity and privacy rights pertaining to a person’s image or likeness depicted in a Work; 4. rights protecting against unfair competition in regards to a Work, subject to the limitations in paragraph 4(i), below; 5. rights protecting the extraction, dissemination, use and reuse of data in a Work; 6. database rights (such as those arising under Directive 96/9/EC of the European Parliament and of the Council of 11 March 1996 on the legal protection of databases, and under any national implementation thereof, including any amended or successor version of such directive); and 7. other similar, equivalent or corresponding rights throughout the world based on applicable law or treaty, and any national implementations thereof. 2. Waiver. To the greatest extent permitted by, but not in contravention of, applicable law, Affirmer hereby overtly, fully, permanently, irrevocably and unconditionally waives, abandons, and surrenders all of Affirmer’s Copyright and Related Rights and associated claims and causes of action, whether now known or unknown (including existing as well as future claims and causes of action), in the Work (i) in all territories worldwide, (ii) for the maximum duration provided by applicable law or treaty (including future time extensions), (iii) in any current or future medium and for any number of copies, and (iv) for any purpose whatsoever, including without limitation commercial, advertising or promotional purposes (the “Waiver”). Affirmer makes the Waiver for the benefit of each member of the public at large and to the detriment of Affirmer’s heirs and successors, fully intending that such Waiver shall not be subject to revocation, rescission, cancellation, termination, or any other legal or equitable action to disrupt the quiet enjoyment of the Work by the public as contemplated by Affirmer’s express Statement of Purpose. 3. Public License Fallback. Should any part of the Waiver for any reason be judged legally invalid or ineffective under applicable law, then the Waiver shall be preserved to the maximum extent permitted taking into account Affirmer’s express Statement of Purpose. In addition, to the extent the Waiver is so judged Affirmer hereby grants to each affected person a royalty-free, non transferable, non sublicensable, non exclusive, irrevocable and unconditional license to exercise Affirmer’s Copyright and Related Rights in the Work (i) in all territories worldwide, (ii) for the maximum duration provided by applicable law or treaty (including future time extensions), (iii) in any current or future medium and for any number of copies, and (iv) for any purpose whatsoever, including without limitation commercial, advertising or promotional purposes (the “License”). The License shall be deemed effective as of the date CC0 was applied by Affirmer to the Work. Should any part of the License for any reason be judged legally invalid or ineffective under applicable law, such partial invalidity or ineffectiveness shall not invalidate the remainder of the License, and in such case Affirmer hereby affirms that he or she will not (i) exercise any of his or her remaining Copyright and Related Rights in the Work or (ii) assert any associated claims and causes of action with respect to the Work, in either case contrary to Affirmer’s express Statement of Purpose. 4. Limitations and Disclaimers. 1. No trademark or patent rights held by Affirmer are waived, abandoned, surrendered, licensed or otherwise affected by this document. 2. Affirmer offers the Work as-is and makes no representations or warranties of any kind concerning the Work, express, implied, statutory or otherwise, including without limitation warranties of title, merchantability, fitness for a particular purpose, non infringement, or the absence of latent or other defects, accuracy, or the present or absence of errors, whether or not discoverable, all to the greatest extent permissible under applicable law. 3. Affirmer disclaims responsibility for clearing rights of other persons that may apply to the Work or any use thereof, including without limitation any person’s Copyright and Related Rights in the Work. Further, Affirmer disclaims responsibility for obtaining any necessary consents, permissions or other rights required for any use of the Work. 4. Affirmer understands and acknowledges that Creative Commons is not a party to this document and has no duty or obligation with respect to this CC0 or use of the Work. For more information, please see http://creativecommons.org/publicdomain/zero/1.0/. ================================================ FILE: README.md ================================================ # PostCSS Normalize [PostCSS][postcss] [npm version][npm-url] [build status][cli-url] [support chat][git-url] [PostCSS Normalize] lets you use the parts of [normalize.css] or [sanitize.css] that you need from your [browserslist]. ```css @import "normalize.css"; ``` ```css @import "sanitize.css"; ``` **PostCSS Normalize** uses a non-opinionated version of [normalize.css], but an opinionated version may also be used. ```css @import "normalize.css/opinionated.css"; ``` ### Examples Here is a sample of what **normalize.css** looks like when the **browserslist** is `ie >= 9`: ```css /** * Add the correct display in IE 9-. */ audio, video { display: inline-block; } /** * Remove the border on images inside links in IE 10-. */ img { border-style: none; } ``` And here is the same sample when the **browserslist** is `ie >= 10`: ```css /** * Remove the border on images inside links in IE 10-. */ img { border-style: none; } ``` ## Usage Add [PostCSS Normalize] to your project: ```bash npm install postcss-normalize --save-dev ``` Add a [browserslist] entry in `package.json`: ```json { "browserslist": "last 2 versions" } ``` Use **PostCSS Normalize** to process your CSS: ```js const postcssNormalize = require('postcss-normalize') postcssNormalize.process(YOUR_CSS /*, processOptions, pluginOptions */) ``` Or use it as a [PostCSS] plugin: ```js const postcss = require('postcss') const postcssNormalize = require('postcss-normalize') postcss([ postcssNormalize(/* pluginOptions */) ]).process(YOUR_CSS /*, processOptions */) ``` **PostCSS Normalize** runs in all Node environments, with special instructions for: | [Node](INSTALL.md#node) | [PostCSS CLI](INSTALL.md#postcss-cli) | [Webpack](INSTALL.md#webpack) | [Create React App](INSTALL.md#create-react-app) | [Gulp](INSTALL.md#gulp) | [Grunt](INSTALL.md#grunt) | | --- | --- | --- | --- | --- | --- | ## PostCSS Import Usage **PostCSS Normalize** includes a `postcssImport` function to configure [PostCSS Import] and allow you to continue using the `@import` syntax. ```js const postcss = require('postcss') const postcssImport = require('postcss-import') const postcssNormalize = require('postcss-normalize') postcss([ postcssImport( postcssNormalize( /* pluginOptions (for PostCSS Normalize) */ ).postcssImport( /* pluginOptions (for PostCSS Import) */ ) ) ]) // now you can use @import "normalize.css", etc. again ``` Alternatively, use `@import-normalize` or `@import-sanitize` to avoid conflicts with `@import` transforms. ```pcss @import-normalize; ``` ```pcss @import-normalize "normalize/opinionated.css"; ``` ```pcss @import-sanitize; ``` ## Options ### allowDuplicates The `allowDuplicates` option determines whether multiple, duplicate insertions of CSS libraries are allowed. By default, duplicate libraries are omitted. ```js postcssNormalize({ allowDuplicates: true }) ``` ### forceImport The `forceImport` option defines CSS libraries that will be inserted at the beginning of the CSS file. Unless overriden by `allowDuplicates`, duplicate CSS libraries would still be omitted. ```js postcssNormalize({ forceImport: true }) ``` Specific CSS libraries may be defined. ```js postcssNormalize({ forceImport: 'sanitize.css' }) ``` ### browsers The `browsers` option defines an override of the project’s **browserslist** for **PostCSS Normalize**. This option should be avoided in leui of a browserslist file. ```js postcssNormalize({ browsers: 'last 2 versions' }) ``` ## CSS Libraries **PostCSS Normalize** can include [normalize.css] or [sanitize.css] and configure either with the following combinations: ```css @import "normalize"; /* also, @import "normalize.css" */ @import "normalize/opinionated"; /* also, @import "normalize.css/opinionated.css", @import "normalize.css/*" */ @import "sanitize"; /* also, @import "sanitize.css" */ @import "sanitize/assets"; /* also, @import "sanitize.css/assets.css" */ @import "sanitize/forms"; /* also, @import "sanitize.css/forms.css" */ @import "sanitize/reduce-motion"; /* also, @import "sanitize.css/reduce-motion.css" */ @import "sanitize/system-ui"; /* also, @import "sanitize.css/system-ui.css" */ @import "sanitize/typography"; /* also, @import "sanitize.css/typography.css" */ @import "sanitize/ui-monospace"; /* also, @import "sanitize.css/ui-monospace.css" */ @import "sanitize/*"; /* also, @import "sanitize.css/*" (sanitize + all additions) */ ``` [cli-img]: https://img.shields.io/travis/csstools/postcss-normalize/main.svg [cli-url]: https://travis-ci.org/csstools/postcss-normalize [git-img]: https://img.shields.io/badge/support-chat-blue.svg [git-url]: https://gitter.im/postcss/postcss [npm-img]: https://img.shields.io/npm/v/postcss-normalize.svg [npm-url]: https://www.npmjs.com/package/postcss-normalize [browserslist]: http://browserl.ist/ [CSS Libraries]: #css-libraries [normalize.css]: https://github.com/csstools/normalize.css [Options]: #options [PostCSS]: https://github.com/postcss/postcss [PostCSS Import]: https://github.com/postcss/postcss-import [PostCSS Import Usage]: #postcss-import-usage [PostCSS Normalize]: https://github.com/csstools/postcss-normalize [sanitize.css]: https://github.com/csstools/sanitize.css ================================================ FILE: SECURITY.md ================================================ # Security Policy ## Supported Versions Only the latest version of plugins and packages will receive security patches. Please reach out if you need extended support for an older version. | Version | Supported | | ------- | ------------------ | | 5.1.x | :white_check_mark: | | 5.0.x | :x: | | 4.0.x | :x: | | < 4.0 | :x: | ## Security contact information To report a security vulnerability, please use the [Tidelift security contact](https://tidelift.com/security). Tidelift will coordinate the fix and disclosure. ================================================ FILE: index.cjs ================================================ var postcssBrowserComments = require('postcss-browser-comments'); var path = require('node:path'); var node_module = require('node:module'); var path$1 = require('path'); var fs = require('fs'); var postcss = require('postcss'); var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null; const assign = (...objects) => Object.assign(...objects); const create = (...objects) => assign(Object.create(null), ...objects); const require$1 = node_module.createRequire((typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('index.cjs', document.baseURI).href))); // get resolved filenames for normalize.css const normalizeCSS = require$1.resolve('@csstools/normalize.css'); const normalizeDir = path.dirname(normalizeCSS); const normalizeOpinionatedCSS = path.join(normalizeDir, 'opinionated.css'); // get resolved filenames for sanitize.css const sanitizeCSS = require$1.resolve('sanitize.css'); const sanitizeDir = path.dirname(sanitizeCSS); const sanitizeAssetsCSS = path.join(sanitizeDir, 'assets.css'); const sanitizeFormsCSS = path.join(sanitizeDir, 'forms.css'); const sanitizeReduceMotionCSS = path.join(sanitizeDir, 'reduce-motion.css'); const sanitizeTypographyCSS = path.join(sanitizeDir, 'typography.css'); const sanitizeSystemUiCSS = path.join(sanitizeDir, 'system-ui.css'); const sanitizeUiMonospace = path.join(sanitizeDir, 'ui-monospace.css'); // export a hashmap of css library filenames const parsableFilenames = create({ [normalizeCSS]: true, [normalizeOpinionatedCSS]: true, [sanitizeCSS]: true, [sanitizeAssetsCSS]: true, [sanitizeFormsCSS]: true, [sanitizeReduceMotionCSS]: true, [sanitizeTypographyCSS]: true, [sanitizeSystemUiCSS]: true, [sanitizeUiMonospace]: true, }); // export a hashmap of css library filenames by id const resolvedFilenamesById = create({ 'normalize': [normalizeCSS], 'normalize/opinionated': [normalizeOpinionatedCSS], 'normalize/*': [normalizeOpinionatedCSS], 'sanitize': [sanitizeCSS], 'sanitize/assets': [sanitizeAssetsCSS], 'sanitize/forms': [sanitizeCSS, sanitizeFormsCSS], 'sanitize/page': [sanitizeAssetsCSS], // deprecated; remaining for v10.0.0 compatibility 'sanitize/reduce-motion': [sanitizeCSS, sanitizeReduceMotionCSS], 'sanitize/system-ui': [sanitizeCSS, sanitizeSystemUiCSS], 'sanitize/typography': [sanitizeCSS, sanitizeTypographyCSS], 'sanitize/ui-monospace': [sanitizeCSS, sanitizeUiMonospace], 'sanitize/*': [sanitizeCSS, sanitizeFormsCSS], }); const cache$1 = create(); async function readFile (filename) { filename = path$1.resolve(filename); cache$1[filename] = cache$1[filename] || create(); return new Promise( (resolve, reject) => fs.stat( filename, (statsError, { mtime }) => statsError ? reject(statsError) : mtime === cache$1[filename].mtime ? resolve(cache$1[filename].data) : fs.readFile( filename, 'utf8', (readFileError, data) => readFileError ? reject(readFileError) : resolve( (cache$1[filename] = { data, mtime }).data ) ) ) ) } const cache = create(null); var parse = (filename, transformer) => readFile(filename).then( // cache the parsed css root css => (cache[css] = cache[css] || postcss.parse(css, { from: filename })) ).then( // clone the cached root root => root.clone() ).then( // transform the cloned root clone => Promise.resolve( transformer(clone) ).then( // resolve the cloned root () => clone ) ); var postcssImportNormalize = commentsTransformer => opts => { opts = create(opts); // return an postcss-import configuration return create({ load (filename, importOptions) { return filename in parsableFilenames // parse the file (the file and css are conservatively cached) ? parse(filename, commentsTransformer).then( root => root.toResult({ to: filename, map: true }).css ) : typeof opts.load === 'function' // otherwise, use the override loader ? opts.load.call(null, filename, importOptions) // otherwise, return the (conservatively cached) contents of the file : readFile(filename) }, resolve (id, basedir, importOptions) { // get the css id by removing css extensions const cssId = id.replace(cssExtRegExp$1, ''); return cssId in resolvedFilenamesById // return the known resolved path for the css id ? resolvedFilenamesById[cssId] : typeof opts.resolve === 'function' // otherwise, use the override resolver ? opts.resolve.call(null, id, basedir, importOptions) // otherwise, return the id to be resolved by postcss-import : id } }) }; const cssExtRegExp$1 = /\.css\b/g; const postcssPlugin = (commentsTransformer, opts) => root => { const promises = []; const insertedFilenames = {}; // use @import insertion point root.walkAtRules( importRegExp, atrule => { // get name as a fallback value for the library (e.g. @import-normalize is like @import "normalize.css") const name = atrule.name.match(importRegExp)[1]; // get url from "library", 'library', url("library"), url('library'), or the fallback value const url = (atrule.params.match(paramsRegExp) || []).slice(1).find(part => part) || name; if (url) { // get the css id by removing css extensions const cssId = url.replace(cssExtRegExp, ''); if (cssId in resolvedFilenamesById) { // promise the library import is replaced with its contents promises.push( Promise.all( resolvedFilenamesById[cssId].filter( // ignore filenames that have already been inserted filename => insertedFilenames[filename] = opts.allowDuplicates || !(filename in insertedFilenames) ).map( // parse the file (the file and css are conservatively cached) filename => parse(filename, commentsTransformer) ) ).then(roots => { if (roots.length) { // combine all the library nodes returned by the parsed files const nodes = roots.reduce( (all, root) => all.concat(root.nodes), [] ); // replace the import with all the library nodes atrule.replaceWith(...nodes); } }) ); } } } ); return Promise.all([].concat( // promise the library imports are replaced with their contents promises, // promise certain libraries are prepended Promise.all( [].concat( opts.forceImport || [] ).reduce( // filter the id to be a known id or boolean true (all, id) => { if (id === true) { all.push(...resolvedFilenamesById.normalize); } else if (typeof id === 'string') { const cssId = id.replace(cssExtRegExp, ''); if (cssId in resolvedFilenamesById) { all.push(...resolvedFilenamesById[cssId]); } } return all }, [] ).filter( // ignore filenames that have already been inserted filename => insertedFilenames[filename] = opts.allowDuplicates || !(filename in insertedFilenames) ).map( // parse the file (the file and css are conservatively cached) filename => parse(filename, commentsTransformer) ) ).then(roots => { if (roots.length) { // combine all the library nodes returned by the parsed files const nodes = roots.reduce( (all, root) => all.concat(root.nodes), [] ); // prepend the stylesheet with all the library nodes root.prepend(...nodes); } }) )) }; const cssExtRegExp = /\.css\b/g; const importRegExp = /^import(?:-(normalize|sanitize))?$/; const paramsRegExp = /^\s*(?:url\((?:"(.+)"|'(.+)')\)|"(.+)"|'(.+)')[\W\w]*$/; const plugin = opts => { opts = create(opts); const commentsTransformer = postcssBrowserComments(opts).Once; const normalizeTransformer = postcssPlugin(commentsTransformer, opts); const postcssImportConfig = postcssImportNormalize(commentsTransformer); return { postcssPlugin: 'postcss-normalize', Once(root) { return normalizeTransformer(root) }, postcssImport: postcssImportConfig } }; plugin.postcss = true; module.exports = plugin; ================================================ FILE: index.mjs ================================================ import postcssBrowserComments from 'postcss-browser-comments'; import path from 'node:path'; import { createRequire } from 'node:module'; import path$1 from 'path'; import fs from 'fs'; import postcss from 'postcss'; const assign = (...objects) => Object.assign(...objects); const create = (...objects) => assign(Object.create(null), ...objects); const require$1 = createRequire(import.meta.url); // get resolved filenames for normalize.css const normalizeCSS = require$1.resolve('@csstools/normalize.css'); const normalizeDir = path.dirname(normalizeCSS); const normalizeOpinionatedCSS = path.join(normalizeDir, 'opinionated.css'); // get resolved filenames for sanitize.css const sanitizeCSS = require$1.resolve('sanitize.css'); const sanitizeDir = path.dirname(sanitizeCSS); const sanitizeAssetsCSS = path.join(sanitizeDir, 'assets.css'); const sanitizeFormsCSS = path.join(sanitizeDir, 'forms.css'); const sanitizeReduceMotionCSS = path.join(sanitizeDir, 'reduce-motion.css'); const sanitizeTypographyCSS = path.join(sanitizeDir, 'typography.css'); const sanitizeSystemUiCSS = path.join(sanitizeDir, 'system-ui.css'); const sanitizeUiMonospace = path.join(sanitizeDir, 'ui-monospace.css'); // export a hashmap of css library filenames const parsableFilenames = create({ [normalizeCSS]: true, [normalizeOpinionatedCSS]: true, [sanitizeCSS]: true, [sanitizeAssetsCSS]: true, [sanitizeFormsCSS]: true, [sanitizeReduceMotionCSS]: true, [sanitizeTypographyCSS]: true, [sanitizeSystemUiCSS]: true, [sanitizeUiMonospace]: true, }); // export a hashmap of css library filenames by id const resolvedFilenamesById = create({ 'normalize': [normalizeCSS], 'normalize/opinionated': [normalizeOpinionatedCSS], 'normalize/*': [normalizeOpinionatedCSS], 'sanitize': [sanitizeCSS], 'sanitize/assets': [sanitizeAssetsCSS], 'sanitize/forms': [sanitizeCSS, sanitizeFormsCSS], 'sanitize/page': [sanitizeAssetsCSS], // deprecated; remaining for v10.0.0 compatibility 'sanitize/reduce-motion': [sanitizeCSS, sanitizeReduceMotionCSS], 'sanitize/system-ui': [sanitizeCSS, sanitizeSystemUiCSS], 'sanitize/typography': [sanitizeCSS, sanitizeTypographyCSS], 'sanitize/ui-monospace': [sanitizeCSS, sanitizeUiMonospace], 'sanitize/*': [sanitizeCSS, sanitizeFormsCSS], }); const cache$1 = create(); async function readFile (filename) { filename = path$1.resolve(filename); cache$1[filename] = cache$1[filename] || create(); return new Promise( (resolve, reject) => fs.stat( filename, (statsError, { mtime }) => statsError ? reject(statsError) : mtime === cache$1[filename].mtime ? resolve(cache$1[filename].data) : fs.readFile( filename, 'utf8', (readFileError, data) => readFileError ? reject(readFileError) : resolve( (cache$1[filename] = { data, mtime }).data ) ) ) ) } const cache = create(null); var parse = (filename, transformer) => readFile(filename).then( // cache the parsed css root css => (cache[css] = cache[css] || postcss.parse(css, { from: filename })) ).then( // clone the cached root root => root.clone() ).then( // transform the cloned root clone => Promise.resolve( transformer(clone) ).then( // resolve the cloned root () => clone ) ); var postcssImportNormalize = commentsTransformer => opts => { opts = create(opts); // return an postcss-import configuration return create({ load (filename, importOptions) { return filename in parsableFilenames // parse the file (the file and css are conservatively cached) ? parse(filename, commentsTransformer).then( root => root.toResult({ to: filename, map: true }).css ) : typeof opts.load === 'function' // otherwise, use the override loader ? opts.load.call(null, filename, importOptions) // otherwise, return the (conservatively cached) contents of the file : readFile(filename) }, resolve (id, basedir, importOptions) { // get the css id by removing css extensions const cssId = id.replace(cssExtRegExp$1, ''); return cssId in resolvedFilenamesById // return the known resolved path for the css id ? resolvedFilenamesById[cssId] : typeof opts.resolve === 'function' // otherwise, use the override resolver ? opts.resolve.call(null, id, basedir, importOptions) // otherwise, return the id to be resolved by postcss-import : id } }) }; const cssExtRegExp$1 = /\.css\b/g; const postcssPlugin = (commentsTransformer, opts) => root => { const promises = []; const insertedFilenames = {}; // use @import insertion point root.walkAtRules( importRegExp, atrule => { // get name as a fallback value for the library (e.g. @import-normalize is like @import "normalize.css") const name = atrule.name.match(importRegExp)[1]; // get url from "library", 'library', url("library"), url('library'), or the fallback value const url = (atrule.params.match(paramsRegExp) || []).slice(1).find(part => part) || name; if (url) { // get the css id by removing css extensions const cssId = url.replace(cssExtRegExp, ''); if (cssId in resolvedFilenamesById) { // promise the library import is replaced with its contents promises.push( Promise.all( resolvedFilenamesById[cssId].filter( // ignore filenames that have already been inserted filename => insertedFilenames[filename] = opts.allowDuplicates || !(filename in insertedFilenames) ).map( // parse the file (the file and css are conservatively cached) filename => parse(filename, commentsTransformer) ) ).then(roots => { if (roots.length) { // combine all the library nodes returned by the parsed files const nodes = roots.reduce( (all, root) => all.concat(root.nodes), [] ); // replace the import with all the library nodes atrule.replaceWith(...nodes); } }) ); } } } ); return Promise.all([].concat( // promise the library imports are replaced with their contents promises, // promise certain libraries are prepended Promise.all( [].concat( opts.forceImport || [] ).reduce( // filter the id to be a known id or boolean true (all, id) => { if (id === true) { all.push(...resolvedFilenamesById.normalize); } else if (typeof id === 'string') { const cssId = id.replace(cssExtRegExp, ''); if (cssId in resolvedFilenamesById) { all.push(...resolvedFilenamesById[cssId]); } } return all }, [] ).filter( // ignore filenames that have already been inserted filename => insertedFilenames[filename] = opts.allowDuplicates || !(filename in insertedFilenames) ).map( // parse the file (the file and css are conservatively cached) filename => parse(filename, commentsTransformer) ) ).then(roots => { if (roots.length) { // combine all the library nodes returned by the parsed files const nodes = roots.reduce( (all, root) => all.concat(root.nodes), [] ); // prepend the stylesheet with all the library nodes root.prepend(...nodes); } }) )) }; const cssExtRegExp = /\.css\b/g; const importRegExp = /^import(?:-(normalize|sanitize))?$/; const paramsRegExp = /^\s*(?:url\((?:"(.+)"|'(.+)')\)|"(.+)"|'(.+)')[\W\w]*$/; const plugin = opts => { opts = create(opts); const commentsTransformer = postcssBrowserComments(opts).Once; const normalizeTransformer = postcssPlugin(commentsTransformer, opts); const postcssImportConfig = postcssImportNormalize(commentsTransformer); return { postcssPlugin: 'postcss-normalize', Once(root) { return normalizeTransformer(root) }, postcssImport: postcssImportConfig } }; plugin.postcss = true; export { plugin as default }; ================================================ FILE: package.json ================================================ { "name": "postcss-normalize", "version": "13.0.1", "description": "Use the parts of normalize.css or sanitize.css you need from your browserslist", "author": "Jonathan Neal ", "license": "CC0-1.0", "repository": "csstools/postcss-normalize", "homepage": "https://github.com/csstools/postcss-normalize#readme", "bugs": "https://github.com/csstools/postcss-normalize/issues", "main": "./index.cjs", "module": "./index.mjs", "exports": { "require": "./index.cjs", "import": "./index.mjs", "default": "./index.mjs" }, "files": [ "index.cjs", "index.mjs" ], "scripts": { "prepublishOnly": "npm test", "build": "rollup --config .rollup.mjs --silent", "test": "npm run build && node --test", "test:rewrite-expects": "REWRITE_EXPECTS=true node --test" }, "engines": { "node": ">= 18" }, "peerDependencies": { "browserslist": ">= 4", "postcss": ">= 8" }, "dependencies": { "@csstools/normalize.css": "12.1.1", "postcss-browser-comments": "^6.0.1", "sanitize.css": "13.0.0" }, "devDependencies": { "@csstools/postcss-tape": "^5.0.0", "browserslist": "^4.16.5", "postcss": "^8.4.31", "postcss-import": "^16.0.0", "rollup": "^4.21.2" }, "babel": { "plugins": [ "@babel/plugin-syntax-import-meta" ], "presets": [ [ "@babel/env", { "targets": "maintained node versions" } ] ] }, "keywords": [ "postcss", "css", "postcss-plugin", "normalizes", "browsers", "fixes" ] } ================================================ FILE: src/index.js ================================================ import { create } from './lib/util' import postcssBrowserComments from 'postcss-browser-comments' import postcssImportNormalize from './lib/postcssImportNormalize' import postcssNormalize from './lib/postcssNormalize' const plugin = opts => { opts = create(opts) const commentsTransformer = postcssBrowserComments(opts).Once const normalizeTransformer = postcssNormalize(commentsTransformer, opts) const postcssImportConfig = postcssImportNormalize(commentsTransformer, opts) return { postcssPlugin: 'postcss-normalize', Once(root) { return normalizeTransformer(root) }, postcssImport: postcssImportConfig } } plugin.postcss = true export default plugin ================================================ FILE: src/lib/cssMap.js ================================================ import { create } from './util' import path from 'node:path' // get esm-compatible script metadata import { createRequire } from 'node:module' const require = createRequire(import.meta.url) // get resolved filenames for normalize.css const normalizeCSS = require.resolve('@csstools/normalize.css') const normalizeDir = path.dirname(normalizeCSS) const normalizeOpinionatedCSS = path.join(normalizeDir, 'opinionated.css') // get resolved filenames for sanitize.css const sanitizeCSS = require.resolve('sanitize.css') const sanitizeDir = path.dirname(sanitizeCSS) const sanitizeAssetsCSS = path.join(sanitizeDir, 'assets.css') const sanitizeFormsCSS = path.join(sanitizeDir, 'forms.css') const sanitizeReduceMotionCSS = path.join(sanitizeDir, 'reduce-motion.css') const sanitizeTypographyCSS = path.join(sanitizeDir, 'typography.css') const sanitizeSystemUiCSS = path.join(sanitizeDir, 'system-ui.css') const sanitizeUiMonospace = path.join(sanitizeDir, 'ui-monospace.css') // export a hashmap of css library filenames export const parsableFilenames = create({ [normalizeCSS]: true, [normalizeOpinionatedCSS]: true, [sanitizeCSS]: true, [sanitizeAssetsCSS]: true, [sanitizeFormsCSS]: true, [sanitizeReduceMotionCSS]: true, [sanitizeTypographyCSS]: true, [sanitizeSystemUiCSS]: true, [sanitizeUiMonospace]: true, }) // export a hashmap of css library filenames by id export const resolvedFilenamesById = create({ 'normalize': [normalizeCSS], 'normalize/opinionated': [normalizeOpinionatedCSS], 'normalize/*': [normalizeOpinionatedCSS], 'sanitize': [sanitizeCSS], 'sanitize/assets': [sanitizeAssetsCSS], 'sanitize/forms': [sanitizeCSS, sanitizeFormsCSS], 'sanitize/page': [sanitizeAssetsCSS], // deprecated; remaining for v10.0.0 compatibility 'sanitize/reduce-motion': [sanitizeCSS, sanitizeReduceMotionCSS], 'sanitize/system-ui': [sanitizeCSS, sanitizeSystemUiCSS], 'sanitize/typography': [sanitizeCSS, sanitizeTypographyCSS], 'sanitize/ui-monospace': [sanitizeCSS, sanitizeUiMonospace], 'sanitize/*': [sanitizeCSS, sanitizeFormsCSS], }) ================================================ FILE: src/lib/parse.js ================================================ import { create } from './util' import readFile from './readFile' import postcss from 'postcss' const cache = create(null) export default (filename, transformer) => readFile(filename).then( // cache the parsed css root css => (cache[css] = cache[css] || postcss.parse(css, { from: filename })) ).then( // clone the cached root root => root.clone() ).then( // transform the cloned root clone => Promise.resolve( transformer(clone) ).then( // resolve the cloned root () => clone ) ) ================================================ FILE: src/lib/postcssImportNormalize.js ================================================ import { create } from './util' import { parsableFilenames, resolvedFilenamesById } from './cssMap' import parse from './parse' import readFile from './readFile' export default commentsTransformer => opts => { opts = create(opts) // return an postcss-import configuration return create({ load (filename, importOptions) { return filename in parsableFilenames // parse the file (the file and css are conservatively cached) ? parse(filename, commentsTransformer).then( root => root.toResult({ to: filename, map: true }).css ) : typeof opts.load === 'function' // otherwise, use the override loader ? opts.load.call(null, filename, importOptions) // otherwise, return the (conservatively cached) contents of the file : readFile(filename) }, resolve (id, basedir, importOptions) { // get the css id by removing css extensions const cssId = id.replace(cssExtRegExp, '') return cssId in resolvedFilenamesById // return the known resolved path for the css id ? resolvedFilenamesById[cssId] : typeof opts.resolve === 'function' // otherwise, use the override resolver ? opts.resolve.call(null, id, basedir, importOptions) // otherwise, return the id to be resolved by postcss-import : id } }) } const cssExtRegExp = /\.css\b/g ================================================ FILE: src/lib/postcssNormalize.js ================================================ import { resolvedFilenamesById } from './cssMap' import parse from './parse' const postcssPlugin = (commentsTransformer, opts) => root => { const promises = [] const insertedFilenames = {} // use @import insertion point root.walkAtRules( importRegExp, atrule => { // get name as a fallback value for the library (e.g. @import-normalize is like @import "normalize.css") const name = atrule.name.match(importRegExp)[1] // get url from "library", 'library', url("library"), url('library'), or the fallback value const url = (atrule.params.match(paramsRegExp) || []).slice(1).find(part => part) || name if (url) { // get the css id by removing css extensions const cssId = url.replace(cssExtRegExp, '') if (cssId in resolvedFilenamesById) { // promise the library import is replaced with its contents promises.push( Promise.all( resolvedFilenamesById[cssId].filter( // ignore filenames that have already been inserted filename => insertedFilenames[filename] = opts.allowDuplicates || !(filename in insertedFilenames) ).map( // parse the file (the file and css are conservatively cached) filename => parse(filename, commentsTransformer) ) ).then(roots => { if (roots.length) { // combine all the library nodes returned by the parsed files const nodes = roots.reduce( (all, root) => all.concat(root.nodes), [] ) // replace the import with all the library nodes atrule.replaceWith(...nodes) } }) ) } } } ) return Promise.all([].concat( // promise the library imports are replaced with their contents promises, // promise certain libraries are prepended Promise.all( [].concat( opts.forceImport || [] ).reduce( // filter the id to be a known id or boolean true (all, id) => { if (id === true) { all.push(...resolvedFilenamesById.normalize) } else if (typeof id === 'string') { const cssId = id.replace(cssExtRegExp, '') if (cssId in resolvedFilenamesById) { all.push(...resolvedFilenamesById[cssId]) } } return all }, [] ).filter( // ignore filenames that have already been inserted filename => insertedFilenames[filename] = opts.allowDuplicates || !(filename in insertedFilenames) ).map( // parse the file (the file and css are conservatively cached) filename => parse(filename, commentsTransformer) ) ).then(roots => { if (roots.length) { // combine all the library nodes returned by the parsed files const nodes = roots.reduce( (all, root) => all.concat(root.nodes), [] ) // prepend the stylesheet with all the library nodes root.prepend(...nodes) } }) )) } const cssExtRegExp = /\.css\b/g const importRegExp = /^import(?:-(normalize|sanitize))?$/ const paramsRegExp = /^\s*(?:url\((?:"(.+)"|'(.+)')\)|"(.+)"|'(.+)')[\W\w]*$/ export default postcssPlugin ================================================ FILE: src/lib/readFile.js ================================================ import { create } from './util' import path from 'path' import fs from 'fs' const cache = create() export default async function readFile (filename) { filename = path.resolve(filename) cache[filename] = cache[filename] || create() return new Promise( (resolve, reject) => fs.stat( filename, (statsError, { mtime }) => statsError ? reject(statsError) : mtime === cache[filename].mtime ? resolve(cache[filename].data) : fs.readFile( filename, 'utf8', (readFileError, data) => readFileError ? reject(readFileError) : resolve( (cache[filename] = { data, mtime }).data ) ) ) ) } ================================================ FILE: src/lib/util.js ================================================ export const assign = (...objects) => Object.assign(...objects) export const create = (...objects) => assign(Object.create(null), ...objects) ================================================ FILE: test/_import.mjs ================================================ import plugin from 'postcss-normalize'; import postcss from 'postcss'; import assert from 'node:assert'; postcss([plugin()]).process('@import "sanitize.css"', { from: null }).then((result) => { assert.ok(result.css.includes(':where(')); }); postcss([plugin()]).process('@import "normalize.css"', { from: null }).then((result) => { assert.ok(result.css.includes(':where(')); }); ================================================ FILE: test/_require.cjs ================================================ const plugin = require('postcss-normalize'); const postcss = require('postcss'); const assert = require('node:assert'); postcss([plugin()]).process('@import "sanitize.css"', { from: null }).then((result) => { assert.ok(result.css.includes(':where(')); }); postcss([plugin()]).process('@import "normalize.css"', { from: null }).then((result) => { assert.ok(result.css.includes(':where(')); }); ================================================ FILE: test/_tape.mjs ================================================ import { postcssTape } from '@csstools/postcss-tape'; import plugin from 'postcss-normalize'; import postcss from 'postcss'; import postcssImport from 'postcss-import'; const fixed_browserslist = [ "IE 10", "ie_mob 10", "Safari 7", "iOS 7", "Chrome 60", "ChromeAndroid 60", "Firefox 60", "FirefoxAndroid 60", "Edge 16", "> 0.01%" ] postcssTape(plugin)({ /* Test Basic Usage */ 'basic-normalize': { message: 'supports @import-normalize usage', options: { browsers: fixed_browserslist } }, 'basic-normalize-opinionated': { message: 'supports @import-normalize "opinionated.css" usage', options: { browsers: fixed_browserslist } }, 'basic-sanitize': { message: 'supports @import-sanitize usage', options: { browsers: fixed_browserslist } }, /* Test @import Usage */ 'import-normalize': { message: 'supports @import "normalize" usage', options: { browsers: fixed_browserslist }, expect: "normalize.expect.css" }, 'import-normalize-opinionated': { message: 'supports @import "normalize/opinionated" usage', options: { browsers: fixed_browserslist } }, 'import-sanitize': { message: 'supports @import "sanitize" usage', options: { browsers: fixed_browserslist }, expect: "sanitize.expect.css" }, 'import-sanitize-forms': { message: 'supports @import "sanitize/forms" usage', options: { browsers: fixed_browserslist } }, 'import-sanitize-all': { message: 'supports @import "sanitize/*" + (forms + page + typography) usage', options: { browsers: fixed_browserslist } }, /* Test { browsers } Usage */ 'browsers-normalize': { message: 'supports { browsers: "last 2 * versions, not EdgeHTML" }', options: { browsers: 'last 2 chrome versions, edge >= 72, last 2 firefox versions, last 2 safari versions, last 1 ios versions, last 1 android versions' } }, /* Test { forceImport } Usage */ 'force-normalize': { message: 'supports { forceImport: true }', options: { forceImport: true, browsers: fixed_browserslist } }, 'force-sanitize': { message: 'supports { forceImport: "sanitize" }', options: { forceImport: 'sanitize', browsers: fixed_browserslist } }, 'force-sanitize-all': { message: 'supports { forceImport: "sanitize/*" }', options: { forceImport: 'sanitize/*', browsers: fixed_browserslist } }, /* Test { allowDuplicates } Usage */ 'duplicates': { message: 'supports preventing duplicates', options: { browsers: fixed_browserslist } }, 'duplicates:allow': { message: 'supports allowing duplicates { allowDuplicates: true }', options: { allowDuplicates: true, browsers: fixed_browserslist } }, /* Test PostCSS Import Usage */ 'postcss-import': { message: 'supports PostCSS Import Usage', source: 'import-normalize.css', plugins: [(() => { return postcss([postcssImport(plugin({ browsers: fixed_browserslist }).postcssImport()) ]) })()] } }) ================================================ FILE: test/basic-normalize-opinionated.css ================================================ @import-normalize "normalize/opinionated.css"; body { font-family: sans-serif; } ================================================ FILE: test/basic-normalize-opinionated.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Remove the margin in all browsers. (opinionated) */ :where(body) { margin: 0; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } body { font-family: sans-serif; } ================================================ FILE: test/basic-normalize.css ================================================ @import-normalize; body { font-family: sans-serif; } ================================================ FILE: test/basic-normalize.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } body { font-family: sans-serif; } ================================================ FILE: test/basic-sanitize.css ================================================ @import-sanitize; body { display: flex; } ================================================ FILE: test/basic-sanitize.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Add border box sizing in all browsers (opinionated). * 2. Backgrounds do not repeat by default (opinionated). */ *, ::before, ::after { box-sizing: border-box; /* 1 */ } /** * 1. Add text decoration inheritance in all browsers (opinionated). * 2. Add vertical alignment inheritance in all browsers (opinionated). */ ::before, ::after { text-decoration: inherit; /* 1 */ vertical-align: inherit; /* 2 */ } /** * 1. Use the default cursor in all browsers (opinionated). * 2. Change the line height in all browsers (opinionated). * 3. Breaks words to prevent overflow in all browsers (opinionated). * 4. Use a 4-space tab width in all browsers (opinionated). * 5. Remove the grey highlight on links in iOS (opinionated). * 6. Prevent adjustments of font size after orientation changes in iOS. */ :where(:root) { cursor: default; /* 1 */ line-height: 1.5; /* 2 */ overflow-wrap: break-word; /* 3 */ -moz-tab-size: 4; /* 4 */ tab-size: 4; /* 4 */ -webkit-tap-highlight-color: transparent; /* 5 */ -webkit-text-size-adjust: 100%; /* 6 */ } /* Sections * ========================================================================== */ /** * Remove the margin in all browsers (opinionated). */ :where(body) { margin: 0; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin: 0.67em 0; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin: 0; } /** * 1. Correct the inheritance of border color in Firefox. * 2. Add the correct box sizing in Firefox. */ :where(hr) { color: inherit; /* 1 */ height: 0; /* 2 */ } /** * Remove the list style on navigation lists in all browsers (opinionated). */ :where(nav) :where(ol, ul) { list-style-type: none; padding: 0; } /** * Prevent VoiceOver from ignoring list semantics in Safari (opinionated). */ :where(nav li)::before { content: "\200B"; float: left; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. * 3. Prevent overflow of the container in all browsers (opinionated). */ :where(pre) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ overflow: auto; /* 3 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Embedded content * ========================================================================== */ /* * Change the alignment on media elements in all browsers (opinionated). */ :where(audio, canvas, iframe, img, svg, video) { vertical-align: middle; } /** * Remove the border on iframes in all browsers (opinionated). */ :where(iframe) { border-style: none; } /** * Change the fill color to match the text color in all browsers (opinionated). */ :where(svg:not([fill])) { fill: currentColor; } /* Tabular data * ========================================================================== */ /** * 1. Collapse border spacing in all browsers (opinionated). * 2. Correct table border color inheritance in all Chrome, Edge, and Safari. * 3. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-collapse: collapse; /* 1 */ border-color: inherit; /* 2 */ text-indent: 0; /* 3 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, [type="button" i], [type="reset" i], [type="submit" i]) { -webkit-appearance: button; } /** * Change the inconsistent appearance in all browsers (opinionated). */ :where(fieldset) { border: 1px solid #a0a0a0; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * 1. Remove the margin in Firefox and Safari. * 3. Change the resize direction in all browsers (opinionated). */ :where(textarea) { margin: 0; /* 1 */ resize: vertical; /* 3 */ } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where([type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in Safari. */ :where(details > summary:first-of-type) { display: list-item; } /* Accessibility * ========================================================================== */ /** * Change the cursor on busy elements in all browsers (opinionated). */ :where([aria-busy="true" i]) { cursor: progress; } /* * Change the cursor on control elements in all browsers (opinionated). */ :where([aria-controls]) { cursor: pointer; } /* * Change the cursor on disabled, not-editable, or otherwise * inoperable elements in all browsers (opinionated). */ :where([aria-disabled="true" i], [disabled]) { cursor: not-allowed; } /* * Change the display on visually hidden accessible elements * in all browsers (opinionated). */ :where([aria-hidden="false" i][hidden]) { display: initial; } :where([aria-hidden="false" i][hidden]:not(:focus)) { clip: rect(0, 0, 0, 0); position: absolute; } body { display: flex; } ================================================ FILE: test/browsers-normalize.css ================================================ ================================================ FILE: test/browsers-normalize.expect.css ================================================ ================================================ FILE: test/duplicates.allow.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } body { display: flex; } ================================================ FILE: test/duplicates.css ================================================ @import-normalize; @import-normalize; body { display: flex; } ================================================ FILE: test/duplicates.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } @import-normalize; body { display: flex; } ================================================ FILE: test/force-normalize.css ================================================ ================================================ FILE: test/force-normalize.expect.css ================================================ /* Document * ========================================================================== *//** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ }/* Sections * ========================================================================== *//** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; }/* Grouping content * ========================================================================== *//** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; }/** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ }/* Text-level semantics * ========================================================================== *//** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; }/** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }/** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; }/* Tabular data * ========================================================================== *//** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ }/* Forms * ========================================================================== *//** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; }/** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; }/** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; }/** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; }/** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; }/** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; }/** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }/** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }/** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; }/** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; }/** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }/** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; }/** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; }/** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; }/* Interactive * ========================================================================== *//* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; }/* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } ================================================ FILE: test/force-sanitize-all.css ================================================ ================================================ FILE: test/force-sanitize-all.expect.css ================================================ /* Document * ========================================================================== *//** * 1. Add border box sizing in all browsers (opinionated). * 2. Backgrounds do not repeat by default (opinionated). */ *, ::before, ::after { box-sizing: border-box; /* 1 */ }/** * 1. Add text decoration inheritance in all browsers (opinionated). * 2. Add vertical alignment inheritance in all browsers (opinionated). */ ::before, ::after { text-decoration: inherit; /* 1 */ vertical-align: inherit; /* 2 */ }/** * 1. Use the default cursor in all browsers (opinionated). * 2. Change the line height in all browsers (opinionated). * 3. Breaks words to prevent overflow in all browsers (opinionated). * 4. Use a 4-space tab width in all browsers (opinionated). * 5. Remove the grey highlight on links in iOS (opinionated). * 6. Prevent adjustments of font size after orientation changes in iOS. */ :where(:root) { cursor: default; /* 1 */ line-height: 1.5; /* 2 */ overflow-wrap: break-word; /* 3 */ -moz-tab-size: 4; /* 4 */ tab-size: 4; /* 4 */ -webkit-tap-highlight-color: transparent; /* 5 */ -webkit-text-size-adjust: 100%; /* 6 */ }/* Sections * ========================================================================== *//** * Remove the margin in all browsers (opinionated). */ :where(body) { margin: 0; }/** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin: 0.67em 0; }/* Grouping content * ========================================================================== *//** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin: 0; }/** * 1. Correct the inheritance of border color in Firefox. * 2. Add the correct box sizing in Firefox. */ :where(hr) { color: inherit; /* 1 */ height: 0; /* 2 */ }/** * Remove the list style on navigation lists in all browsers (opinionated). */ :where(nav) :where(ol, ul) { list-style-type: none; padding: 0; }/** * Prevent VoiceOver from ignoring list semantics in Safari (opinionated). */ :where(nav li)::before { content: "\200B"; float: left; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. * 3. Prevent overflow of the container in all browsers (opinionated). */ :where(pre) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ overflow: auto; /* 3 */ }/* Text-level semantics * ========================================================================== *//** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; }/** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }/** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; }/* Embedded content * ========================================================================== *//* * Change the alignment on media elements in all browsers (opinionated). */ :where(audio, canvas, iframe, img, svg, video) { vertical-align: middle; }/** * Remove the border on iframes in all browsers (opinionated). */ :where(iframe) { border-style: none; }/** * Change the fill color to match the text color in all browsers (opinionated). */ :where(svg:not([fill])) { fill: currentColor; }/* Tabular data * ========================================================================== *//** * 1. Collapse border spacing in all browsers (opinionated). * 2. Correct table border color inheritance in all Chrome, Edge, and Safari. * 3. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-collapse: collapse; /* 1 */ border-color: inherit; /* 2 */ text-indent: 0; /* 3 */ }/* Forms * ========================================================================== *//** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; }/** * Correct the inability to style buttons in iOS and Safari. */ :where(button, [type="button" i], [type="reset" i], [type="submit" i]) { -webkit-appearance: button; }/** * Change the inconsistent appearance in all browsers (opinionated). */ :where(fieldset) { border: 1px solid #a0a0a0; }/** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; }/** * 1. Remove the margin in Firefox and Safari. * 3. Change the resize direction in all browsers (opinionated). */ :where(textarea) { margin: 0; /* 1 */ resize: vertical; /* 3 */ }/** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where([type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }/** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }/** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; }/** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; }/** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }/* Interactive * ========================================================================== *//* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; }/* * Add the correct display in Safari. */ :where(details > summary:first-of-type) { display: list-item; }/* Accessibility * ========================================================================== *//** * Change the cursor on busy elements in all browsers (opinionated). */ :where([aria-busy="true" i]) { cursor: progress; }/* * Change the cursor on control elements in all browsers (opinionated). */ :where([aria-controls]) { cursor: pointer; }/* * Change the cursor on disabled, not-editable, or otherwise * inoperable elements in all browsers (opinionated). */ :where([aria-disabled="true" i], [disabled]) { cursor: not-allowed; }/* * Change the display on visually hidden accessible elements * in all browsers (opinionated). */ :where([aria-hidden="false" i][hidden]) { display: initial; } :where([aria-hidden="false" i][hidden]:not(:focus)) { clip: rect(0, 0, 0, 0); position: absolute; }/** * 1. Change the inconsistent appearance in all browsers (opinionated). * 2. Add typography inheritance in all browsers (opinionated). */ :where(button, input, select, textarea) { background-color: transparent; /* 1 */ border: 1px solid WindowFrame; /* 1 */ color: inherit; /* 1 */ font: inherit; /* 2 */ letter-spacing: inherit; /* 2 */ padding: 0.25em 0.375em; /* 1 */ }/** * Change the inconsistent appearance in all browsers (opinionated). */ :where(select) { appearance: none; background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='4'%3E%3Cpath d='M4 0h6L7 4'/%3E%3C/svg%3E") no-repeat right center / 1em; border-radius: 0; padding-right: 1em; }/** * Remove the border and padding in all browsers (opinionated). */ :where([type="color" i], [type="range" i]) { border-width: 0; padding: 0; } ================================================ FILE: test/force-sanitize.css ================================================ ================================================ FILE: test/force-sanitize.expect.css ================================================ /* Document * ========================================================================== *//** * 1. Add border box sizing in all browsers (opinionated). * 2. Backgrounds do not repeat by default (opinionated). */ *, ::before, ::after { box-sizing: border-box; /* 1 */ }/** * 1. Add text decoration inheritance in all browsers (opinionated). * 2. Add vertical alignment inheritance in all browsers (opinionated). */ ::before, ::after { text-decoration: inherit; /* 1 */ vertical-align: inherit; /* 2 */ }/** * 1. Use the default cursor in all browsers (opinionated). * 2. Change the line height in all browsers (opinionated). * 3. Breaks words to prevent overflow in all browsers (opinionated). * 4. Use a 4-space tab width in all browsers (opinionated). * 5. Remove the grey highlight on links in iOS (opinionated). * 6. Prevent adjustments of font size after orientation changes in iOS. */ :where(:root) { cursor: default; /* 1 */ line-height: 1.5; /* 2 */ overflow-wrap: break-word; /* 3 */ -moz-tab-size: 4; /* 4 */ tab-size: 4; /* 4 */ -webkit-tap-highlight-color: transparent; /* 5 */ -webkit-text-size-adjust: 100%; /* 6 */ }/* Sections * ========================================================================== *//** * Remove the margin in all browsers (opinionated). */ :where(body) { margin: 0; }/** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin: 0.67em 0; }/* Grouping content * ========================================================================== *//** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin: 0; }/** * 1. Correct the inheritance of border color in Firefox. * 2. Add the correct box sizing in Firefox. */ :where(hr) { color: inherit; /* 1 */ height: 0; /* 2 */ }/** * Remove the list style on navigation lists in all browsers (opinionated). */ :where(nav) :where(ol, ul) { list-style-type: none; padding: 0; }/** * Prevent VoiceOver from ignoring list semantics in Safari (opinionated). */ :where(nav li)::before { content: "\200B"; float: left; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. * 3. Prevent overflow of the container in all browsers (opinionated). */ :where(pre) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ overflow: auto; /* 3 */ }/* Text-level semantics * ========================================================================== *//** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; }/** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }/** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; }/* Embedded content * ========================================================================== *//* * Change the alignment on media elements in all browsers (opinionated). */ :where(audio, canvas, iframe, img, svg, video) { vertical-align: middle; }/** * Remove the border on iframes in all browsers (opinionated). */ :where(iframe) { border-style: none; }/** * Change the fill color to match the text color in all browsers (opinionated). */ :where(svg:not([fill])) { fill: currentColor; }/* Tabular data * ========================================================================== *//** * 1. Collapse border spacing in all browsers (opinionated). * 2. Correct table border color inheritance in all Chrome, Edge, and Safari. * 3. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-collapse: collapse; /* 1 */ border-color: inherit; /* 2 */ text-indent: 0; /* 3 */ }/* Forms * ========================================================================== *//** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; }/** * Correct the inability to style buttons in iOS and Safari. */ :where(button, [type="button" i], [type="reset" i], [type="submit" i]) { -webkit-appearance: button; }/** * Change the inconsistent appearance in all browsers (opinionated). */ :where(fieldset) { border: 1px solid #a0a0a0; }/** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; }/** * 1. Remove the margin in Firefox and Safari. * 3. Change the resize direction in all browsers (opinionated). */ :where(textarea) { margin: 0; /* 1 */ resize: vertical; /* 3 */ }/** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where([type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }/** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }/** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; }/** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; }/** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }/* Interactive * ========================================================================== *//* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; }/* * Add the correct display in Safari. */ :where(details > summary:first-of-type) { display: list-item; }/* Accessibility * ========================================================================== *//** * Change the cursor on busy elements in all browsers (opinionated). */ :where([aria-busy="true" i]) { cursor: progress; }/* * Change the cursor on control elements in all browsers (opinionated). */ :where([aria-controls]) { cursor: pointer; }/* * Change the cursor on disabled, not-editable, or otherwise * inoperable elements in all browsers (opinionated). */ :where([aria-disabled="true" i], [disabled]) { cursor: not-allowed; }/* * Change the display on visually hidden accessible elements * in all browsers (opinionated). */ :where([aria-hidden="false" i][hidden]) { display: initial; } :where([aria-hidden="false" i][hidden]:not(:focus)) { clip: rect(0, 0, 0, 0); position: absolute; } ================================================ FILE: test/import-normalize-opinionated.css ================================================ @import "normalize/opinionated"; body { font-family: sans-serif; } ================================================ FILE: test/import-normalize-opinionated.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Remove the margin in all browsers. (opinionated) */ :where(body) { margin: 0; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } body { font-family: sans-serif; } ================================================ FILE: test/import-normalize.css ================================================ @import "normalize"; body { font-family: sans-serif; } ================================================ FILE: test/import-normalize.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } body { font-family: sans-serif; } ================================================ FILE: test/import-sanitize-all.css ================================================ @import "sanitize/*"; ================================================ FILE: test/import-sanitize-all.expect.css ================================================ /* Document * ========================================================================== *//** * 1. Add border box sizing in all browsers (opinionated). * 2. Backgrounds do not repeat by default (opinionated). */ *, ::before, ::after { box-sizing: border-box; /* 1 */ }/** * 1. Add text decoration inheritance in all browsers (opinionated). * 2. Add vertical alignment inheritance in all browsers (opinionated). */ ::before, ::after { text-decoration: inherit; /* 1 */ vertical-align: inherit; /* 2 */ }/** * 1. Use the default cursor in all browsers (opinionated). * 2. Change the line height in all browsers (opinionated). * 3. Breaks words to prevent overflow in all browsers (opinionated). * 4. Use a 4-space tab width in all browsers (opinionated). * 5. Remove the grey highlight on links in iOS (opinionated). * 6. Prevent adjustments of font size after orientation changes in iOS. */ :where(:root) { cursor: default; /* 1 */ line-height: 1.5; /* 2 */ overflow-wrap: break-word; /* 3 */ -moz-tab-size: 4; /* 4 */ tab-size: 4; /* 4 */ -webkit-tap-highlight-color: transparent; /* 5 */ -webkit-text-size-adjust: 100%; /* 6 */ }/* Sections * ========================================================================== *//** * Remove the margin in all browsers (opinionated). */ :where(body) { margin: 0; }/** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin: 0.67em 0; }/* Grouping content * ========================================================================== *//** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin: 0; }/** * 1. Correct the inheritance of border color in Firefox. * 2. Add the correct box sizing in Firefox. */ :where(hr) { color: inherit; /* 1 */ height: 0; /* 2 */ }/** * Remove the list style on navigation lists in all browsers (opinionated). */ :where(nav) :where(ol, ul) { list-style-type: none; padding: 0; }/** * Prevent VoiceOver from ignoring list semantics in Safari (opinionated). */ :where(nav li)::before { content: "\200B"; float: left; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. * 3. Prevent overflow of the container in all browsers (opinionated). */ :where(pre) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ overflow: auto; /* 3 */ }/* Text-level semantics * ========================================================================== *//** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; }/** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }/** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; }/* Embedded content * ========================================================================== *//* * Change the alignment on media elements in all browsers (opinionated). */ :where(audio, canvas, iframe, img, svg, video) { vertical-align: middle; }/** * Remove the border on iframes in all browsers (opinionated). */ :where(iframe) { border-style: none; }/** * Change the fill color to match the text color in all browsers (opinionated). */ :where(svg:not([fill])) { fill: currentColor; }/* Tabular data * ========================================================================== *//** * 1. Collapse border spacing in all browsers (opinionated). * 2. Correct table border color inheritance in all Chrome, Edge, and Safari. * 3. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-collapse: collapse; /* 1 */ border-color: inherit; /* 2 */ text-indent: 0; /* 3 */ }/* Forms * ========================================================================== *//** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; }/** * Correct the inability to style buttons in iOS and Safari. */ :where(button, [type="button" i], [type="reset" i], [type="submit" i]) { -webkit-appearance: button; }/** * Change the inconsistent appearance in all browsers (opinionated). */ :where(fieldset) { border: 1px solid #a0a0a0; }/** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; }/** * 1. Remove the margin in Firefox and Safari. * 3. Change the resize direction in all browsers (opinionated). */ :where(textarea) { margin: 0; /* 1 */ resize: vertical; /* 3 */ }/** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where([type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }/** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }/** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; }/** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; }/** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }/* Interactive * ========================================================================== *//* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; }/* * Add the correct display in Safari. */ :where(details > summary:first-of-type) { display: list-item; }/* Accessibility * ========================================================================== *//** * Change the cursor on busy elements in all browsers (opinionated). */ :where([aria-busy="true" i]) { cursor: progress; }/* * Change the cursor on control elements in all browsers (opinionated). */ :where([aria-controls]) { cursor: pointer; }/* * Change the cursor on disabled, not-editable, or otherwise * inoperable elements in all browsers (opinionated). */ :where([aria-disabled="true" i], [disabled]) { cursor: not-allowed; }/* * Change the display on visually hidden accessible elements * in all browsers (opinionated). */ :where([aria-hidden="false" i][hidden]) { display: initial; } :where([aria-hidden="false" i][hidden]:not(:focus)) { clip: rect(0, 0, 0, 0); position: absolute; }/** * 1. Change the inconsistent appearance in all browsers (opinionated). * 2. Add typography inheritance in all browsers (opinionated). */ :where(button, input, select, textarea) { background-color: transparent; /* 1 */ border: 1px solid WindowFrame; /* 1 */ color: inherit; /* 1 */ font: inherit; /* 2 */ letter-spacing: inherit; /* 2 */ padding: 0.25em 0.375em; /* 1 */ }/** * Change the inconsistent appearance in all browsers (opinionated). */ :where(select) { appearance: none; background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='4'%3E%3Cpath d='M4 0h6L7 4'/%3E%3C/svg%3E") no-repeat right center / 1em; border-radius: 0; padding-right: 1em; }/** * Remove the border and padding in all browsers (opinionated). */ :where([type="color" i], [type="range" i]) { border-width: 0; padding: 0; } ================================================ FILE: test/import-sanitize-forms.css ================================================ @import "sanitize/forms"; ================================================ FILE: test/import-sanitize-forms.expect.css ================================================ /* Document * ========================================================================== *//** * 1. Add border box sizing in all browsers (opinionated). * 2. Backgrounds do not repeat by default (opinionated). */ *, ::before, ::after { box-sizing: border-box; /* 1 */ }/** * 1. Add text decoration inheritance in all browsers (opinionated). * 2. Add vertical alignment inheritance in all browsers (opinionated). */ ::before, ::after { text-decoration: inherit; /* 1 */ vertical-align: inherit; /* 2 */ }/** * 1. Use the default cursor in all browsers (opinionated). * 2. Change the line height in all browsers (opinionated). * 3. Breaks words to prevent overflow in all browsers (opinionated). * 4. Use a 4-space tab width in all browsers (opinionated). * 5. Remove the grey highlight on links in iOS (opinionated). * 6. Prevent adjustments of font size after orientation changes in iOS. */ :where(:root) { cursor: default; /* 1 */ line-height: 1.5; /* 2 */ overflow-wrap: break-word; /* 3 */ -moz-tab-size: 4; /* 4 */ tab-size: 4; /* 4 */ -webkit-tap-highlight-color: transparent; /* 5 */ -webkit-text-size-adjust: 100%; /* 6 */ }/* Sections * ========================================================================== *//** * Remove the margin in all browsers (opinionated). */ :where(body) { margin: 0; }/** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin: 0.67em 0; }/* Grouping content * ========================================================================== *//** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin: 0; }/** * 1. Correct the inheritance of border color in Firefox. * 2. Add the correct box sizing in Firefox. */ :where(hr) { color: inherit; /* 1 */ height: 0; /* 2 */ }/** * Remove the list style on navigation lists in all browsers (opinionated). */ :where(nav) :where(ol, ul) { list-style-type: none; padding: 0; }/** * Prevent VoiceOver from ignoring list semantics in Safari (opinionated). */ :where(nav li)::before { content: "\200B"; float: left; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. * 3. Prevent overflow of the container in all browsers (opinionated). */ :where(pre) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ overflow: auto; /* 3 */ }/* Text-level semantics * ========================================================================== *//** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; }/** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; }/** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }/** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; }/* Embedded content * ========================================================================== *//* * Change the alignment on media elements in all browsers (opinionated). */ :where(audio, canvas, iframe, img, svg, video) { vertical-align: middle; }/** * Remove the border on iframes in all browsers (opinionated). */ :where(iframe) { border-style: none; }/** * Change the fill color to match the text color in all browsers (opinionated). */ :where(svg:not([fill])) { fill: currentColor; }/* Tabular data * ========================================================================== *//** * 1. Collapse border spacing in all browsers (opinionated). * 2. Correct table border color inheritance in all Chrome, Edge, and Safari. * 3. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-collapse: collapse; /* 1 */ border-color: inherit; /* 2 */ text-indent: 0; /* 3 */ }/* Forms * ========================================================================== *//** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; }/** * Correct the inability to style buttons in iOS and Safari. */ :where(button, [type="button" i], [type="reset" i], [type="submit" i]) { -webkit-appearance: button; }/** * Change the inconsistent appearance in all browsers (opinionated). */ :where(fieldset) { border: 1px solid #a0a0a0; }/** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; }/** * 1. Remove the margin in Firefox and Safari. * 3. Change the resize direction in all browsers (opinionated). */ :where(textarea) { margin: 0; /* 1 */ resize: vertical; /* 3 */ }/** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where([type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }/** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }/** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; }/** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; }/** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }/* Interactive * ========================================================================== *//* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; }/* * Add the correct display in Safari. */ :where(details > summary:first-of-type) { display: list-item; }/* Accessibility * ========================================================================== *//** * Change the cursor on busy elements in all browsers (opinionated). */ :where([aria-busy="true" i]) { cursor: progress; }/* * Change the cursor on control elements in all browsers (opinionated). */ :where([aria-controls]) { cursor: pointer; }/* * Change the cursor on disabled, not-editable, or otherwise * inoperable elements in all browsers (opinionated). */ :where([aria-disabled="true" i], [disabled]) { cursor: not-allowed; }/* * Change the display on visually hidden accessible elements * in all browsers (opinionated). */ :where([aria-hidden="false" i][hidden]) { display: initial; } :where([aria-hidden="false" i][hidden]:not(:focus)) { clip: rect(0, 0, 0, 0); position: absolute; }/** * 1. Change the inconsistent appearance in all browsers (opinionated). * 2. Add typography inheritance in all browsers (opinionated). */ :where(button, input, select, textarea) { background-color: transparent; /* 1 */ border: 1px solid WindowFrame; /* 1 */ color: inherit; /* 1 */ font: inherit; /* 2 */ letter-spacing: inherit; /* 2 */ padding: 0.25em 0.375em; /* 1 */ }/** * Change the inconsistent appearance in all browsers (opinionated). */ :where(select) { appearance: none; background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='4'%3E%3Cpath d='M4 0h6L7 4'/%3E%3C/svg%3E") no-repeat right center / 1em; border-radius: 0; padding-right: 1em; }/** * Remove the border and padding in all browsers (opinionated). */ :where([type="color" i], [type="range" i]) { border-width: 0; padding: 0; } ================================================ FILE: test/import-sanitize.css ================================================ @import "sanitize"; body { font-family: sans-serif; } ================================================ FILE: test/normalize.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } body { font-family: sans-serif; } ================================================ FILE: test/postcss-import.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in iOS. */ :where(html) { line-height: 1.15; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ text-size-adjust: 100%; /* 2 */ } /* Sections * ========================================================================== */ /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin-block-end: 0.67em; margin-block-start: 0.67em; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin-block-end: 0; margin-block-start: 0; } /** * 1. Add the correct box sizing in Firefox. * 2. Correct the inheritance of border color in Firefox. */ :where(hr) { box-sizing: content-box; /* 1 */ color: inherit; /* 2 */ height: 0; /* 1 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, pre, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Tabular data * ========================================================================== */ /** * 1. Correct table border color in Chrome, Edge, and Safari. * 2. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-color: currentColor; /* 1 */ text-indent: 0; /* 2 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Remove the inheritance of text transform in Firefox. */ :where(button) { text-transform: none; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) { -webkit-appearance: button; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * Remove the inheritance of text transform in Firefox. */ :where(select) { text-transform: none; } /** * Remove the margin in Firefox and Safari. */ :where(textarea) { margin: 0; } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where(input[type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /** * Remove the inner border and padding of focus outlines in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus outline styles unset by the previous rule in Firefox. */ :where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring { outline: 1px dotted ButtonText; } /** * Remove the additional :invalid styles in Firefox. */ :where(:-moz-ui-invalid) { box-shadow: none; } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in all browsers. */ :where(summary) { display: list-item; } /*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIm5vcm1hbGl6ZS5jc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUE7K0VBQytFOztBQUUvRTs7O0VBR0U7O0FBRUY7RUFDRSxpQkFBaUIsRUFBRSxNQUFNO0VBQ3pCLDhCQUE4QixFQUFFLE1BQU07RUFDdEMsc0JBQXNCLEVBQUUsTUFBTTtBQUNoQzs7QUFFQTsrRUFDK0U7O0FBRS9FOzs7RUFHRTs7QUFFRjtFQUNFLGNBQWM7RUFDZCx3QkFBd0I7RUFDeEIsMEJBQTBCO0FBQzVCOztBQUVBOytFQUMrRTs7QUFFL0U7O0VBRUU7O0FBRUY7RUFDRSxtQkFBbUI7RUFDbkIscUJBQXFCO0FBQ3ZCOztBQUVBOzs7RUFHRTs7QUFFRjtFQUNFLHVCQUF1QixFQUFFLE1BQU07RUFDL0IsY0FBYyxFQUFFLE1BQU07RUFDdEIsU0FBUyxFQUFFLE1BQU07QUFDbkI7O0FBRUE7K0VBQytFOztBQUUvRTs7RUFFRTs7QUFFRjtFQUNFLDBCQUEwQjtFQUMxQixpQ0FBaUM7QUFDbkM7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSxtQkFBbUI7QUFDckI7O0FBRUE7OztFQUdFOztBQUVGO0VBQ0UsaUNBQWlDLEVBQUUsTUFBTTtFQUN6QyxjQUFjLEVBQUUsTUFBTTtBQUN4Qjs7QUFFQTs7RUFFRTs7QUFFRjtFQUNFLGNBQWM7QUFDaEI7O0FBRUE7K0VBQytFOztBQUUvRTs7O0VBR0U7O0FBRUY7RUFDRSwwQkFBMEIsRUFBRSxNQUFNO0VBQ2xDLGNBQWMsRUFBRSxNQUFNO0FBQ3hCOztBQUVBOytFQUMrRTs7QUFFL0U7O0VBRUU7O0FBRUY7RUFDRSxTQUFTO0FBQ1g7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSxvQkFBb0I7QUFDdEI7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSwwQkFBMEI7QUFDNUI7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSx3QkFBd0I7QUFDMUI7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSxvQkFBb0I7QUFDdEI7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSxTQUFTO0FBQ1g7O0FBRUE7OztFQUdFOztBQUVGO0VBQ0UsNkJBQTZCLEVBQUUsTUFBTTtFQUNyQyxvQkFBb0IsRUFBRSxNQUFNO0FBQzlCOztBQUVBOztFQUVFOztBQUVGOztFQUVFLFlBQVk7QUFDZDs7QUFFQTs7RUFFRTs7QUFFRjtFQUNFLGNBQWM7RUFDZCxhQUFhO0FBQ2Y7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSx3QkFBd0I7QUFDMUI7O0FBRUE7OztFQUdFOztBQUVGO0VBQ0UsMEJBQTBCLEVBQUUsTUFBTTtFQUNsQyxhQUFhLEVBQUUsTUFBTTtBQUN2Qjs7QUFFQTs7RUFFRTs7QUFFRjtFQUNFLGtCQUFrQjtFQUNsQixVQUFVO0FBQ1o7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSw4QkFBOEI7QUFDaEM7O0FBRUE7O0VBRUU7O0FBRUY7RUFDRSxnQkFBZ0I7QUFDbEI7O0FBRUE7K0VBQytFOztBQUUvRTs7RUFFRTs7QUFFRjtFQUNFLHVCQUF1QjtFQUN2QixhQUFhO0VBQ2IsWUFBWTtFQUNaLHdCQUF3QjtFQUN4QixtQkFBbUI7RUFDbkIsT0FBTztFQUNQLFlBQVk7RUFDWixZQUFZO0VBQ1osa0JBQWtCO0VBQ2xCLFFBQVE7RUFDUix1QkFBdUI7RUFDdkIsa0JBQWtCO0FBQ3BCOztBQUVBO0VBQ0UsYUFBYTtBQUNmOztBQUVBOztFQUVFOztBQUVGO0VBQ0Usa0JBQWtCO0FBQ3BCIiwiZmlsZSI6Im5vcm1hbGl6ZS5jc3MiLCJzb3VyY2VzQ29udGVudCI6WyIvKiBEb2N1bWVudFxuICogPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0gKi9cblxuLyoqXG4gKiAxLiBDb3JyZWN0IHRoZSBsaW5lIGhlaWdodCBpbiBhbGwgYnJvd3NlcnMuXG4gKiAyLiBQcmV2ZW50IGFkanVzdG1lbnRzIG9mIGZvbnQgc2l6ZSBhZnRlciBvcmllbnRhdGlvbiBjaGFuZ2VzIGluIGlPUy5cbiAqL1xuXG46d2hlcmUoaHRtbCkge1xuICBsaW5lLWhlaWdodDogMS4xNTsgLyogMSAqL1xuICAtd2Via2l0LXRleHQtc2l6ZS1hZGp1c3Q6IDEwMCU7IC8qIDIgKi9cbiAgdGV4dC1zaXplLWFkanVzdDogMTAwJTsgLyogMiAqL1xufVxuXG4vKiBTZWN0aW9uc1xuICogPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0gKi9cblxuLyoqXG4gKiBDb3JyZWN0IHRoZSBmb250IHNpemUgYW5kIG1hcmdpbiBvbiBgaDFgIGVsZW1lbnRzIHdpdGhpbiBgc2VjdGlvbmAgYW5kXG4gKiBgYXJ0aWNsZWAgY29udGV4dHMgaW4gQ2hyb21lLCBFZGdlLCBGaXJlZm94LCBhbmQgU2FmYXJpLlxuICovXG5cbjp3aGVyZShoMSkge1xuICBmb250LXNpemU6IDJlbTtcbiAgbWFyZ2luLWJsb2NrLWVuZDogMC42N2VtO1xuICBtYXJnaW4tYmxvY2stc3RhcnQ6IDAuNjdlbTtcbn1cblxuLyogR3JvdXBpbmcgY29udGVudFxuICogPT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT0gKi9cblxuLyoqXG4gKiBSZW1vdmUgdGhlIG1hcmdpbiBvbiBuZXN0ZWQgbGlzdHMgaW4gQ2hyb21lLCBFZGdlLCBhbmQgU2FmYXJpLlxuICovXG5cbjp3aGVyZShkbCwgb2wsIHVsKSA6d2hlcmUoZGwsIG9sLCB1bCkge1xuICBtYXJnaW4tYmxvY2stZW5kOiAwO1xuICBtYXJnaW4tYmxvY2stc3RhcnQ6IDA7XG59XG5cbi8qKlxuICogMS4gQWRkIHRoZSBjb3JyZWN0IGJveCBzaXppbmcgaW4gRmlyZWZveC5cbiAqIDIuIENvcnJlY3QgdGhlIGluaGVyaXRhbmNlIG9mIGJvcmRlciBjb2xvciBpbiBGaXJlZm94LlxuICovXG5cbjp3aGVyZShocikge1xuICBib3gtc2l6aW5nOiBjb250ZW50LWJveDsgLyogMSAqL1xuICBjb2xvcjogaW5oZXJpdDsgLyogMiAqL1xuICBoZWlnaHQ6IDA7IC8qIDEgKi9cbn1cblxuLyogVGV4dC1sZXZlbCBzZW1hbnRpY3NcbiAqID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09ICovXG5cbi8qKlxuICogQWRkIHRoZSBjb3JyZWN0IHRleHQgZGVjb3JhdGlvbiBpbiBTYWZhcmkuXG4gKi9cblxuOndoZXJlKGFiYnJbdGl0bGVdKSB7XG4gIHRleHQtZGVjb3JhdGlvbjogdW5kZXJsaW5lO1xuICB0ZXh0LWRlY29yYXRpb246IHVuZGVybGluZSBkb3R0ZWQ7XG59XG5cbi8qKlxuICogQWRkIHRoZSBjb3JyZWN0IGZvbnQgd2VpZ2h0IGluIENocm9tZSwgRWRnZSwgYW5kIFNhZmFyaS5cbiAqL1xuXG46d2hlcmUoYiwgc3Ryb25nKSB7XG4gIGZvbnQtd2VpZ2h0OiBib2xkZXI7XG59XG5cbi8qKlxuICogMS4gQ29ycmVjdCB0aGUgaW5oZXJpdGFuY2UgYW5kIHNjYWxpbmcgb2YgZm9udCBzaXplIGluIGFsbCBicm93c2Vycy5cbiAqIDIuIENvcnJlY3QgdGhlIG9kZCBgZW1gIGZvbnQgc2l6aW5nIGluIGFsbCBicm93c2Vycy5cbiAqL1xuXG46d2hlcmUoY29kZSwga2JkLCBwcmUsIHNhbXApIHtcbiAgZm9udC1mYW1pbHk6IG1vbm9zcGFjZSwgbW9ub3NwYWNlOyAvKiAxICovXG4gIGZvbnQtc2l6ZTogMWVtOyAvKiAyICovXG59XG5cbi8qKlxuICogQWRkIHRoZSBjb3JyZWN0IGZvbnQgc2l6ZSBpbiBhbGwgYnJvd3NlcnMuXG4gKi9cblxuOndoZXJlKHNtYWxsKSB7XG4gIGZvbnQtc2l6ZTogODAlO1xufVxuXG4vKiBUYWJ1bGFyIGRhdGFcbiAqID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09ICovXG5cbi8qKlxuICogMS4gQ29ycmVjdCB0YWJsZSBib3JkZXIgY29sb3IgaW4gQ2hyb21lLCBFZGdlLCBhbmQgU2FmYXJpLlxuICogMi4gUmVtb3ZlIHRleHQgaW5kZW50YXRpb24gZnJvbSB0YWJsZSBjb250ZW50cyBpbiBDaHJvbWUsIEVkZ2UsIGFuZCBTYWZhcmkuXG4gKi9cblxuOndoZXJlKHRhYmxlKSB7XG4gIGJvcmRlci1jb2xvcjogY3VycmVudENvbG9yOyAvKiAxICovXG4gIHRleHQtaW5kZW50OiAwOyAvKiAyICovXG59XG5cbi8qIEZvcm1zXG4gKiA9PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PSAqL1xuXG4vKipcbiAqIFJlbW92ZSB0aGUgbWFyZ2luIG9uIGNvbnRyb2xzIGluIFNhZmFyaS5cbiAqL1xuXG46d2hlcmUoYnV0dG9uLCBpbnB1dCwgc2VsZWN0KSB7XG4gIG1hcmdpbjogMDtcbn1cblxuLyoqXG4gKiBSZW1vdmUgdGhlIGluaGVyaXRhbmNlIG9mIHRleHQgdHJhbnNmb3JtIGluIEZpcmVmb3guXG4gKi9cblxuOndoZXJlKGJ1dHRvbikge1xuICB0ZXh0LXRyYW5zZm9ybTogbm9uZTtcbn1cblxuLyoqXG4gKiBDb3JyZWN0IHRoZSBpbmFiaWxpdHkgdG8gc3R5bGUgYnV0dG9ucyBpbiBpT1MgYW5kIFNhZmFyaS5cbiAqL1xuXG46d2hlcmUoYnV0dG9uLCBpbnB1dDppcyhbdHlwZT1cImJ1dHRvblwiIGldLCBbdHlwZT1cInJlc2V0XCIgaV0sIFt0eXBlPVwic3VibWl0XCIgaV0pKSB7XG4gIC13ZWJraXQtYXBwZWFyYW5jZTogYnV0dG9uO1xufVxuXG4vKipcbiAqIEFkZCB0aGUgY29ycmVjdCB2ZXJ0aWNhbCBhbGlnbm1lbnQgaW4gQ2hyb21lLCBFZGdlLCBhbmQgRmlyZWZveC5cbiAqL1xuXG46d2hlcmUocHJvZ3Jlc3MpIHtcbiAgdmVydGljYWwtYWxpZ246IGJhc2VsaW5lO1xufVxuXG4vKipcbiAqIFJlbW92ZSB0aGUgaW5oZXJpdGFuY2Ugb2YgdGV4dCB0cmFuc2Zvcm0gaW4gRmlyZWZveC5cbiAqL1xuXG46d2hlcmUoc2VsZWN0KSB7XG4gIHRleHQtdHJhbnNmb3JtOiBub25lO1xufVxuXG4vKipcbiAqIFJlbW92ZSB0aGUgbWFyZ2luIGluIEZpcmVmb3ggYW5kIFNhZmFyaS5cbiAqL1xuXG46d2hlcmUodGV4dGFyZWEpIHtcbiAgbWFyZ2luOiAwO1xufVxuXG4vKipcbiAqIDEuIENvcnJlY3QgdGhlIG9kZCBhcHBlYXJhbmNlIGluIENocm9tZSwgRWRnZSwgYW5kIFNhZmFyaS5cbiAqIDIuIENvcnJlY3QgdGhlIG91dGxpbmUgc3R5bGUgaW4gU2FmYXJpLlxuICovXG5cbjp3aGVyZShpbnB1dFt0eXBlPVwic2VhcmNoXCIgaV0pIHtcbiAgLXdlYmtpdC1hcHBlYXJhbmNlOiB0ZXh0ZmllbGQ7IC8qIDEgKi9cbiAgb3V0bGluZS1vZmZzZXQ6IC0ycHg7IC8qIDIgKi9cbn1cblxuLyoqXG4gKiBDb3JyZWN0IHRoZSBjdXJzb3Igc3R5bGUgb2YgaW5jcmVtZW50IGFuZCBkZWNyZW1lbnQgYnV0dG9ucyBpbiBTYWZhcmkuXG4gKi9cblxuOjotd2Via2l0LWlubmVyLXNwaW4tYnV0dG9uLFxuOjotd2Via2l0LW91dGVyLXNwaW4tYnV0dG9uIHtcbiAgaGVpZ2h0OiBhdXRvO1xufVxuXG4vKipcbiAqIENvcnJlY3QgdGhlIHRleHQgc3R5bGUgb2YgcGxhY2Vob2xkZXJzIGluIENocm9tZSwgRWRnZSwgYW5kIFNhZmFyaS5cbiAqL1xuXG46Oi13ZWJraXQtaW5wdXQtcGxhY2Vob2xkZXIge1xuICBjb2xvcjogaW5oZXJpdDtcbiAgb3BhY2l0eTogMC41NDtcbn1cblxuLyoqXG4gKiBSZW1vdmUgdGhlIGlubmVyIHBhZGRpbmcgaW4gQ2hyb21lLCBFZGdlLCBhbmQgU2FmYXJpIG9uIG1hY09TLlxuICovXG5cbjo6LXdlYmtpdC1zZWFyY2gtZGVjb3JhdGlvbiB7XG4gIC13ZWJraXQtYXBwZWFyYW5jZTogbm9uZTtcbn1cblxuLyoqXG4gKiAxLiBDb3JyZWN0IHRoZSBpbmFiaWxpdHkgdG8gc3R5bGUgdXBsb2FkIGJ1dHRvbnMgaW4gaU9TIGFuZCBTYWZhcmkuXG4gKiAyLiBDaGFuZ2UgZm9udCBwcm9wZXJ0aWVzIHRvIGBpbmhlcml0YCBpbiBTYWZhcmkuXG4gKi9cblxuOjotd2Via2l0LWZpbGUtdXBsb2FkLWJ1dHRvbiB7XG4gIC13ZWJraXQtYXBwZWFyYW5jZTogYnV0dG9uOyAvKiAxICovXG4gIGZvbnQ6IGluaGVyaXQ7IC8qIDIgKi9cbn1cblxuLyoqXG4gKiBSZW1vdmUgdGhlIGlubmVyIGJvcmRlciBhbmQgcGFkZGluZyBvZiBmb2N1cyBvdXRsaW5lcyBpbiBGaXJlZm94LlxuICovXG5cbjp3aGVyZShidXR0b24sIGlucHV0OmlzKFt0eXBlPVwiYnV0dG9uXCIgaV0sIFt0eXBlPVwiY29sb3JcIiBpXSwgW3R5cGU9XCJyZXNldFwiIGldLCBbdHlwZT1cInN1Ym1pdFwiIGldKSk6Oi1tb3otZm9jdXMtaW5uZXIge1xuICBib3JkZXItc3R5bGU6IG5vbmU7XG4gIHBhZGRpbmc6IDA7XG59XG5cbi8qKlxuICogUmVzdG9yZSB0aGUgZm9jdXMgb3V0bGluZSBzdHlsZXMgdW5zZXQgYnkgdGhlIHByZXZpb3VzIHJ1bGUgaW4gRmlyZWZveC5cbiAqL1xuXG46d2hlcmUoYnV0dG9uLCBpbnB1dDppcyhbdHlwZT1cImJ1dHRvblwiIGldLCBbdHlwZT1cImNvbG9yXCIgaV0sIFt0eXBlPVwicmVzZXRcIiBpXSwgW3R5cGU9XCJzdWJtaXRcIiBpXSkpOjotbW96LWZvY3VzcmluZyB7XG4gIG91dGxpbmU6IDFweCBkb3R0ZWQgQnV0dG9uVGV4dDtcbn1cblxuLyoqXG4gKiBSZW1vdmUgdGhlIGFkZGl0aW9uYWwgOmludmFsaWQgc3R5bGVzIGluIEZpcmVmb3guXG4gKi9cblxuOndoZXJlKDotbW96LXVpLWludmFsaWQpIHtcbiAgYm94LXNoYWRvdzogbm9uZTtcbn1cblxuLyogSW50ZXJhY3RpdmVcbiAqID09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09PT09ICovXG5cbi8qXG4gKiBBZGQgdGhlIGNvcnJlY3Qgc3R5bGVzIGluIFNhZmFyaS5cbiAqL1xuXG46d2hlcmUoZGlhbG9nKSB7XG4gIGJhY2tncm91bmQtY29sb3I6IHdoaXRlO1xuICBib3JkZXI6IHNvbGlkO1xuICBjb2xvcjogYmxhY2s7XG4gIGhlaWdodDogLW1vei1maXQtY29udGVudDtcbiAgaGVpZ2h0OiBmaXQtY29udGVudDtcbiAgbGVmdDogMDtcbiAgbWFyZ2luOiBhdXRvO1xuICBwYWRkaW5nOiAxZW07XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgcmlnaHQ6IDA7XG4gIHdpZHRoOiAtbW96LWZpdC1jb250ZW50O1xuICB3aWR0aDogZml0LWNvbnRlbnQ7XG59XG5cbjp3aGVyZShkaWFsb2c6bm90KFtvcGVuXSkpIHtcbiAgZGlzcGxheTogbm9uZTtcbn1cblxuLypcbiAqIEFkZCB0aGUgY29ycmVjdCBkaXNwbGF5IGluIGFsbCBicm93c2Vycy5cbiAqL1xuXG46d2hlcmUoc3VtbWFyeSkge1xuICBkaXNwbGF5OiBsaXN0LWl0ZW07XG59XG4iXX0= */ body { font-family: sans-serif; } ================================================ FILE: test/sanitize.expect.css ================================================ /* Document * ========================================================================== */ /** * 1. Add border box sizing in all browsers (opinionated). * 2. Backgrounds do not repeat by default (opinionated). */ *, ::before, ::after { box-sizing: border-box; /* 1 */ } /** * 1. Add text decoration inheritance in all browsers (opinionated). * 2. Add vertical alignment inheritance in all browsers (opinionated). */ ::before, ::after { text-decoration: inherit; /* 1 */ vertical-align: inherit; /* 2 */ } /** * 1. Use the default cursor in all browsers (opinionated). * 2. Change the line height in all browsers (opinionated). * 3. Breaks words to prevent overflow in all browsers (opinionated). * 4. Use a 4-space tab width in all browsers (opinionated). * 5. Remove the grey highlight on links in iOS (opinionated). * 6. Prevent adjustments of font size after orientation changes in iOS. */ :where(:root) { cursor: default; /* 1 */ line-height: 1.5; /* 2 */ overflow-wrap: break-word; /* 3 */ -moz-tab-size: 4; /* 4 */ tab-size: 4; /* 4 */ -webkit-tap-highlight-color: transparent; /* 5 */ -webkit-text-size-adjust: 100%; /* 6 */ } /* Sections * ========================================================================== */ /** * Remove the margin in all browsers (opinionated). */ :where(body) { margin: 0; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Edge, Firefox, and Safari. */ :where(h1) { font-size: 2em; margin: 0.67em 0; } /* Grouping content * ========================================================================== */ /** * Remove the margin on nested lists in Chrome, Edge, and Safari. */ :where(dl, ol, ul) :where(dl, ol, ul) { margin: 0; } /** * 1. Correct the inheritance of border color in Firefox. * 2. Add the correct box sizing in Firefox. */ :where(hr) { color: inherit; /* 1 */ height: 0; /* 2 */ } /** * Remove the list style on navigation lists in all browsers (opinionated). */ :where(nav) :where(ol, ul) { list-style-type: none; padding: 0; } /** * Prevent VoiceOver from ignoring list semantics in Safari (opinionated). */ :where(nav li)::before { content: "\200B"; float: left; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. * 3. Prevent overflow of the container in all browsers (opinionated). */ :where(pre) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ overflow: auto; /* 3 */ } /* Text-level semantics * ========================================================================== */ /** * Add the correct text decoration in Safari. */ :where(abbr[title]) { text-decoration: underline; text-decoration: underline dotted; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ :where(b, strong) { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ :where(code, kbd, samp) { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font size in all browsers. */ :where(small) { font-size: 80%; } /* Embedded content * ========================================================================== */ /* * Change the alignment on media elements in all browsers (opinionated). */ :where(audio, canvas, iframe, img, svg, video) { vertical-align: middle; } /** * Remove the border on iframes in all browsers (opinionated). */ :where(iframe) { border-style: none; } /** * Change the fill color to match the text color in all browsers (opinionated). */ :where(svg:not([fill])) { fill: currentColor; } /* Tabular data * ========================================================================== */ /** * 1. Collapse border spacing in all browsers (opinionated). * 2. Correct table border color inheritance in all Chrome, Edge, and Safari. * 3. Remove text indentation from table contents in Chrome, Edge, and Safari. */ :where(table) { border-collapse: collapse; /* 1 */ border-color: inherit; /* 2 */ text-indent: 0; /* 3 */ } /* Forms * ========================================================================== */ /** * Remove the margin on controls in Safari. */ :where(button, input, select) { margin: 0; } /** * Correct the inability to style buttons in iOS and Safari. */ :where(button, [type="button" i], [type="reset" i], [type="submit" i]) { -webkit-appearance: button; } /** * Change the inconsistent appearance in all browsers (opinionated). */ :where(fieldset) { border: 1px solid #a0a0a0; } /** * Add the correct vertical alignment in Chrome, Edge, and Firefox. */ :where(progress) { vertical-align: baseline; } /** * 1. Remove the margin in Firefox and Safari. * 3. Change the resize direction in all browsers (opinionated). */ :where(textarea) { margin: 0; /* 1 */ resize: vertical; /* 3 */ } /** * 1. Correct the odd appearance in Chrome, Edge, and Safari. * 2. Correct the outline style in Safari. */ :where([type="search" i]) { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /** * Correct the text style of placeholders in Chrome, Edge, and Safari. */ ::-webkit-input-placeholder { color: inherit; opacity: 0.54; } /** * Remove the inner padding in Chrome, Edge, and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style upload buttons in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive * ========================================================================== */ /* * Add the correct styles in Safari. */ :where(dialog) { background-color: white; border: solid; color: black; height: -moz-fit-content; height: fit-content; left: 0; margin: auto; padding: 1em; position: absolute; right: 0; width: -moz-fit-content; width: fit-content; } :where(dialog:not([open])) { display: none; } /* * Add the correct display in Safari. */ :where(details > summary:first-of-type) { display: list-item; } /* Accessibility * ========================================================================== */ /** * Change the cursor on busy elements in all browsers (opinionated). */ :where([aria-busy="true" i]) { cursor: progress; } /* * Change the cursor on control elements in all browsers (opinionated). */ :where([aria-controls]) { cursor: pointer; } /* * Change the cursor on disabled, not-editable, or otherwise * inoperable elements in all browsers (opinionated). */ :where([aria-disabled="true" i], [disabled]) { cursor: not-allowed; } /* * Change the display on visually hidden accessible elements * in all browsers (opinionated). */ :where([aria-hidden="false" i][hidden]) { display: initial; } :where([aria-hidden="false" i][hidden]:not(:focus)) { clip: rect(0, 0, 0, 0); position: absolute; } body { font-family: sans-serif; }