Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

Listview: Added a class to set border-bottom on the last LI. This fix…

…es missing border on filtered lists and on browsers that don't support :last-child. Fixes #4614 - Items filtered from listview missing a border.
  • Loading branch information...
commit 22ef7fb27f32a9c2fc0d84c7d0c86e0a00496737 1 parent 73e1e97
Jasper de Groot jaspermdegroot authored
Showing with 11 additions and 6 deletions.
  1. +1 −1  css/structure/jquery.mobile.listview.css
  2. +10 −5 js/widgets/listview.js
2  css/structure/jquery.mobile.listview.css
View
@@ -10,7 +10,7 @@ ol.ui-listview, ol.ui-listview .ui-li-divider { counter-reset: listnumbering; }
ol.ui-listview .ui-link-inherit:before, ol.ui-listview .ui-li-static:before, .ui-li-dec { font-size: .8em; display: inline-block; padding-right: .3em; font-weight: normal; counter-increment: listnumbering; content: counter(listnumbering) ". "; }
ol.ui-listview .ui-li-jsnumbering:before { content: "" !important; } /* to avoid chance of duplication */
.ui-listview-inset .ui-li { border-right-width: 1px; border-left-width: 1px; }
-.ui-li:last-child, .ui-li.ui-field-contain:last-child { border-bottom-width: 1px; }
+.ui-li-last, .ui-li.ui-field-contain.ui-li-last { border-bottom-width: 1px; }
.ui-li>.ui-btn-inner { display: block; position: relative; padding: 0; }
.ui-li .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li { padding: .7em 15px; display: block; }
.ui-li-has-thumb .ui-btn-inner a.ui-link-inherit, .ui-li-static.ui-li-has-thumb { min-height: 60px; padding-left: 100px; }
15 js/widgets/listview.js
View
@@ -62,11 +62,14 @@ $.widget( "mobile.listview", $.mobile.widget, {
$topli,
$bottomli;
- if ( this.options.inset ) {
- $li = this.element.children( "li" );
- // at create time the li are not visible yet so we need to rely on .ui-screen-hidden
- $visibleli = create ? $li.not( ".ui-screen-hidden" ) : $li.filter( ":visible" );
+ $li = this.element.children( "li" );
+ // at create time the li are not visible yet so we need to rely on .ui-screen-hidden
+ $visibleli = create ? $li.not( ".ui-screen-hidden" ) : $li.filter( ":visible" );
+ // ui-li-last is used for setting border-bottom on the last li
+ $li.find( ".ui-li-last" ).removeClass( "ui-li-last" );
+
+ if ( this.options.inset ) {
this._removeCorners( $li );
// Select the first visible li element
@@ -86,7 +89,7 @@ $.widget( "mobile.listview", $.mobile.widget, {
// Select the last visible li element
$bottomli = $visibleli.last()
- .addClass( "ui-corner-bottom" );
+ .addClass( "ui-corner-bottom ui-li-last" );
$bottomli.add( $bottomli.find( ".ui-btn-inner" ) )
.find( ".ui-li-link-alt" )
@@ -95,6 +98,8 @@ $.widget( "mobile.listview", $.mobile.widget, {
.find( ".ui-li-thumb" )
.not( ".ui-li-icon" )
.addClass( "ui-corner-bl" );
+ } else {
+ $visibleli.last().addClass( "ui-li-last" );
}
if ( !create ) {
this.element.trigger( "updatelayout" );
Please sign in to comment.
Something went wrong with that request. Please try again.