How can I limit the logo list rows in the Canopy theme?

[spitre]

We recently purchased the Canopy theme on Shopify and are trying to have it completely set up before we make it live. The theme did not come with a logo list section so I created a new section and copied the logo_list.liquid code from our current theme (Sunrise), with some minor tweaks. The section then appeared in the customize page of the new theme, however when adding in the logos, instead of showing on one row that has a continuous scroll, it creates multiple rows once the first row is full. I imagine its just a matter of adding in a line of code to limit the number of rows in the section, however I've not been able to figure it out and to say the least - I'm frustrated. Any help would be appreciated!

I'll attach photos of what the logo list looks like on our current site and what it's doing in the customize tab when adding logos to the new theme.

Also the code for the section is as follows:

<style>
  .logo-bar__item {
    display: inline-block;
    max-width: {{ section.settings.logo_width }};
  }
</style>

<h2>{{ section.settings.title | escape }}</h2>

{%- if section.blocks.size > 0 -%}
  <ul>
    {%- for block in section.blocks -%}
        {%- if block.settings.link != blank -%}
          <a href="{{ block.settings.link }}">
        {%- endif -%}

          {%- if block.settings.image != blank -%}
            {{ block.settings.image | img_url: '160x160', scale: 2 | img_tag: block.settings.image.alt }}
            {% assign rows = 1 %}
          {%- else -%}
            {{ 'logo' | placeholder_svg_tag: 'placeholder-svg' }}
          {%- endif -%}

        {%- if block.settings.link != blank -%}
          </a>
        {%- endif -%}
    {%- endfor -%}
  </ul>
{%- endif -%}

{% if show_brand_scroller %}
  <div class="scroller" data-section-id="{{ section.id }}" data-section-type="logo-list" data-arrow-left="{% include 'icon-arrowleft'%}" data-arrow-right="{% include 'icon-arrowright'%}">
    <h3 class="scroll-title">{{ section.settings.title }}</h3>
    <div id="brand-scroller" class="owl-carousel" data-autoplay="{{section.settings.scroll_start}}">
      {% for block in section.blocks %}
        {% if block.settings.image == blank %}
          {% capture imagesrc %}{{ 'logo' | placeholder_svg_tag: 'placeholder-svg' }}{% endcapture %}
        {% else %}
          {% capture imagesrc %}<img class="lazyOwl" data-src="{{ block.settings.image | img_url: '200x' }}" alt="{{ block.settings.image.alt | escape }}" />{% endcapture %}
        {% endif %}
        <div class="brand" data-index="{{forloop.index0}}" {{ block.shopify_attributes }}>
          {% if block.settings.link == "blank" %}
            {{imagesrc}}
          {% else %}
            <a href="{{block.settings.link}}">{{imagesrc}}</a>
          {% endif %}
        </div>   
      {% endfor %}
    </div>
  </div>
{% endif %}

{% schema %}
{
  "name": "Logo list",
  "max_blocks": 20,
  "settings": [
      {
        "type": "text",
        "id": "title",
        "label": "Heading",
        "default": "Our brands"
      },
      {
        "type": "select",
        "id": "scroll_start",
        "label": "Start scrolling automatically",
        "options": [
          {
            "value": "5000",
            "label": "Yes"
          },
          {
            "value": "false",
            "label": "No"
          }
        ],
        "default": "5000"
},
    {
      "type": "paragraph",
      "content": "Select pages to display on"
    },
    {
      "type": "checkbox",
      "id": "scroller_home",
      "label": "Home page",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "scroller_collection",
      "label": "Collection page",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "scroller_product",
      "label": "Product page",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "scroller_cart",
      "label": "Cart",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "scroller_page",
      "label": "Single page (about, contact etc.)",
      "default": true
    },
    {
      "type": "checkbox",
      "id": "scroller_blog",
      "label": "Blog",
      "default": true
    }
   ],
      "blocks": [
    {
      "type": "image",
      "name": "Logo",
      "settings": [
        {
          "type": "image_picker",
          "id": "image",
          "label": "Image"
        },
        {
          "type": "url",
          "id": "link",
          "label": "Link"
        }
      ]
    }
  ]
}
{% endschema %}

How our current logo list appears on the original siteSee how the 5th logo drops down to a new row instead of staying in the first row with a scrolling option?

[erolltecson]

Hi, did you get any response from this? I also badly need help with same problem. Thanks