h2 header within a div with "notice" class displays box with a weird top margin

[Andre601]

Environment

• Minimal Mistakes version: 2.24.0
• Ruby gem or remote theme version: 0.4.3 (Jekyll-remote-theme)*
• Jekyll version: 3.9.0*
• Git repository URL: https://github.com/Readme-Workflows/Readme-Icons
• GitHub Pages hosted (if yes provide URL to site): https://readme-workflows.github.io/Readme-Icons/
• Operating system: Windows 10

*Info taken from https://pages.github.com/versions/ since it's a GitHub pages hosted page.

Expected behavior

The h2 header should not have such a large padding with the notice box above it.

Steps to reproduce the behavior

Use a H2 Header within a div that has the notice<--type> class applied.

Example:

{% capture example %}
This is some text to display below the header.  
The header itself will have a large green area above it since the margin of the header expands the notice div upwards.
{% endcapture %}

<div class="notice--success">
  <h2 class="no_toc">Example</h2>
  {{ example | markdownify }}
</div>

Other

I've only tested this with the H2 and H4 header. I can't say if other headers are affected too, but I wouldn't doubt this to be the case.
The H4 Header seems to be fine.

[mmistakes]

I think you're hitting all the scenarios the notice class wasn't designed to handle.
The notice-- classes were written to only apply to a <p> element. Not blockquotes, lists, headings, etc. So this isn't completely unexpected as it was done intentionally as a way of styling a paragraph of Markdown easily.

The better path forward I think is to abstract notices into their own _includes that accept parameters for headings and content. Then those elements can be styled appropriately.

[iBug]

H4 was taken special care but not H2:

minimal-mistakes/_sass/minimal-mistakes/_notices.scss

Lines 24 to 25 in 42f7512

	h4 {
	margin-top: 0 !important; /* override*/

[mmistakes]

OK. I stand corrected.
So maybe a small CSS adjustment to fix the spacing.

And a future enhancement to build out a new notice helper. Similar to this... https://idratherbewriting.com/documentation-theme-jekyll/mydoc_alerts.html

Could have swore I built this before, but maybe I'm thinking of another one of my themes.... or personal site... or both.