Add detail tooltips/pop-up/links on how to secure a NAS

[asalimian]

Using Nutshell can allow the reader to see things at a high-level, but get more information if needed.

Could also be done with <dialog>

[lennon101]

That's awesome! thanks for the tip! Is it easy to integrate into the hugo .md pages?

[lennon101]

@asalimian I just tried adding it to my hugo .md post using a shortcodes and it's "mostly" working but it looks like nutshell is putting a large amount of white space above each of the headings. Any advice on what I could be doing wrong or how to fix?

[asalimian]

the nutshell icon that gets added to each heading is an image, but images in .prose classes get 2em margin added.

.prose :where(img):not(:where([class~=not-prose],[class~=not-prose] *)) {
    margin-top: 2em;
    margin-bottom: 2em;
}

Add this option after the script load

<script src="https://cdn.jsdelivr.net/gh/ncase/nutshell/nutshell.js"> </script>
<script>
  Nutshell.setOptions({
      dontEmbedHeadings: true, // If 'true', removes the "embed this as a nutshell" option on headings
  });
</script>