Update dropdown shortcode to use HTML details

Karl

15.27.2020 d0f9ca61a9fb7e4c6633127fddf797a2699e0140

Update dropdown shortcode to use HTML details

Also - more balanced screenshots

 README.md

@@ -36,18 +36,14 @@

### Dropdown Text

To add a link that, when clicked, drops-down a section of text, use shortcode `dropdown/link` and shortcode `dropdown/content`.
To add an HTML details element that, when clicked, drops-down a section of text, use shortcode `dropdown`.

**Example**

```
{{< dropdown/link togglename="dropNum1" linktext="Click here to see the text that will drop down." >}}
```

```
{{< dropdown/content togglename="dropNum1" >}}
{{< dropdown summary="Click here to see the text that will drop down." >}}
  This is the text that drops down when you click the link.
{{< /dropdown/content >}}
{{< /dropdown >}}
```

## Usage

 exampleSite/content/emoji-support.md

@@ -53,8 +53,6 @@
</style>
{{< /css.inline >}}

{{< dropdown/link togglename="dropstuff" linktext="This demonstrates the dropdown shortcode.  Click this." >}}

{{< dropdown/content togglename="dropstuff" >}}
{{< dropdown summary="This demonstrates the dropdown shortcode.  Click this." >}}
    This stuff drops down because you clicked on the text.
{{< /dropdown/content >}}
{{< /dropdown >}}

 exampleSite/content/markdown-syntax.md

@@ -20,7 +20,7 @@
images: ["img/interesting01.jpg"]
imagealt: "Interesting Page Image"
draft: false
weight: 3
weight: 2
---

This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.

 exampleSite/content/redir.md

@@ -4,6 +4,6 @@
draft: false
buttonimage: "img/redirbutton.jpg"
actualurl: "https://github.com/kc0bfv/ticky_tacky_dark"
weight: 2
weight: 3
---


 images/screenshot.png

 images/tn.png

 layouts/partials/head.html

@@ -45,14 +45,6 @@
</noscript>

<script>
    function toggleDisplay( elementID ) {
        elem = document.getElementById(elementID);
        if( elem.style.display == "none" ) {
            elem.style.display = "block";
        } else if( elem.style.display == "block" ) {
            elem.style.display = "none";
        }
    }
    {{ with .Site.Params.images }}
    function randomHeaderImg() {
        let images = [

 layouts/shortcodes/dropdown.md

New file
@@ -0,0 +1,4 @@
<details>
    <summary>{{ .Get "summary" }}</summary>
    {{ .Inner }}
</details>

 layouts/shortcodes/dropdown/content.html

File was deleted

 layouts/shortcodes/dropdown/link.html

File was deleted