docs: documentation for new configuration structure (#447)

* docs: new configuration structure for alt-require

* docs: new configuration structure for attr-lowercase

* docs: new configuration structure for attr-no-duplication

* docs: new configuration structure for attr-no-unnecessary-whitespace

* docs: update getting started

* docs: add missing rules

* docs: fix broken links

* docs: new configuration structure for attr-sorted

* docs: remove unnecessary prettier-ignore

* docs: new configuration structure for attr-unsafe-chars

* docs: new configuration structure for attr-value-double-quotes

* docs: new configuration structure for attr-value-not-empty

* docs: use texts from rules

* docs: new configuration structure for attr-value-single-quotes

* docs: new configuration structure for attr-whitespace

* docs: new configuration structure for doctype-first

* docs: new configuration structure for doctype-html5

* docs: remove empty-tag-not-self-closed

* docs: new configuration structure for head-script-disabled

* docs: new configuration structure for href-abs-or-rel

* docs: new configuration structure for id-class-ad-disabled

* docs: new configuration structure for id-class-value

* docs: new configuration structure for id-unique

* docs: new configuration structure for inline-script-disabled

* docs: new configuration structure for inline-style-disabled

* docs: new configuration structure for input-requires-label

* docs: new configuration structure

* docs: update doc attr-whitespace

* docs: update doc tags-check

* docs: update doc tagname-specialchars

* docs: update doc

Author: thedaviddias

docs/user-guide/getting-started.mdx

@@ -38,7 +38,7 @@ yarn add --dev htmlhint
 
 ```shell
 {
-  "attr-value-not-empty": false
+  "attr-value-not-empty": "off"
 }
 ```
 

docs/user-guide/list-rules.md

@@ -30,7 +30,6 @@ title: List of rules
 - [`tag-pair`](/docs/user-guide/rules/tag-pair): Tag must be paired.
 - [`tag-self-close`](/docs/user-guide/rules/tag-self-close): Empty tags must be self closed.
 - [`tagname-lowercase`](/docs/user-guide/rules/tagname-lowercase): All html element names must be in lowercase.
-- [`empty-tag-not-self-closed`](/docs/user-guide/rules/empty-tag-not-self-closed): The empty tag should not be closed by self.
 - [`src-not-empty`](/docs/user-guide/rules/src-not-empty): The src attribute of an img(script,link) must have a value.
 - [`href-abs-or-rel`](/docs/user-guide/rules/href-abs-or-rel): An href attribute must be either absolute or relative.
 

docs/user-guide/rules/attr-no-duplication.md

@@ -3,25 +3,49 @@ id: attr-no-duplication
 title: attr-no-duplication
 ---
 
-The same attribute can't be specified twice.
+Elements cannot have duplicate attributes.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-no-duplication": "off",
+  "attr-no-duplication": "warn",
+  "attr-no-duplication": "error",
+  "attr-no-duplication": ["off"],
+  "attr-no-duplication": ["warn"],
+  "attr-no-duplication": ["error"]
+}
+```
 
-Level: `error`
+## Default
 
-## Config value
+```json
+{ "attr-no-duplication": "error" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="a.png" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <img src="a.png" src="b.png" />
 ```
+
+---
+
+## When Not To Use It
+
+You always want to use this rule.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.6`.

docs/user-guide/rules/attr-no-unnecessary-whitespace.md

@@ -5,25 +5,56 @@ title: attr-no-unnecessary-whitespace
 
 No spaces between attribute names and values.
 
-Level: `error`
+## Possible Configuration Values
+
+```json
+{
+  "attr-no-unnecessary-whitespace": "off",
+  "attr-no-unnecessary-whitespace": "warn",
+  "attr-no-unnecessary-whitespace": "error",
+  "attr-no-unnecessary-whitespace": ["off"],
+  "attr-no-unnecessary-whitespace": ["warn", { "exceptions": ["test"] }],
+  "attr-no-unnecessary-whitespace": ["error", { "exceptions": ["test"] }]
+}
+```
+
+## Default
 
-## Config value
+```json
+{ "attr-no-unnecessary-whitespace": "error" }
+```
 
-1. true: enable rule
-2. false: disable rule
+## Options
 
-The following pattern are **not** considered violations:
+This rule has an object option:
+
+- `"exceptions": ['test']` ignore some attribute names.
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <div title="a"></div>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
 <div title = "a"></div>
 <div title= "a"></div>
 <div title ="a"></div>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use spaces between attribute names and values.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.13.0`.

docs/user-guide/rules/attr-sorted.md

@@ -0,0 +1,51 @@
+---
+id: attr-sorted
+title: attr-sorted
+---
+
+Attribute tags must be in proper order.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-sorted": "off",
+  "attr-sorted": "warn",
+  "attr-sorted": "error",
+  "attr-sorted": ["off"],
+  "attr-sorted": ["warn"],
+  "attr-sorted": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "attr-sorted": "off" }
+```
+
+---
+
+## Examples
+
+Examples of **correct** code for this rule:
+
+```html
+<img alt="test" src="test.png" />
+```
+
+Examples of **incorrect** code for this rule:
+
+```html
+<img src="test.png" alt="test" />
+```
+
+---
+
+## When Not To Use It
+
+If your project will use attributes in an unsorted order.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.11.0`.

docs/user-guide/rules/attr-unsafe-chars.md

@@ -3,37 +3,61 @@ id: attr-unsafe-chars
 title: attr-unsafe-chars
 ---
 
-Attribute value cannot use unsafe chars.
+Attribute values cannot contain unsafe chars.
 
-regexp: `/[\u0000-\u0009\u000b\u000c\u000e-\u001f\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/`
+Checks against regexp pattern: `/[\u0000-\u0009\u000b\u000c\u000e-\u001f\u007f-\u009f\u00ad\u0600-\u0604\u070f\u17b4\u17b5\u200c-\u200f\u2028-\u202f\u2060-\u206f\ufeff\ufff0-\uffff]/`
 
-Level: `warning`
+## Possible Configuration Values
 
-## Config value
+```json
+{
+  "attr-unsafe-chars": "off",
+  "attr-unsafe-chars": "warn",
+  "attr-unsafe-chars": "error",
+  "attr-unsafe-chars": ["off"],
+  "attr-unsafe-chars": ["warn"],
+  "attr-unsafe-chars": ["error"]
+}
+```
+
+## Default
+
+```json
+{ "attr-unsafe-chars": "off" }
+```
+
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <li>
   <a href="https://vimeo.com/album/1951235/video/56931059">Sud Web 2012</a>
 </li>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <li>
-  <a href="https://vimeo.com/album/1951235/video/56931059‎\u0009‎"
-    >Sud Web 2012</a
-  >
+  <a href="https://vimeo.com/album/1951235/video/56931059‎\u0009‎">
+    Sud Web 2012
+  </a>
 </li>
 ```
 
 :::tip
 The unsafe chars is in the tail of the href attribute.
 :::
+
+---
+
+## When Not To Use It
+
+If your project will use unsafe chars.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.6`.

docs/user-guide/rules/attr-value-double-quotes.md

@@ -3,25 +3,50 @@ id: attr-value-double-quotes
 title: attr-value-double-quotes
 ---
 
-Attribute value must closed by double quotes.
+Attribute values must be in double quotes.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-value-double-quotes": "off",
+  "attr-value-double-quotes": "warn",
+  "attr-value-double-quotes": "error",
+  "attr-value-double-quotes": ["off"],
+  "attr-value-double-quotes": ["warn"],
+  "attr-value-double-quotes": ["error"]
+}
+```
+
+## Default
 
-Level: `error`
+```json
+{ "attr-value-double-quotes": "error" }
+```
 
-## Config value
+---
 
-1. true: enable rule
-2. false: disable rule
+## Examples
 
-The following pattern are **not** considered violations:
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <a href="" title="abc"></a>
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
 <!-- prettier-ignore -->
 ```html
 <a href='' title='abc'></a>
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use single quotes for attribute values.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.

docs/user-guide/rules/attr-value-not-empty.md

@@ -3,25 +3,49 @@ id: attr-value-not-empty
 title: attr-value-not-empty
 ---
 
-Attribute must set value.
+All attributes must have values.
+
+## Possible Configuration Values
+
+```json
+{
+  "attr-value-not-empty": "off",
+  "attr-value-not-empty": "warn",
+  "attr-value-not-empty": "error",
+  "attr-value-not-empty": ["off"],
+  "attr-value-not-empty": ["warn"],
+  "attr-value-not-empty": ["error"]
+}
+```
 
-Level: `warning`
+## Default
 
-## Config value
+```json
+{ "attr-lowercase": "off" }
+```
 
-1. true: enable rule
-2. false: disable rule
+---
 
-The following pattern are **not** considered violations:
+## Examples
+
+Examples of **correct** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <input type="button" disabled="disabled" />
 ```
 
-The following pattern is considered violation:
+Examples of **incorrect** code for this rule:
 
-<!-- prettier-ignore -->
 ```html
 <input type="button" disabled />
 ```
+
+---
+
+## When Not To Use It
+
+If your project will use attributes that doesn't need a value.
+
+## Version
+
+This rule was introduced in HTMLHint `v0.9.1`.