v2.4.0

* **VERSION:** v2.4.0
* **ACCESSIBILITY:** do not reset `outline` property
* **DOCS:** update year in license
* **DOCS:** minor updates to readme
* **DEV:** remove script to upload to personal CDN
* **DEP:** install Less as a dev dependency

Author: dwhieb

LICENSE renamed to LICENSE.md

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2016 Daniel W. Hieber
+Copyright (c) 2018 Daniel W. Hieber
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,43 +1,47 @@
-# flexbox-reset
-A CSS reset that defaults to the CSS3 flexbox model for elements whenever possible. Exceptions are made for various inline elements, form elements, etc. Based in part on the Meyer reset.
+# [flexbox-reset][1]
 
-[![npm](https://img.shields.io/npm/v/npm.svg?maxAge=2592000)](https://www.npmjs.com/package/flexbox-reset)
-[![npm](https://img.shields.io/npm/dt/flexbox-reset.svg?maxAge=2592000)](https://www.npmjs.com/package/flexbox-reset)
-[![GitHub issues](https://img.shields.io/github/issues/dwhieb/flexbox-reset.svg?maxAge=2592000)](https://github.com/dwhieb/flexbox-reset/issues)
-[![license](https://img.shields.io/github/license/dwhieb/flexbox-reset.svg?maxAge=2592000)](https://github.com/dwhieb/flexbox-reset)
+A CSS reset that defaults to the flexbox model for elements whenever appropriate. Exceptions are made for various inline elements, form elements, etc. Based in part on the Meyer reset.
 
-[![GitHub forks](https://img.shields.io/github/forks/dwhieb/flexbox-reset.svg?style=social&label=Fork&maxAge=2592000)](https://github.com/dwhieb/flexbox-reset)
-[![GitHub stars](https://img.shields.io/github/stars/dwhieb/flexbox-reset.svg?style=social&label=Star&maxAge=2592000)](https://github.com/dwhieb/flexbox-reset)
-[![GitHub watchers](https://img.shields.io/github/watchers/dwhieb/flexbox-reset.svg?style=social&label=Watch&maxAge=2592000)](https://github.com/dwhieb/flexbox-reset)
-[![GitHub followers](https://img.shields.io/github/followers/dwhieb.svg?style=social&label=Follow&maxAge=2592000)](https://github.com/dwhieb/flexbox-reset)
+[![npm](https://img.shields.io/npm/v/npm.svg?maxAge=2592000)][2]
+[![npm](https://img.shields.io/npm/dt/flexbox-reset.svg?maxAge=2592000)][2]
+[![GitHub issues](https://img.shields.io/github/issues/dwhieb/flexbox-reset.svg?maxAge=2592000)][3]
+[![license](https://img.shields.io/github/license/dwhieb/flexbox-reset.svg?maxAge=2592000)][4]
+
+[![GitHub stars](https://img.shields.io/github/stars/dwhieb/flexbox-reset.svg?style=social&label=Star&maxAge=2592000)][1]
+[![GitHub forks](https://img.shields.io/github/forks/dwhieb/flexbox-reset.svg?style=social&label=Fork&maxAge=2592000)][1]
 
 ## Install
 
 Install using npm:
+
 ```
-npm install --save flexbox-reset
+npm i flexbox-reset
 ```
 
-Or simply [download from GitHub](https://raw.githubusercontent.com/dwhieb/flexbox-reset/master/flexbox-reset.less).
+[Or download from the GitHub release page][5].
 
 ## Usage
+
 HTML:
 
 ```html
 <link rel=stylesheet href=node_modules/flexbox-reset/flexbox-reset.css type=text/css>
 ```
 
 CSS:
+
 ```css
 @import 'node_modules/flexbox-reset/flexbox-reset.css';
 ```
 
 LESS:
-```less
+
+```css
 @import 'node_modules/flexbox-reset/flexbox-reset.less';
 ```
 
 ## Philosophy
+
 When the web began, webpages were primarily modeled on traditional print paper documents, and so CSS styles were designed to imitate the classic paper book/document, and were largely text-focused. Webpages were designed to be read from top to bottom like a paper page, with headers, sidebars, and fixed page widths.
 
 Today, webpages are no longer modeled on text documents. They are much less linear, and focus more strongly on multimedia elements, which may be positioned anywhere on the page. While many webpages still include sections of running text, these sections now usually make up just one part of a page.
@@ -47,3 +51,9 @@ So why are we still using styles designed for print layouts when our webpages no
 This flexbox reset is based on the observation that modern webpages are multimedia, visual interactive layouts, where running sections of text are just one type of content among many. Since the flexbox model better captures the design of modern webpages, this reset applies the flexbox model by default, and makes exceptions for inline elements, form elements, and others.
 
 By switching the default styling approach from block or inline to flexbox, running text becomes the special case rather than the norm. Users should apply traditional block and inline styles to sections of their page which contain running text.
+
+[1]: https://github.com/dwhieb/flexbox-reset
+[2]: https://www.npmjs.com/package/flexbox-reset
+[3]: https://github.com/dwhieb/flexbox-reset/issues
+[4]: https://github.com/dwhieb/flexbox-reset/blob/master/LICENSE.md
+[5]: https://github.com/dwhieb/flexbox-reset/releases

build/upload.js

@@ -1,3 +1,5 @@
+/* reset.less */
+/* The CSS reset, from the flexbox-reset package: https://www.npmjs.com/package/flexbox-reset */
 html,
 body,
 div,
@@ -92,7 +94,6 @@ video {
   flex-direction: column;
   font: inherit;
   margin: 0;
-  outline: 0;
   padding: 0;
   text-decoration: none;
   vertical-align: baseline;
@@ -157,7 +158,8 @@ a:link,
 a:visited,
 a:hover,
 a:active {
-  background: transparent;
+  background-color: transparent;
+  background-image: none;
   color: inherit;
   text-decoration: none;
 }
@@ -175,10 +177,10 @@ blockquote,
 q {
   quotes: none;
 }
-blockquote:before,
-q:before,
-blockquote:after,
-q:after {
+blockquote::before,
+q::before,
+blockquote::after,
+q::after {
   content: '';
   content: none;
 }

flexbox-reset.css

@@ -1,3 +1,7 @@
+/* reset.less */
+
+/* The CSS reset, from the flexbox-reset package: https://www.npmjs.com/package/flexbox-reset */
+
 // general elements
 html, body, div, span, applet, object, iframe,
 // heading elements
@@ -20,7 +24,6 @@ article, aside, audio, canvas, details, embed, figure, figcaption, footer, heade
   flex-direction:  column;
   font:            inherit;
   margin:          0;
-  outline:         0;
   padding:         0;
   text-decoration: none;
   vertical-align:  baseline;
@@ -42,27 +45,28 @@ blockquote, button, caption, dd, dt, figcaption, h1, h2, h3, h4, h5, h6, input,
 
 // remove link styling
 a, a:link, a:visited, a:hover, a:active {
-  background: transparent;
-  color: inherit;
-  text-decoration: none;
+  background-color: transparent;
+  background-image: none;
+  color:            inherit;
+  text-decoration:  none;
 }
 
 // set defaults for body
 body {
-  color: black;
-  font-size: 100%;
+  color:        black;
+  font-size:    100%;
   font-stretch: normal;
-  font-style: normal;
+  font-style:   normal;
   font-variant: normal;
-  font-weight: normal;
-  line-height: 1;
-  min-height: 100vh;
+  font-weight:  normal;
+  line-height:  1;
+  min-height:   100vh;
 }
 
 // remove styling from quotes
 blockquote, q {
   quotes: none;
-  &:before, &:after {
+  &::before, &::after {
     content: '';
     content: none;
   }
@@ -88,7 +92,7 @@ ol, ul {
 // set default table styling
 table {
   border-spacing: 0;
-  display: table;
+  display:        table;
 }
 
 tbody {