[WIP] Add base style with good defaults

While `modern-normalize.css` is great for ensuring consistency, the default browser styles are not that nice. The goal of `modern-base.css` is to be a better base, that you use in addition to `modern-normalize.css`. This base can afford to be opinionated.

modern-base.css

@@ -0,0 +1,133 @@
+/*! modern-base | MIT License | https://github.com/sindresorhus/modern-normalize */
+
+/**
+ * 1. Break up words and URLs so they don't break your layout.
+ * 2. Improve font rendering in Chrome and Safari on macOS.
+ */
+
+html {
+	word-break: break-all; /* 1 */
+	-webkit-font-smoothing: antialiased; /* 2 */
+}
+
+/**
+ * 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;
+}
+
+
+/**
+ * Remove the gap between these elements and the bottom of their containers.
+ * See: https://github.com/h5bp/html5-boilerplate/issues/440
+ */
+
+svg,
+img,
+canvas,
+video,
+audio,
+iframe {
+	vertical-align: middle;
+}

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,8 @@
 		"extends": "stylelint-config-xo",
 		"rules": {
 			"font-family-no-duplicate-names": null,
-			"no-duplicate-selectors": null
+			"no-duplicate-selectors": null,
+			"selector-no-vendor-prefix": null
 		}
 	}
 }

readme.md

@@ -48,6 +48,12 @@ or
 <link rel="stylesheet" href="node_modules/modern-normalize/modern-normalize.css">
 ```
 
+This package also includes a base style with better defaults:
+
+```css
+@import 'node_modules/modern-normalize/modern-base.css';
+```
+
 
 ## License