Add Details to palette examples (#191)

* update to match pymdownx extension page / mkdocs

* link to pymdownx page

* formatting

* add details snippet to the pallete examples

* moved buttons lower on example page

Author: ntno

documentation/docs/configuration/extensions/pymdown-extensions.md

@@ -131,7 +131,9 @@ markdown_extensions:
   [extra_css MkDocs feature]: https://www.mkdocs.org/user-guide/configuration/#extra_css
 
 See reference for usage:
+
 - [Adding Details]
+
   [Adding Details]: ../../../elements/details
 
 # Credit

documentation/docs/elements/details.md

@@ -1,6 +1,6 @@
 # Details setup
 
-Enabling detail blocks requires the `pymdown.blocks.details` extension. Add it to the `markdown_extensions` configuration in `mkdocs.yml`:
+Enabling detail blocks requires the [pymdown.blocks.details extension]. Add it to the `markdown_extensions` configuration in `mkdocs.yml`:
 
 ```yaml
 markdown_extensions:
@@ -10,13 +10,15 @@ markdown_extensions:
           class: terminal-alert
           title: Info
         - name: warn
-          class: terminal-alert terminal-alert-error
+          class: 'terminal-alert terminal-alert-error'
           title: Warning
         - name: important
-          class: terminal-alert terminal-alert-primary
+          class: 'terminal-alert terminal-alert-primary'
           title: Important
 ```
 
+[pymdown.blocks.details extension]: ../../configuration/extensions/pymdown-extensions/#details
+
 # Example
 
 /// info

documentation/docs/elements/examples/details.md

@@ -0,0 +1,15 @@
+## Details Example  
+
+/// info
+This is an info block
+///
+
+/// warning
+This is a warning
+///
+
+/// important
+This is important
+///
+
+<br>

documentation/docs/elements/examples/index.md

@@ -1,7 +1,7 @@
 --8<--
 elements/examples/typography.md
 elements/examples/code.md
-elements/examples/buttons.md
+elements/examples/details.md
 elements/examples/table.md
 elements/examples/footnotes.md
 elements/examples/links.md
@@ -10,4 +10,5 @@ elements/examples/figure.md
 elements/examples/definitions.md
 elements/examples/blockquotes.md
 elements/examples/tooltips.md
+elements/examples/buttons.md
 --8<--