div.segment.full.padding-large.sm-padding-top-small.sm-padding-right-xsmall.sm-padding-bottom-small.sm-padding-left-xsmall.border-bottom.border-color-grey.whitespace-normal
  h2.margin-none.text-color-heading.text-uppercase.text-xlarge.text-letter-spacing-large(data-trans='communities.title')

div.segment.full.padding-large.sm-padding-xsmall.sm-padding-top-medium.whitespace-normal

  div.segment.full.margin-bottom-xlarge
    h3.text-color-heading.text-semibold.text-letter-spacing-large(data-trans='communities.subTitle')

  solid-form-search.form.search-form(
    id="admin-community-filter"
    fields='cell1'
    label-cell1=''
    data-trans='label-cell1=communities.searchBy'
    widget-cell1='solid-form-label-text'
    class-cell1="segment margin-bottom-medium third sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading"
    submit-button="GO"
  )

  .segment.table-wrapper
    .table
      div.table-header.bg-color-third.text-color-heading
        div.segment.table-cell.table-cell.half(data-trans='communities.tableHeader1') 
        div.segment.table-cell.table-cell.half(data-trans='communities.tableHeader2')

      solid-display(
        class='table-body'
        filtered-by='admin-community-filter'
        bind-user
        nested-field='communities'
        fields='cell1(community.name, counter), cell2(community)'
        loader-id='loader-admin-community'

        class-cell1='segment table-cell half'
        class-cell2='segment table-cell half text-center'

        class-community.name='segment block margin-bottom-xxsmall text-xlarge text-color-heading text-semibold text-letter-spacing-large ellipsis'
        widget-community='hubl-action-community'
        action-counter="counter"
        widget-counter="hubl-admin-community-counter"

        order-asc='community.name'
      )

  div#loader-admin-community.loader.loader-top
    div
    div
    div
    div