aboutsummaryrefslogtreecommitdiffstatshomepage
diff options
context:
space:
mode:
authorJonathan Neal <jonathantneal@hotmail.com>2018-06-15 20:36:24 -0400
committerJonathan Neal <jonathantneal@hotmail.com>2018-06-15 20:36:24 -0400
commit27b3b6ceb9f71ae6e50095fb96db7ed321dc4b7d (patch)
tree834f82d74aa9baf93b7c6d0a83069c317ad4c3a9
parentd7bd1fd22bff730d673be70b87b21193c95b70f3 (diff)
downloadnormalize.css-27b3b6ceb9f71ae6e50095fb96db7ed321dc4b7d.tar.gz
normalize.css-27b3b6ceb9f71ae6e50095fb96db7ed321dc4b7d.zip
8.0.0
-rw-r--r--.gitattributes2
-rw-r--r--.gitignore4
-rw-r--r--.travis.yml3
-rw-r--r--CHANGELOG.md11
-rw-r--r--CONTRIBUTING.md141
-rw-r--r--LICENSE.md2
-rw-r--r--README.md91
-rw-r--r--bower.json17
-rw-r--r--normalize.css144
-rw-r--r--package.json45
-rw-r--r--test.html257
11 files changed, 260 insertions, 457 deletions
diff --git a/.gitattributes b/.gitattributes
deleted file mode 100644
index 5e26201..0000000
--- a/.gitattributes
+++ /dev/null
@@ -1,2 +0,0 @@
-normalize.css linguist-vendored=false
-test.html linguist-vendored
diff --git a/.gitignore b/.gitignore
index 93f1361..048b0a3 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,2 +1,6 @@
node_modules
npm-debug.log
+.*
+!.editorconfig
+!.gitignore
+!.travis.yml
diff --git a/.travis.yml b/.travis.yml
index 833d09d..7b07347 100644
--- a/.travis.yml
+++ b/.travis.yml
@@ -1,3 +1,6 @@
+# https://docs.travis-ci.com/user/travis-lint
+
language: node_js
+
node_js:
- stable
diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7ac47ec..1e00294 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,5 +1,16 @@
# Changes to normalize.css
+### 8.0.0 (June 15, 2018)
+
+* Remove normalizations for unsupported browsers, such as Android 4-,
+ Chrome 57-, Firefox 52-, IE 8-, and Safari 7-.
+* Do not remove gaps on link underlines in iOS and Safari.
+* Reduce the selector weight on form control normalizations.
+* Do not remove the search input cancel button in Chrome and Safari.
+* Add dialog styles for Edge, IE, and Safari.
+* Update tests to test every single feature.
+* Update all documentation to be more clear and helpful.
+
### 7.0.0 (May 26, 2017)
* Separate out selector targeted fixes for readability
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 5f5f1e4..c3370c6 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -1,46 +1,37 @@
# Contributing to normalize.css
-Please take a moment to review this document in order to make the contribution
-process easy and effective for everyone involved.
+Please review this document in order to make the contribution process easy and
+effective for everyone involved.
Following these guidelines helps to communicate that you respect the time of
-the developers managing and developing this open source project. In return,
-they should reciprocate that respect in addressing your issue or assessing
-patches and features.
-
+the developers managing and developing this project. In return, we will
+reciprocate that respect in addressing your issues, patches, and features.
## Using the issue tracker
-The issue tracker is the preferred channel for [bug reports](#bugs),
-[features requests](#features) and [submitting pull
+The issue tracker is the preferred channel for [bug reports](#bug-reports),
+[feature requests](#feature-requests) and [pull
requests](#pull-requests), but please respect the following restrictions:
* Please **do not** use the issue tracker for personal support requests.
-
* Please **do not** derail or troll issues. Keep the discussion on topic and
respect the opinions of others.
-
## Bug reports
-A bug is a _demonstrable problem_ that is caused by the code in the repository.
-Good bug reports are extremely helpful - thank you!
-
-Guidelines for bug reports:
+A bug is a _demonstrable problem_ caused by the code in this repository.
-1. **Use the GitHub issue search** – check if the issue has already been
- reported.
+1. **Use the GitHub issue search** to see if the issue has
+ [already been reported].
-2. **Check if the issue has been fixed** – try to reproduce it using the
+2. **Check if the issue has been fixed** by trying to reproduce it using the
latest `master` branch in the repository.
-3. **Isolate the problem** – create a live example (e.g., on
- [Codepen](http://codepen.io)) of a [reduced test
- case](http://css-tricks.com/6263-reduced-test-cases/).
+3. **Isolate the problem** to create a [live example] of a [reduced test case].
A good bug report shouldn't leave others needing to chase you up for more
-information. Please try to be as detailed as possible in your report. What is
-your environment? What steps will reproduce the issue? What browser(s) and OS
+information. Please be as detailed as possible in your report. What is your
+environment? What steps will reproduce the issue? What browser(s) and OS
experience the problem? What would you expect to be the outcome? All these
details will help people to fix any potential bugs.
@@ -62,15 +53,13 @@ Example:
> causing the bug, and potential solutions (and your opinions on their
> merits).
-
## Feature requests
-Feature requests are welcome. But take a moment to find out whether your idea
-fits with the scope and aims of the project. It's up to *you* to make a strong
-case to convince the project's developers of the merits of this feature. Please
+Feature requests are welcome. Take a moment to find out whether your idea fits
+with the scope and aims of the project. It's up to *you* to make a strong case
+to convince the project's developers of the merits of this feature. Please
provide as much detail and context as possible.
-
## Pull requests
Good pull requests - patches, improvements, new features - are a fantastic
@@ -87,64 +76,52 @@ accurate comments, etc.) and any other requirements (such as test coverage).
Follow this process if you'd like your work considered for inclusion in the
project:
-1. [Fork](https://help.github.com/articles/fork-a-repo/) the project, clone your
- fork, and configure the remotes:
-
+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 https://github.com/<your-username>/normalize.css
+ git clone git@github.com:YOUR_USER/normalize.css.git
+
# Navigate to the newly cloned directory
cd normalize.css
+
# Assign the original repo to a remote called "upstream"
- git remote add upstream https://github.com/necolas/normalize.css
- ```
+ git remote add upstream git@github.com:csstools/normalize.css.git
-2. If you cloned a while ago, get the latest changes from upstream:
+ # Install the tools necessary for testing
+ npm install
+ ```
+2. Create a branch for your feature or fix:
```bash
- git checkout master
- git pull upstream master
+ # Move into a new branch for your feature
+ git checkout -b feature/thing
```
-
-3. Never work directly on `master`. Create a new topic branch (off the latest
- version of `master`) to contain your feature, change, or fix:
-
```bash
- git checkout -b <topic-branch-name>
+ # Move into a new branch for your fix
+ git checkout -b fix/something
```
-4. Commit your changes in logical chunks. Please adhere to these [git commit
- message conventions](http://tbaggery.com/2008/04/19/a-note-about-git-commit-messages.html)
- or your code is unlikely be merged into the main project. Use Git's
- [interactive rebase](https://help.github.com/articles/interactive-rebase)
- feature to tidy up your commits before making them public.
-
- Be sure to test the `normalize.css` file for style conformance.
-
+3. If your code follows our practices, then push your feature branch:
```bash
+ # Test current code
npm test
```
-
- Be sure to add a test to the `test.html` file if appropriate, and test
- your change in all supported browsers.
-
-5. Locally rebase the upstream development branch into your topic branch:
-
```bash
- git pull --rebase upstream master
+ # Push the branch for your new feature
+ git push origin feature/thing
```
-
-6. Push your topic branch up to your fork:
-
```bash
- git push origin <topic-branch-name>
+ # Or, push the branch for your update
+ git push origin update/something
```
-10. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/)
- with a clear title and description.
+ Be sure to add a test to the `test.html` file if appropriate, and test
+ your change in all supported browsers.
-**IMPORTANT**: By submitting a patch, you agree to allow the project owner to
-license your work under the same license as that used by the project.
+
+Now [open a pull request] with a clear title and description. Remember,
+by submitting a patch, you agree to allow the project owner to license your
+work under the same license as that used by the project.
### CSS Conventions
@@ -156,14 +133,13 @@ Keep the CSS file as readable as possible by following these guidelines:
normalization obvious.
- Comments begin with “Correct the...” when they deal with less obvious side
effects.
-- Rules are sorted by cascade, specificity, and then alphabetic order.
-- Selectors are sorted by specificity and then alphabetic order.
+- Rules are sorted by section, cascade, specificity, and then alphabetic order.
+- Selectors are sorted by low-to-high specificity and then alphabetic order.
- `in browser` applies to all versions.
-- `in browser v-` applies to all versions up to and including the version.
- `in browser v+` applies to all versions after and including the version.
+- `in browser v-` applies to all versions up to and including the version.
- `in browser v-v` applies to all versions including and between the versions.
-
## Maintainers
If you have commit access, please follow this process for merging patches and
@@ -175,20 +151,19 @@ cutting new releases.
2. Check that a patch has any necessary tests and a proper, descriptive commit
message.
3. Test the patch locally.
-4. Do not use GitHub's merge button. Apply the patch to `master` locally
- (either via `git am` or by checking the whole branch out). Amend minor
- problems with the author's original commit if necessary. Then push to GitHub.
+4. Use GitHub’s merge button with caution or apply the patch locally, squashing
+ any commits.
### Releasing a new version
-1. Include all new functional changes in the CHANGELOG.
-2. Use a dedicated commit to increment the version. The version needs to be
- added to the CHANGELOG (inc. date), the `package.json`, and `normalize.css`
- files.
-3. The commit message must be of `v0.0.0` format.
-4. Create an annotated tag for the version: `git tag -m "v0.0.0" 0.0.0`.
-5. Push the changes and tags to GitHub: `git push --tags origin master`
-6. Checkout the `gh-pages` branch and follow the instructions in the README.
+1. Include all new functional changes in CHANGELOG.md.
+2. Create an annotated tag for the version: `git tag -m "0.0.0" 0.0.0`.
+3. Push the changes and tags to GitHub: `git push --tags origin master`
+4. Update the `gh-pages` branch,
+ 1. Copy the latest normalize.css and test.html from the master branch into
+ the root directory, the `latest` directory, and a new directory named
+ after the new version: `0.0.0`.
+ 2. Update the normalize.css version and supported browsers in `index.html`.
### Semver strategy
@@ -202,6 +177,12 @@ are considered backwards-compatible and will result in a new **patch** release.
No changes to CSS rules can add functionality in a backwards-compatible manner,
therefore no changes are considered **minor**. For instance, a normalization on
-an element selector may override a user style on a universal selector, a
+an element selector may override a user style on a universal selector, or a
change to `opacity` might cause [inputs to disappear](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/),
or a change to `background-color` might cause [backgrounds to shrink](https://github.com/jonathantneal/sanitize.css/issues/42).
+
+[already been reported]: https://github.com/csstools/normalize.css/issues
+[fork this project]: https://github.com/csstools/normalize.css/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/
diff --git a/LICENSE.md b/LICENSE.md
index 43b5ddc..f13daf1 100644
--- a/LICENSE.md
+++ b/LICENSE.md
@@ -1,6 +1,6 @@
# The MIT License (MIT)
-Copyright © Nicolas Gallagher and Jonathan Neal
+Copyright © Jonathan Neal and Nicolas Gallagher
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
diff --git a/README.md b/README.md
index fca4258..54dd56c 100644
--- a/README.md
+++ b/README.md
@@ -1,22 +1,17 @@
-# normalize.css
+# normalize.css [<img src="https://camo.githubusercontent.com/0d1347e7b4ede3d714150c863a44c932f3c4d84e/68747470733a2f2f6e65636f6c61732e6769746875622e696f2f6e6f726d616c697a652e6373732f6c6f676f2e737667" alt="normalize" width="90" height="90" align="right">][normalize.css]
-<a href="https://github.com/jonathantneal/normalize.css"><img
- src="https://jonathantneal.github.io/normalize.css/logo.svg" alt="normalize.css logo"
- width="80" height="80" align="right"></a>
-
-[normalize.css] is a CSS library which provides cross-browser consistency in
-the default styling of HTML elements.
+[normalize.css] is a CSS library that provides consistent, cross-browser
+default styling of HTML elements.
## Usage
```sh
-npm install --save jonathantneal/normalize.css
+npm install --save @csstools/normalize.css
```
**Download**
-See https://jonathantneal.github.io/normalize/latest/normalize.css
-
+See https://csstools.github.io/normalize.css/latest/normalize.css
## What does it do?
@@ -26,68 +21,14 @@ See https://jonathantneal.github.io/normalize/latest/normalize.css
## Browser support
-* Chrome (last three)
-* Edge (last three)
-* Firefox (last three)
+* Chrome (last 3)
+* Edge (last 3)
+* Firefox (last 3)
* Firefox ESR
-* Internet Explorer 8+
-* iOS Safari (last three)
-* Opera (last three)
-* Safari 6+
-
-## Extended details and known issues
-
-Additional detail and explanation of the esoteric parts of normalize.
-
-#### `pre, code, kbd, samp`
-
-The `font-family: monospace, monospace` hack fixes the inheritance and scaling
-of font-size for preformatted text. The duplication of `monospace` is
-intentional. [Source](https://en.wikipedia.org/wiki/User:Davidgothberg/Test59).
-
-#### `sub, sup`
-
-Normally, using `sub` or `sup` affects the line-box height of text in all
-browsers. [Source](https://gist.github.com/413930).
-
-#### `svg:not(:root)`
-
-Adding `overflow: hidden` fixes IE9's SVG rendering. Earlier versions of IE
-don't support SVG, so we can safely use the `:not()` and `:root` selectors that
-modern browsers use in the default UA stylesheets to apply this style.
-[Source](https://lists.w3.org/Archives/Public/public-svg-wg/2008JulSep/0339.html).
-
-#### `select`
-
-By default, Chrome on OS X and Safari on OS X allow very limited styling of
-`select`, unless a border property is set. The default font weight on `optgroup`
-elements cannot safely be changed in Chrome on OSX and Safari on OS X.
-
-#### `[type="checkbox"]`
-
-It is recommended that you do not style checkbox and radio inputs as Firefox's
-implementation does not respect box-sizing, padding, or width.
-
-#### `[type="number"]`
-
-Certain font size values applied to number inputs cause the cursor style of the
-decrement button to change from `default` to `text`.
-
-#### `[type="search"]`
-
-The search input is not fully stylable by default. In Chrome and Safari on
-OSX/iOS you can't control `font`, `padding`, `border`, or `background`. In
-Chrome and Safari on Windows you can't control `border` properly. It will apply
-`border-width` but will only show a border color (which cannot be controlled)
-for the outer 1px of that border. Applying `-webkit-appearance: textfield`
-addresses these issues without removing the benefits of search inputs (e.g.
-showing past searches). Safari (but not Chrome) will clip the cancel button on
-when it has padding (and `textfield` appearance).
-
-#### `::placeholder`
-
-In Edge, placeholders will disappear on `relative` or `absolute` positioned
-`<input>` elements if you use `opacity` less than `1` due to a [bug](https://developer.microsoft.com/en-us/microsoft-edge/platform/issues/3901363/).
+* Opera (last 3)
+* Safari (last 3)
+* iOS Safari (last 2)
+* Internet Explorer 9+
## Contributing
@@ -96,10 +37,12 @@ contribution process easy and effective for everyone involved.
## Similar Projects
-- [opinionate.css](https://github.com/adamgruber/opinionate.css) - Supplement to normalize, restores opinionated rules removed in v6
-- [sanitize.css](https://github.com/jonathantneal/sanitize.css) - Alternative to normalize, adheres to common developer expectations and preferences
+- [opinionate.css](https://github.com/adamgruber/opinionate.css) - A supplement to normalize.css with opinionated rules
+- [sanitize.css](https://github.com/csstools/sanitize.css) - An alternative to normalize.css, adhering to common developer expectations and preferences
## Acknowledgements
-Normalize is a project by [Jonathan Neal](https://github.com/jonathantneal),
+normalize.css is a project by [Jonathan Neal](https://github.com/jonathantneal),
co-created with [Nicolas Gallagher](https://github.com/necolas).
+
+[normalize.css]: https://github.com/csstools/normalize.css
diff --git a/bower.json b/bower.json
deleted file mode 100644
index e8f0d67..0000000
--- a/bower.json
+++ /dev/null
@@ -1,17 +0,0 @@
-{
- "name": "normalize-css",
- "description": "A modern alternative to CSS resets",
- "main": "normalize.css",
- "authors": [
- "Jonathan Neal <jonathantneal@hotmail.com> (http://jonathantneal.com/)",
- "Nicolas Gallagher <nicolas@nicolasgallagher.com> (http://nicolasgallagher.com/)"
- ],
- "license": "MIT",
- "ignore": [
- "CHANGELOG.md",
- "CONTRIBUTING.md",
- "package.json",
- "README.md",
- "test.html"
- ]
-}
diff --git a/normalize.css b/normalize.css
index 33efd60..71ad9df 100644
--- a/normalize.css
+++ b/normalize.css
@@ -1,7 +1,7 @@
-/*! normalize.css v7.0.0 | MIT License | github.com/jonathantneal/normalize.css */
+/*! normalize.css v8.0.0 | MIT License | github.com/csstools/normalize.css */
/* Document
- ========================================================================== */
+ * ========================================================================== */
/**
* 1. Correct the line height in all browsers.
@@ -16,20 +16,7 @@ html {
}
/* Sections
- ========================================================================== */
-
-/**
- * Add the correct display in IE 8-.
- */
-
-article,
-aside,
-footer,
-header,
-nav,
-section {
- display: block;
-}
+ * ========================================================================== */
/**
* Correct the font size and margin on `h1` elements within `section` and
@@ -42,24 +29,7 @@ h1 {
}
/* Grouping content
- ========================================================================== */
-
-/**
- * Add the correct display in IE 8-.
- */
-
-figcaption,
-figure {
- display: block;
-}
-
-/**
- * Add the correct margin in IE 8-.
- */
-
-figure {
- margin: 1em 40px;
-}
+ * ========================================================================== */
/**
* 1. Add the correct box sizing in Firefox.
@@ -91,37 +61,23 @@ pre {
}
/* Text-level semantics
- ========================================================================== */
+ * ========================================================================== */
/**
- * 1. Remove the gray background on active links in IE 10.
- * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
+ * Remove the gray background on active links in IE 10.
*/
a {
background-color: transparent; /* 1 */
- -webkit-text-decoration-skip: objects; /* 2 */
}
/**
- * 1. Remove the bottom border in Firefox 39-.
- * 2. Add the correct text decoration in Chrome 57-, Edge, IE, Opera,
- and Safari.
+ * Add the correct text decoration in Edge, IE, Opera, and Safari.
*/
abbr[title] {
- border-bottom: none; /* 1 */
- text-decoration: underline; /* 2 */
- text-decoration: underline dotted; /* 2 */
-}
-
-/**
- * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
- */
-
-b,
-strong {
- font-weight: inherit;
+ text-decoration: underline;
+ text-decoration: underline dotted;
}
/**
@@ -146,23 +102,6 @@ samp {
}
/**
- * Add the correct font style in Android 4.3-.
- */
-
-dfn {
- font-style: italic;
-}
-
-/**
- * Add the correct background and color in IE 8-.
- */
-
-mark {
- background-color: #ff0;
- color: #000;
-}
-
-/**
* Add the correct font size in all browsers.
*/
@@ -171,7 +110,7 @@ small {
}
/* Embedded content
- ========================================================================== */
+ * ========================================================================== */
/**
* Add the correct display in IE 9-.
@@ -208,7 +147,7 @@ svg:not(:root) {
}
/* Forms
- ========================================================================== */
+ * ========================================================================== */
/**
* Remove the margin in Firefox and Safari.
@@ -244,28 +183,16 @@ button,
}
/**
- * Prevent a WebKit bug where (2) destroys native `audio` and `video` controls
- * in Android 4.
- */
-
-html [type="button"] {
- -webkit-appearance: button;
-}
-
-/**
* Remove the inner border and padding in Firefox.
*/
-button::-moz-focus-inner,
-[type="button"]::-moz-focus-inner,
-[type="reset"]::-moz-focus-inner,
-[type="submit"]::-moz-focus-inner {
+::-moz-focus-inner {
border-style: none;
padding: 0;
}
/**
- * Restore the focus styles unset by the previous rule.
+ * Restore the focus styles unset by the previous rule in Firefox.
*/
button:-moz-focusring,
@@ -348,8 +275,8 @@ textarea {
* Correct the cursor style of increment and decrement buttons in Chrome.
*/
-[type="number"]::-webkit-inner-spin-button,
-[type="number"]::-webkit-outer-spin-button {
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
height: auto;
}
@@ -364,11 +291,10 @@ textarea {
}
/**
- * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
+ * Remove the inner padding in Chrome and Safari on macOS.
*/
-[type="search"]::-webkit-search-cancel-button,
-[type="search"]::-webkit-search-decoration {
+::-webkit-search-decoration {
-webkit-appearance: none;
}
@@ -383,10 +309,10 @@ textarea {
}
/* Interactive
- ========================================================================== */
+ * ========================================================================== */
/*
- * Add the correct display in Edge, Firefox 48-, and IE.
+ * Add the correct display in Edge and IE.
*/
details {
@@ -394,6 +320,32 @@ details {
}
/*
+ * Add the correct styles in Edge, IE, and Safari.
+ */
+
+dialog {
+ background-color: white;
+ border: solid;
+ color: black;
+ display: block;
+ height: -moz-fit-content;
+ height: -webkit-fit-content;
+ height: fit-content;
+ left: 0;
+ margin: auto;
+ padding: 1em;
+ position: absolute;
+ right: 0;
+ width: -moz-fit-content;
+ width: -webkit-fit-content;
+ width: fit-content;
+}
+
+dialog:not([open]) {
+ display: none;
+}
+
+/*
* Add the correct display in all browsers.
*/
@@ -402,7 +354,7 @@ summary {
}
/* Scripting
- ========================================================================== */
+ * ========================================================================== */
/**
* Add the correct display in IE 9-.
@@ -420,8 +372,8 @@ template {
display: none;
}
-/* Hidden
- ========================================================================== */
+/* User interaction
+ * ========================================================================== */
/**
* Add the correct display in IE 10-.
diff --git a/package.json b/package.json
index 508fd86..7a316d7 100644
--- a/package.json
+++ b/package.json
@@ -1,37 +1,46 @@
{
- "name": "normalize.css",
- "version": "7.0.0",
- "description": "A modern alternative to CSS resets",
+ "name": "@csstools/normalize.css",
+ "version": "8.0.0",
+ "description": "A cross-browser CSS foundation",
+ "author": "Jonathan Neal <jonathantneal@hotmail.com>",
+ "contributors": [
+ "Jonathan Neal <jonathantneal@hotmail.com> (http://jonathantneal.com/)",
+ "Nicolas Gallagher <nicolas@nicolasgallagher.com> (http://nicolasgallagher.com/)"
+ ],
+ "license": "CC0-1.0",
+ "repository": "csstools/normalize.css",
+ "homepage": "https://github.com/csstools/normalize.css#readme",
+ "bugs": "https://github.com/csstools/normalize.css/issues",
"main": "normalize.css",
"style": "normalize.css",
"files": [
- "LICENSE.md",
"normalize.css"
],
- "devDependencies": {
- "stylelint": "^7.9.0",
- "stylelint-config-standard": "^16.0.0"
- },
"scripts": {
+ "prepublishOnly": "npm test",
"test": "stylelint normalize.css"
},
- "repository": "jonathantneal/normalize.css",
- "contributors": [
- "Jonathan Neal <jonathantneal@hotmail.com> (http://jonathantneal.com/)",
- "Nicolas Gallagher <nicolas@nicolasgallagher.com> (http://nicolasgallagher.com/)"
- ],
- "license": "MIT",
- "bugs": "https://github.com/jonathantneal/normalize.css/issues",
- "homepage": "https://jonathantneal.github.io/normalize.css",
+ "devDependencies": {
+ "stylelint": "^9.3.0",
+ "stylelint-config-standard": "^18.2.0"
+ },
"stylelint": {
"extends": "stylelint-config-standard",
"rules": {
"font-family-no-duplicate-names": [
true,
{
- "ignoreFontFamilyNames": ["monospace"]
+ "ignoreFontFamilyNames": [
+ "monospace"
+ ]
}
]
}
- }
+ },
+ "keywords": [
+ "css",
+ "normalizes",
+ "browsers",
+ "fixes"
+ ]
}
diff --git a/test.html b/test.html
index a8f7bad..b297432 100644
--- a/test.html
+++ b/test.html
@@ -2,7 +2,7 @@
<html lang="en">
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
-<title>Normalize CSS: UI tests</title>
+<title>normalize.css: tests</title>
<script src="https://rawgit.com/aFarkas/html5shiv/gh-pages/dist/html5shiv.min.js"></script>
<link rel="stylesheet" href="normalize.css">
<style>
@@ -61,16 +61,6 @@
text-transform: uppercase;
}
- /* Custom helpers */
-
- /**
- * Test whether the body's margin has been removed
- */
-
- body {
- background: red;
- }
-
/**
* Highlight the bounds of direct children of a test block
*/
@@ -81,71 +71,47 @@
</style>
<div class="Test">
- .
-
- <h1 class="Test-title"><a href="https://github.com/necolas/normalize.css">Normalize.css</a>: UI tests</h1>
+ <h1 class="Test-title"><a href="https://github.com/csstools/normalize.css">normalize.css</a>: tests</h1>
<h2 class="Test-describe"><code>html</code></h2>
- <h3 class="Test-it">should have sans-serif font family (opinionated)</h3>
+ <h3 class="Test-it">should have a line height of 1.15</h3>
<div class="Test-run">
abcdefghijklmnopqrstuvwxyz
</div>
- <h3 class="Test-it">should have a line height of 1.15</h3>
+ <h3 class="Test-it">should not adjust font size after orientation changes</h3>
<div class="Test-run">
abcdefghijklmnopqrstuvwxyz
</div>
- <h2 class="Test-describe"><code>body</code></h2>
- <h3 class="Test-it">should have no margin (opinionated)</h3>
+ <h2 class="Test-describe"><code>h1</code></h2>
+ <h3 class="Test-it">should not change size within an <code>article</code> or <code>section</code></h3>
<div class="Test-run">
- (there should be no red background visible on this page)
+ <h1>Heading (control)</h1>
+ <article>
+ <h1>Heading (in article)</h1>
+ </article>
+ <section>
+ <h1>Heading (in section)</h1>
+ </section>
</div>
- <h2 class="Test-describe">
- <code>article</code>, <code>aside</code>, <code>details</code>,
- <code>figure</code>, <code>figcaption</code>, <code>footer</code>,
- <code>header</code>, <code>main</code>,
- <code>menu</code>, <code>nav</code>, <code>section</code>,
- <code>summary</code>
- </h2>
- <h3 class="Test-it">should render as block</h3>
- <div class="Test-run Test-run--highlightEl">
- <article>article</article>
- <aside>aside</aside>
- <details>
- <summary>summary</summary>
- details
- </details>
- <figure>
- figure
- <figcaption>figcaption</figcaption>
- </figure>
- <footer>footer</footer>
- <header>header</header>
- <main>main</main>
- <menu><li>menu</li></menu>
- <nav>nav</nav>
- <section>section</section>
+ <h2 class="Test-describe"><code>hr</code></h2>
+ <h3 class="Test-it">should have a <code>content-box</code> box model</h3>
+ <div class="Test-run">
+ <hr style="height:2px; border:solid #ADD8E6; border-width:2px 0;">
</div>
- <h2 class="Test-describe"><code>audio</code>, <code>canvas</code>, <code>progress</code>, <code>video</code></h2>
- <h3 class="Test-it">should render as inline-block and baseline-aligned</h3>
+ <h2 class="Test-describe"><code>main</code></h2>
+ <h3 class="Test-it">should display as block</h3>
<div class="Test-run Test-run--highlightEl">
- <audio controls>audio</audio>
- <canvas>canvas</canvas>
- <progress>progress</progress>
- <video controls>video</video>
+ <main>main</main>
</div>
- <h2 class="Test-describe"><code>audio:not([controls])</code>, <code>template</code>, <code>[hidden]</code></h2>
- <h3 class="Test-it">should not display</h3>
- <div class="Test-run Test-run--highlightEl">
- <audio>audio</audio>
- <template>
- <h1>{{title}}</h1>
- <content></content>
- </template>
- <p hidden>This should be hidden</p>
+ <h2 class="Test-describe"><code>pre</code></h2>
+ <h3 class="Test-it">should render text at the same absolute size as normal text</h3>
+ <div class="Test-run">
+ <span>span: abcdefghijklmnopqrstuvwxyz.</span><br>
+ <pre>pre: abcdefghijklmnopqrstuvwxyz.</pre>
</div>
<h2 class="Test-describe"><code>a</code></h2>
@@ -153,68 +119,46 @@
<div class="Test-run">
<a href="#non">dummy anchor</a>
</div>
- <h3 class="Test-it">should not skip underlines</h3>
- <div class="Test-run">
- <a href="#non">quip and jig</a>
- </div>
- <h3 class="Test-it">should not have a focus outline when both focused and hovered (opinionated)</h3>
- <div class="Test-run">
- <a href="#non">dummy anchor</a>
- </div>
<h2 class="Test-describe"><code>abbr[title]</code></h2>
- <h3 class="Test-it">should have a dotted underline with a solid underline as a fallback</h3>
+ <h3 class="Test-it">should have a dotted underline text decoration with an underline fallback</h3>
<div class="Test-run">
<abbr title="abbreviation">abbr</abbr>
</div>
<h2 class="Test-describe"><code>b</code>, <code>strong</code></h2>
- <h3 class="Test-it">should have bolder font-weight</h3>
+ <h3 class="Test-it">should have a bolder font-weight</h3>
<div class="Test-run">
<b>b</b>
<strong>strong</strong>
</div>
- <h2 class="Test-describe"><code>dfn</code></h2>
- <h3 class="Test-it">should have italic font-style</h3>
+ <h2 class="Test-describe"><code>code</code>, <code>kbd</code>, <code>samp</code></h2>
+ <h3 class="Test-it">should render text at the same absolute size as normal text</h3>
<div class="Test-run">
- <dfn>dfn</dfn>
+ <span>span: abcdefghijklmnopqrstuvwxyz.</span><br>
+ <code>code: abcdefghijklmnopqrstuvwxyz.</code><br>
+ <kbd>kbd: abcdefghijklmnopqrstuvwxyz.</kbd><br>
+ <samp>samp: abcdefghijklmnopqrstuvwxyz.</samp>
</div>
- <h2 class="Test-describe"><code>h1</code></h2>
- <h3 class="Test-it">should not change size within an <code>article</code></h3>
- <div class="Test-run">
- <h1>Heading (control)</h1>
- <article>
- <h1>Heading (in article)</h1>
- </article>
- </div>
- <h3 class="Test-it">should not change size within a <code>section</code></h3>
+ <h2 class="Test-describe"><code>small</code></h2>
+ <h3 class="Test-it">should render equally small in all browsers</h3>
<div class="Test-run">
- <h1>Heading (control)</h1>
- <section>
- <h1>Heading (in section)</h1>
- </section>
+ control. <small>small.</small>
</div>
- <h2 class="Test-describe"><code>mark</code></h2>
- <h3 class="Test-it">should have a yellow background</h3>
+ <h2 class="Test-describe"><code>audio</code>, <code>video</code></h2>
+ <h3 class="Test-it">should display as inline-block</h3>
<div class="Test-run">
- <mark>mark</mark>
+ <audio controls></audio>
+ <video controls></video>
</div>
- <h2 class="Test-describe"><code>small</code></h2>
- <h3 class="Test-it">should render equally small in all browsers</h3>
+ <h2 class="Test-describe"><code>audio</code></h2>
+ <h3 class="Test-it">should not display</h3>
<div class="Test-run">
- control. <small>small.</small>
- </div>
-
- <h2 class="Test-describe"><code>sub</code> and <code>sup</code></h2>
- <h3 class="Test-it">should not affect a line's visual line-height</h3>
- <div class="Test-run Test-run--highlightEl">
- <p>control.</p>
- <p>control. <sub>sub.</sub></p>
- <p>control. <sup>sup.</sup></p>
+ <audio></audio>
</div>
<h2 class="Test-describe"><code>img</code></h2>
@@ -234,33 +178,9 @@
</svg>
</div>
- <h2 class="Test-describe"><code>code</code>, <code>kbd</code>, <code>pre</code>, <code>samp</code></h2>
- <h3 class="Test-it">should render text at the same absolute size as normal text</h3>
- <div class="Test-run">
- <span>span: abcdefghijklmnopqrstuvwxyz.</span><br>
- <code>code: abcdefghijklmnopqrstuvwxyz.</code><br>
- <kbd>kbd: abcdefghijklmnopqrstuvwxyz.</kbd><br>
- <samp>samp: abcdefghijklmnopqrstuvwxyz.</samp>
- <pre>pre: abcdefghijklmnopqrstuvwxyz.</pre>
- </div>
-
- <h2 class="Test-describe"><code>figure</code></h2>
- <h3 class="Test-it">should have margins</h3>
- <div class="Test-run" style="outline:1px solid #ADD8E6; overflow:hidden;">
- <figure>
- <img style="background-color:#ADD8E6" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="400" height="200">
- </figure>
- </div>
-
- <h2 class="Test-describe"><code>hr</code></h2>
- <h3 class="Test-it">should have a <code>content-box</code> box model</h3>
- <div class="Test-run" style="">
- <hr style="height:2px; border:solid #ADD8E6; border-width:2px 0;">
- </div>
-
<h2 class="Test-describe"><code>button</code>, <code>input</code>, <code>optgroup</code>, <code>select</code>, <code>textarea</code></h2>
- <h3 class="Test-it">should inherit <code>font-size</code> from ancestor</h3>
- <div class="Test-run" style="font-size: 20px;">
+ <h3 class="Test-it">should have no margin</h3>
+ <div class="Test-run">
<button>button</button><br>
<input value="input"><br>
<select style="border:1px solid #999;">
@@ -271,31 +191,6 @@
</select><br>
<textarea>textarea</textarea>
</div>
- <h3 class="Test-it">should not have margins</h3>
- <div class="Test-run" id="form-collection-margins">
- <style>
- #form-collection-margins {
- outline: 1px solid #ADD8E6;
- overflow: hidden;
- }
-
- #form-collection-margins button,
- #form-collection-margins input,
- #form-collection-margins select,
- #form-collection-margins textarea {
- display: block;
- }
- </style>
- <button>button</button>
- <input value="input">
- <select style="border:1px solid #999;">
- <optgroup label="optgroup">
- <option>option</option>
- </optgroup>
- <option>option</option>
- </select>
- <textarea>textarea</textarea>
- </div>
<h2 class="Test-describe"><code>button</code></h2>
<h3 class="Test-it">should have visible overflow</h3>
@@ -314,11 +209,10 @@
<button>abcdefghijklmnopqrstuvwxyz</button>
</div>
- <h2 class="Test-describe"><code>button</code>, <code>select</code></h2>
+ <h2 class="Test-describe"><code>button</code></h2>
<h3 class="Test-it">should not inherit <code>text-transform</code></h3>
<div class="Test-run" style="text-transform:uppercase">
<button>button</button>
- <select><option>option</option></select>
</div>
<h2 class="Test-describe"><code>button</code> and button-style <code>input</code></h2>
@@ -341,15 +235,6 @@
<p><input type="submit" value="input (submit)"></p>
</div>
- <h2 class="Test-describe">disabled <code>button</code> and <code>input</code></h2>
- <h3 class="Test-it">should have <code>default</code> cursor style</h3>
- <div class="Test-run">
- <p><button disabled>button</button></p>
- <p><input disabled type="button" value="input (button)"></p>
- <p><input disabled type="reset" value="input (reset)"></p>
- <p><input disabled type="submit" value="input (submit)"></p>
- </div>
-
<h2 class="Test-describe"><code>button</code>, <code>input</code></h2>
<h3 class="Test-it">should not have extra inner padding in Firefox</h3>
<div class="Test-run" id="button-input-padding">
@@ -376,6 +261,12 @@
</div>
<h2 class="Test-describe"><code>legend</code></h2>
+ <h3 class="Test-it">should wrap text</h3>
+ <div class="Test-run">
+ <fieldset>
+ <legend>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.</legend>
+ </fieldset>
+ </div>
<h3 class="Test-it">should inherit color</h3>
<div class="Test-run" style="color:#ADD8E6;">
<fieldset>
@@ -388,11 +279,21 @@
<legend>legend</legend>
</fieldset>
</div>
- <h3 class="Test-it">should wrap text</h3>
+
+ <h2 class="Test-describe"><code>progress</code></h2>
+ <h3 class="Test-it">should display as inline-block</h3>
<div class="Test-run">
- <fieldset>
- <legend>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.</legend>
- </fieldset>
+ <progress value="70" max="100">70%</progress>
+ </div>
+ <h3 class="Test-it">should have baseline alignment</h3>
+ <div class="Test-run">
+ abc <progress value="70" max="100">70%</progress> xyz
+ </div>
+
+ <h2 class="Test-describe"><code>select</code></h2>
+ <h3 class="Test-it">should not inherit <code>text-transform</code></h3>
+ <div class="Test-run" style="text-transform:uppercase">
+ <select><option>option</option></select>
</div>
<h2 class="Test-describe"><code>textarea</code></h2>
@@ -437,13 +338,31 @@
<div class="Test-run">
<input type="search" style="border:1px solid #ADD8E6; padding:10px; width:200px;">
</div>
- <h3 class="Test-it">should not have a cancel button in Safari or Chrome</h3>
+
+ <h2 class="Test-describe"><code>[type="file"]</code></h2>
+ <h3 class="Test-it">should be styleable</h3>
<div class="Test-run">
- <input type="search" value="search">
+ <input type="file" style="border:1px solid #ADD8E6; padding:10px; width:200px;">
</div>
- <h3 class="Test-it">should reference inherited color</h3>
+
+ <h2 class="Test-describe"><code>details</code></h2>
+ <h3 class="Test-it">should display as block</h3>
<div class="Test-run">
- <input type="text" placeholder="Text goes here" style="background-color: black; color: orange;">
+ <details></details>
+ </div>
+
+ <h2 class="Test-describe"><code>dialog</code></h2>
+ <h3 class="Test-it">should be absolutely positioned</h3>
+ <div class="Test-run" style="position:relative;height:3em">
+ <dialog open>dialog</dialog>
</div>
+ <h2 class="Test-describe"><code>summary</code></h2>
+ <h3 class="Test-it">should display as list-item</h3>
+ <div class="Test-run">
+ <details>
+ <summary>Summary</summary>
+ <p>More information</p>
+ </details>
+ </div>
</div>