Reputation Plugin Version 0.2

I was hoping it might be a simple CSS fix like adding style="clear: both" or something.

But after looking closely there seems to be an issue with the Core HTML eg.

<div class="names">
  <span>
    <h1 class="  username">
      <a href="/users/adminguy1" data-ember-action="" data-ember-action-1163="1163">
      AdminGuy1 
        <i class="fa fa-shield" aria-hidden="true"></i>
        <span class="sr-only">[en. is a moderator]</span>
      </a>
    </h1>
    <!---->
    <h2>good guy</h2>
    <span id="ember1164" class="ember-view">
      <div id="ember1166" class="user-card-post-names-outlet mitt-show-user-card-post-names ember-view">
      <!---->
      </div>
      <div id="ember1168" class="user-card-post-names-outlet Score ember-view">
      Your reputation: -1
      </div>
    </span>
  </span>
</div>

https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/templates/components/user-card-contents.hbs#L15-L35

Having h tags inside of span tags is not valid HTML so it seems senseless to try and apply CSS fixes to it. Though perhaps changing the plugin template divs to spans might improve the display as div tags inside of span tags is not valid HTML either.

I know work is being done with how plugin-outlets will work so probably best to wait until that settles down and concentrate on other areas of your plugin for the time being.

1 Like