diff --git a/modern-base.css b/modern-base.css new file mode 100644 index 0000000..4853e79 --- /dev/null +++ b/modern-base.css @@ -0,0 +1,140 @@ +/*! modern-base | MIT License | https://github.com/sindresorhus/modern-normalize */ + + +/** + * Improve font rendering on HiDPI devices. + */ + +@media + screen and (-webkit-min-device-pixel-ratio: 2), + screen and (min-resolution: 2dppx) { + body { + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + } +} + +/** + * Remove default spacing. + */ + +h1, +h2, +h3, +h4, +h5, +h6, +p, +figure, +blockquote, +dd, +dl, +pre { + margin: 0; +} + +/** + * Show link underline only on hover. + */ + +a { + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +/** + * Remove outline on active/hovered focused links. + */ + +a:active, +a:hover { + outline-width: 0; +} + +/** + * Correct the text style of placeholders in Chrome and Safari. + * See discussion: https://github.com/necolas/normalize.css/issues/550 + */ + +::-webkit-input-placeholder { + color: inherit; + opacity: 0.54; +} + +/** + * Remove text shadow from selections. + */ + +::selection { + background: #b3d7fd; + text-shadow: none; +} + +/** + * Remove outline from `:focus` pseudo element. + * Note: Don't forget to apply some styling for the focus state of elements that support it. + */ + +:focus { + outline-width: 0; +} + +/** + * Remove the list style on navigation lists. + */ + +nav ol, +nav ul { + list-style: none; +} + +/** + * Better looking default horizontal rule + */ + +hr { + display: block; + margin: 1em 0; + padding: 0; + border: 0; + border-top: 1px solid #ccc; +} + +/** + * Remove default fieldset styles. + */ + +fieldset { + margin: 0; + padding: 0; + border: 0; +} + +/** + * Allow only vertical resizing of textareas. + */ + +textarea { + resize: vertical; +} + +svg, +img, +canvas, +video, +audio, +iframe { + /** + * Remove the gap between these elements and the bottom of their containers. + * See: https://github.com/h5bp/html5-boilerplate/issues/440 + */ + vertical-align: middle; + + /** + * Prevent overflow. + */ + max-width: 100%; +} diff --git a/package.json b/package.json index 7d015e3..2d1c58c 100644 --- a/package.json +++ b/package.json @@ -15,10 +15,11 @@ "node": ">=6" }, "scripts": { - "test": "stylelint modern-normalize.css" + "test": "stylelint *.css" }, "files": [ - "modern-normalize.css" + "modern-normalize.css", + "modern-base.css" ], "keywords": [ "normalize", @@ -35,7 +36,9 @@ "extends": "stylelint-config-xo", "rules": { "font-family-no-duplicate-names": null, - "no-duplicate-selectors": null + "no-duplicate-selectors": null, + "selector-no-vendor-prefix": null, + "media-feature-name-no-vendor-prefix": null } } } diff --git a/readme.md b/readme.md index fd5edea..1980105 100644 --- a/readme.md +++ b/readme.md @@ -48,6 +48,12 @@ or ``` +This package also includes a base style with better defaults: + +```css +@import 'node_modules/modern-normalize/modern-base.css'; +``` + ## License