diff --git a/.editorconfig b/.editorconfig new file mode 100644 index 0000000..4039ff1 --- /dev/null +++ b/.editorconfig @@ -0,0 +1,12 @@ +root = true + +[*] +charset = utf-8 +end_of_line = lf +indent_size = 2 +indent_style = space +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..e43b0f9 --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +.DS_Store diff --git a/Readme.md b/Readme.md index 054c81f..8aad077 100644 --- a/Readme.md +++ b/Readme.md @@ -8,17 +8,20 @@ Like normalize.css just what needs reseting is reset to avoid bloat in the brows ## Installation & Usage -Install with npm or download on github +```shell +$ npm install --save destyle.css +``` ## Rules & Caveats -- The box model is reset to `border-box` -- `code`, `pre` and other _code_ elements maintain a monospaced font-family -- `hr` is set to be a solid 1px line that inherits its color from its parent's text color -- Inline elements that carry style (`b`, `i`, `strong`, etc.) are not reset as they, apart from their semantics (if they have any), they only provide a single style and are easy to overwrite. -- `textarea` maintains its natural height -- `select` is reset using `appearance: none` which is not cross-browser be advised when styling custom selects +- The box model is reset to `border-box` +- `code`, `pre` and other _code_ elements maintain a monospaced font-family +- `hr` is set to be a solid 1px line that inherits its color from its parent's text color +- Inline elements that carry style (`b`, `i`, `strong`, etc.) are not reset as they, apart from their semantics (if they have any), they only provide a single style and are easy to overwrite. +- `textarea` maintains its natural height. +- `select` is reset using `appearance: none` which is not cross-browser, be advised when styling custom selects. +- HTML5 Inputs like `range` and `color` are not reset. ## Credits -This project is heavily inspired by normalize.css and the original reset by Eric Meyer. +This project is heavily inspired by [normalize.css](https://github.com/necolas/normalize.css) and the original [reset](https://meyerweb.com/eric/tools/css/reset/) by Eric Meyer. The source of the test page is from [html5-test-page](https://github.com/cbracco/html5-test-page/pulls) diff --git a/destyle.css b/destyle.css index bc7f401..bb0c005 100644 --- a/destyle.css +++ b/destyle.css @@ -1,4 +1,4 @@ -/*! de-style.css v0.0.1 | MIT License */ +/*! de-style.css v1.0.0 | MIT License | https://github.com/nicolas-cusan/destyle.css */ /* Reset box-model ========================================================================== */ @@ -238,6 +238,13 @@ textarea { padding: 0; margin: 0; outline: 0; +} + +/** + * Remove all Style fro select elements. Does not quite work cross-browser + */ + +select { -webkit-appearance: none; appearance: none; } @@ -273,6 +280,8 @@ button, [type='reset'], [type='submit'] { cursor: pointer; + -webkit-appearance: none; + appearance: none; } /** diff --git a/package.json b/package.json new file mode 100644 index 0000000..1e2709f --- /dev/null +++ b/package.json @@ -0,0 +1,16 @@ +{ + "name": "destyle.css", + "version": "1.0.0", + "description": "Opinionated reset stylesheet that provides a clean styling slate for your project.", + "main": "destyle.css", + "style": "destyle.css", + "files": ["destyle.css", "LICENSE"], + "repository": { + "type": "git", + "url": "git+https://github.com/nicolas-cusan/destyle.css.git" + }, + "keywords": ["css", "reset-css", "normalize-css"], + "license": "MIT", + "bugs": "https://github.com/nicolas-cusan/destyle.css/issues", + "homepage": "https://github.com/nicolas-cusan/destyle.css#readme" +} diff --git a/test/index.html b/test.html similarity index 99% rename from test/index.html rename to test.html index 278de95..d16f7b3 100644 --- a/test/index.html +++ b/test.html @@ -4,7 +4,7 @@