Docs: Adding data-icon="false" for listview-items (attribute reference)

[MauriceG]

Tested at http://jsfiddle.net/MauriceG/u2C76/

[jaspermdegroot]

When data-icon is set to false the listview item still has the default data-iconpos right and class ui-btn--icon-right is added which means padding right.

[Update: removed reference to other issue]

[MauriceG]

Hi!
Thanks for that hint. But with the Safari web inspector I can not see the padding:

May I've got you wrong?

[jaspermdegroot]

Hi Maurice!

No you've not got me wrong. You are right :-)

The data attribute and the ui-btn-icon-right class is there (on the LI element) but listview items don't use this class at all. Only ui-li-has-arrow and that class is not added when you use data icon false.
Sorry, I should have looked better before I wrote that comment.

Good luck with all the good work on the documents!

[toddparker]

Cool that this works. @MauriceG - mind adding an example of various icons applied to listviews from your fiddle to this page: http://jquerymobile.com/test/docs/lists/docs-lists.html

Maybe inside the thumbnail & icon section, after the 2 buttons. Add a sentence saying you can set the icon for any list with linked items and paste in those samples.

[MauriceG]

@toddparker
I think, to add the icons example list from the fiddle, I need a new html document in jquery-mobile / docs / lists
to link to from docs-lists.html. With my modest knowing about GitHub I'm overwhelmed with that. Sorry ...

[jaspermdegroot]

@MauriceG

If you want I can help you with this. When you post introduction text in a comment here I will take care of the rest.

[MauriceG]

Hi Jasper!
Thanks :-) If you like, you can take the code from the fiddle above.
I think, we just need a page with the listview inside like all other list examples in the docs.
@toddparker just have us to say, how the link should been called, because icons is already in use.
May we can rename icons in the navigation-list to List with icon images (like the button at the docs-lists.html)
and call the new one list item icons or something like that.
Thanks in advance!

[jaspermdegroot]

Yeah I was just thinking about how to avoid confusion about 'icons'. In the navmenu the 'Lists with icon images' are simply called 'Icons' so that should change as well. Lets hear what Todd thinks is best.

Please help to remind me I update the nav.html file (the search index) as well.

[agcolom]

Hi Everyone, The icons as per @MauriceG jsfiddle are covered on the list theming page: http://jquerymobile.com/test/docs/lists/lists-themes.html

How about simply adding a heading "customizing lists" towards the end of http://jquerymobile.com/test/docs/lists/docs-lists.html, after inset lists that points to http://jquerymobile.com/test/docs/lists/lists-themes.html ?

Anne

[MauriceG]

Hi Anne :-)

Okay, this would be another way. Or we just extend the listview at http://jquerymobile.com/test/docs/lists/lists-themes.html under Theming icons to show all icons.

May we wait until @toddparker tell us, what he'd prefer.
I hope, @uGoMobi is not already on way to make a PR with the new-page-solution.

Maurice

[agcolom]

Hi Maurice :-)

Yes, let's wait and see....
best wishes,

Anne

[jaspermdegroot]

Hi Anne and Maurice,

Sounds like a good solution to refer to 'list theming'.
And don't worry... I didn't start anything yet. We all wait and see :-)

Good night Europe!

Jasper

[MauriceG]

good night Netherlands ! :-). see us
Maurice

[toddparker]

Hi all -

Great ideas all around. I think adding a full set of icons to the section on theming will add soem nice emphasis (http://jquerymobile.com/test/docs/lists/lists-themes.html) and adding a link to this from the basics page as @agcolom suggests is also a good idea. Tweaking the language on the 3 buttons on the basics page to say "custom icons" or "16x16 icons" vs. "standard icons" will help distinguish these. I think that's the only place where there would be confusion between these types of icons but if you all see another place where this is confusing, let's use consistent language.