Documentation for Implement no-* attributes for <box> (#1042)

MarkBind · Apr 10, 2020 · bc03a0b · bc03a0b
1 parent 2310c86
commit bc03a0b
Showing 1 changed file with 38 additions and 0 deletions.
diff --git a/docs/userGuide/syntax/boxes.mbdf b/docs/userGuide/syntax/boxes.mbdf
@@ -219,6 +219,38 @@ As <code>light</code> and <code>seamless</code> are mutually exclusive styles, <
 </span>
 </include>
 
+**You can remove the background, icon and borders of preset styles.**
+
+<box type="info">
+Custom styles (<code>background-color</code>, <code>border-color</code>, <code>border-left-color</code>, <code>icon</code>) as introduced in the previous section, takes precedence over and are not affected by <code>no-background</code>, <code>no-border</code>, <code>no-icon</code>
+</box>
+
+
+<include src="outputBox.md" boilerplate >
+<span id="code">
+
+```html
+<box no-icon no-background type="success">
+    success box without a tick icon and backgound
+</box>
+
+<box no-border type="definition" light>
+    definition type box, light style without border
+</box>
+```
+</span>
+
+<span id="output">
+<box no-icon no-background type="success">
+    success box without a tick icon and backgound
+</box>
+
+<box no-border type="definition" light>
+    definition type box, light style without border
+</box>
+</span>
+</include>
+
 **You can also use icons and resize them accordingly.**
 
 <include src="outputBox.md" boilerplate >
@@ -264,6 +296,12 @@ header <hr style="margin-top:0.2rem; margin-bottom:0" /> <small>heading <br> (de
 type | `String` | `'none'` | Supports: `info`, `warning`, `success`, `important`, `wrong`, `tip`, `definition`, or empty for default.
 light | `Boolean` | `false` | Uses a light color scheme for the box.
 seamless | `Boolean` | `false` | Uses a seamless style for the box. If `light` is specified, this style will not be activated.
+no-border | `Boolean` | `false` | Removes border, except if styled by `border-color` or `border-left-color`. 
+no-backgound | `Boolean` | `false` | Removes background, except if styled by `backgound-color` option.
+no-icon | `Boolean` | `false` | Removes icon, except if icon is displayed via `icon` option.
+type | `String` | `'none'` | Supports: `info`, `warning`, `success`, `important`, `wrong`, `tip`, `definition`, or empty for default.
+light | `Boolean` | `false` | Uses a light color scheme for the box.
+seamless | `Boolean` | `false` | Uses a seamless style for the box. If `light` is specified, this style will not be activated.
 
 <span id="short" class="d-none">
 ```html