Markup for: views/templates/views-view-list.tpl.php [#1982248]

Meta issue: #1980004: [meta] Creating Dream Markup
Issue based on: #1843754: Convert views/templates/views-view-list.tpl.php to twig

Questions:

Where are all the classes? :(

Comments:

Maybe I'm doing something wrong and all the classes are added outside twig - that's ok.
But in theming I'd like to get away from understanding what is the output that you see - a view, panel etc. The markup should explain what the content represents, but not what is it in back-end. In this case Views show list of items, so this is what should be represented in markup.

Markup proposal:

{% if wrapper_attributes -%}
  <div{{ wrapper_attributes }}>
{% endif %}
  {% if title %}
    <h3 class="item-list-title">{{ title }}</h3>
  {% endif %}

  {% if list.type == 'ul' %}
    <ul class="item-list" {{ list.attributes }}>
  {% else %}
    <ol class="item-list" {{ list.attributes }}>
  {% endif %}

    {% for id, row in rows %}
      <li{{ row_classes[id] }} class="item-list-single">{{ row }}</li>
    {% endfor %}

  {% if list.type == 'ul' %}
    </ul>
  {% else %}
    </ol>
  {% endif %}
{% if wrapper_attributes -%}
  </div>
{% endif %}

Comment	File	Size	Author
#8	Screen Shot 2013-11-24 at 15.52.57.png	39.89 KB	Dragan Eror
#7	1982248-simplifying-markup.patch	849 bytes	Dragan Eror
#7

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Comment #1

oresh CreditAttribution: oresh commented 2 May 2013 at 19:47

Project:		» Drupal core
Version:		» 8.x-dev
Component:	Twig templates conversion (front-end branch)	» markup
Category:	feature	» task

moving to core issues.

Comment #2

mortendk CreditAttribution: mortendk commented 14 May 2013 at 22:25

{% if wrapper_attributes -%}
  <div{{ wrapper_attributes }}>
{% endif %}
  {% if title %}
    <h3 class="item-list-title">{{ title }}</h3>
  {% endif %}

  {% if list.type == 'ul' %}
    <ul class="item-list" {{ list.attributes }}>
  {% else %}
    <ol class="item-list" {{ list.attributes }}>
  {% endif %}

    {% for id, row in rows %}
      <li{{ row_classes[id] }} >{{ row }}</li>
    {% endfor %}

  {% if list.type == 'ul' %}
    </ul>
  {% else %}
    </ol>
  {% endif %}
{% if wrapper_attributes -%}
  </div>
{% endif %}

no reason for the class="item-list-single", unless we begin to add classes to all our li's ... which i sure hope were not ;)

Comment #3

mortendk CreditAttribution: mortendk commented 14 May 2013 at 22:25

{% if wrapper_attributes -%}
  <div{{ wrapper_attributes }}>
{% endif %}
  {% if title %}
    <h3 class="item-list-title">{{ title }}</h3>
  {% endif %}

  {% if list.type == 'ul' %}
    <ul class="item-list" {{ list.attributes }}>
  {% else %}
    <ol class="item-list" {{ list.attributes }}>
  {% endif %}

    {% for id, row in rows %}
      <li{{ row_classes[id] }} >{{ row }}</li>
    {% endfor %}

  {% if list.type == 'ul' %}
    </ul>
  {% else %}
    </ol>
  {% endif %}
{% if wrapper_attributes -%}
  </div>
{% endif %}

no reason for the class="item-list-single", unless we begin to add classes to all our li's ... which i sure hope were not ;)

Comment #4

jenlampton

she / her

CreditAttribution: jenlampton commented 27 September 2013 at 09:20

Issue tags:

+Template consolidation

Can we just use the item-list template for views list? why do we need this?

Comment #5

Manuel Garcia CreditAttribution: Manuel Garcia commented 31 October 2013 at 12:55

To me using item-list would be the way to go.

Very much related: #1939062: Convert theme_item_list() to Twig

Comment #6

marcus7777 CreditAttribution: marcus7777 commented 9 November 2013 at 15:03

why have class="item-list" I think ul or ol in a wrapper div with attributes is all you need and I why not trust {{list.type}} is ul or ol
So I'd love it to be:

{% if wrapper_attributes -%}
  <div{{ wrapper_attributes }}>
{% endif %}
  {% if title %}
    <h3 class="item-list-title">{{ title }}</h3>
  {% endif %}
    <{{list.type}} {{ list.attributes }}>
    {% for id, row in rows %}
      <li{{ row_classes[id] }} >{{ row }}</li>
    {% endfor %}
    </{{list.type}}>
{% if wrapper_attributes -%}
  </div>
{% endif %}

Comment #7

Dragan Eror CreditAttribution: Dragan Eror commented 24 November 2013 at 15:20

Issue summary:

View changes

File	Size
1982248-simplifying-markup.patch	849 bytes

When I started to work on this issue the file views-view-list.tpl.php was already updated I just improved it with suggestion by marcus7777 in #1982248-6: Markup for: views/templates/views-view-list.tpl.php.