Lexer does not properly parse `class` attributes with multiple class names inside

[sevenseacat]

eg.

<div class="flex gap-2 mt-4"></div>

The highlighter will split the class string on the whitespace, and then mark other classes as attributes.

iex> Makeup.highlight(~s|<div class="flex gap-2 mt-4"></div>|, lexer: Makeup.Lexers.HTMLLexer)

generates:

<pre class="highlight">
  <code>
    <span class="p" data-group-id="2418906342-1">&lt;</span>
    <span class="nt">div</span>
    <span class="w"> </span>
    <span class="na">class</span>
    <span class="o">=</span>
    <span class="s">&quot;flex</span> 
    <span class="w"> </span>
    <span class="na">gap-2</span>
    <span class="w"> </span>
    <span class="s">mt-4&quot;</span>
    <span class="p" data-group-id="2418906342-1">&gt;</span>
    <span class="p" data-group-id="2418906342-2">&lt;/</span>
    <span class="nt">div</span>
    <span class="p" data-group-id="2418906342-2">&gt;</span>
  </code>
</pre>