div.padding-top-xlarge.padding-right-small.padding-bottom-xlarge.padding-left-small.whitespace-normal

  h2.margin-left-xsmall.sm-margin-none.text-xlarge.text-bold.text-color-heading.text-uppercase Les communautés

  div
    solid-form-search.form.search-form.search-button(
      id=`communities-filter-${page}`
      fields='name'
      label-name=''
      widget-name='solid-form-label-text'
      class-name="segment margin-bottom-medium sm-margin-bottom-none third sm-full padding-right-small sm-padding-none text-small text-semibold text-uppercase text-color-heading"
      submit-button=""
      submit-widget="button"
    )
    //-  data-trans='label-name=circle.list.searchBy;submit-button=circle.list.searchButton'


solid-display(
  data-src=`${getComponent('communities')}`
  fields='logo, name, shortDescription'
)