opf/openproject

View on GitHub
lookbook/previews/open_project/deprecated/table_preview/no_ellipse.html.erb

Summary

Maintainability
Test Coverage
<div class="generic-table--container">
  <div class="generic-table--results-container" style="max-height: 340px;">
    <table class="generic-table">
      <colgroup>
        <col opHighlightCol>
        <col opHighlightCol>
        <col opHighlightCol>
        <col opHighlightCol>
        <col opHighlightCol>
      </colgroup>
      <thead>
      <tr>
        <th>
          <div class="generic-table--sort-header-outer">
            <div class="generic-table--sort-header">
                <span class="sort asc">
                  Content wraps in new lines
                </span>
            </div>
          </div>
        </th>
        <th>
          <div class="generic-table--sort-header-outer">
            <div class="generic-table--sort-header">
                <span class="sort asc">
                clipped
                </span>
            </div>
          </div>
        </th>
        <th>
          <div class="generic-table--sort-header-outer">
            <div class="generic-table--sort-header">
                <span class="sort desc">
                  Third
                </span>
            </div>
          </div>
        </th>
        <th>
          <div class="generic-table--sort-header-outer">
            <div class="generic-table--sort-header">
                <span class="sort desc">
                  Fourth
                </span>
            </div>
          </div>
        </th>
        <th>
          <div class="generic-table--sort-header-outer">
            <div class="generic-table--sort-header">
                <span class="sort desc">
                  Fifth
                </span>
            </div>
          </div>
        </th>
      </tr>
      </thead>
      <tbody>
      <tr>
        <td class="-no-ellipsis">
          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus porta lorem congue lacus euismod egestas. Mauris odio orci, semper sed molestie viverra, vestibulum et nisi.
        </td>
        <td>Nullam a sem et metus congue placerat. Text will overflow once max-width is exceeded</td>
        <td>Mauris ut augue viverra, consequat eros eu, maximus quam.</td>
        <td>Maecenas elementum orci a varius suscipit.</td>
        <td>Nunc molestie neque sit amet eros semper dapibus.</td>
      </tr>
      </tbody>
    </table>

  </div>
</div>