The tablesort indicator in views tables have incorrect class and wrap to the next line. It seems not themed properly and get's incorrect classes added to all images where it should not and therefore cause visual malfunctions.

Broken:

After bootstrap img-responsive class is removed, it will positioned where it should be, but does not inherit the color of the label. Something that could work if we use _bootstrap_icon().

Original (non-bootstrap):

Fixed version:

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

hass created an issue. See original summary.

hass’s picture

I have added theme_tablesort_indicator() to the theme. But for unknown reasons the html code returned is only shown in default sort order after a drupal cache clear.

There seems to be another bug and I have not found the source yet why the sort indicator disapears after resorting. Very strange behaviour.

It works without the theme override.

devshi.addweb’s picture

FileSize
1.36 KB
1.34 KB

Please put below code in your custom css file.

  table th img {
    display: inline-block !important;
    margin: 0 2px;
  }

PFA screenshots for your help.

hass’s picture

Status: Active » Needs review
FileSize
1.31 KB

This is one workaround.

But I think we should override the sort icon. Not sure what icon we should use or if we use the dropdown/dropup from the navbar. Not sure what the maintainer prefers. Additionally the root cause of the disapearing icon need to be found.

hass’s picture

That is the better one, but it does work only once after a cache clear and is no longer shown if you re-sort.

hass’s picture

FileSize
616 bytes

Missed to add a screenshot of the fixed version

hass’s picture

I don't know why, but I cannot repro the disapearing caret again. Last patch #5 works well.

hass’s picture

Issue summary: View changes
hass’s picture

hass’s picture

Strings should be ucfirst.

markhalliwell’s picture

Version: 7.x-3.x-dev » 8.x-3.x-dev
Category: Bug report » Feature request
Status: Needs review » Needs work
Issue tags: +needs backport to 7.x-3.x
  1. Fix HEAD first.
  2. Use an appropriate glyphicon instead of abusing dropup/dropdown just to get the caret to "appear" correctly.
hass’s picture

I have not found any useful glyphicon. Please suggest one that works for names, numbers, money, dates, etc.

markhalliwell’s picture

hass’s picture

There are several issues with _bootstrap_icon():

  1. The icon has an incorrect size compared to the text.
  2. The vertical alignment of icon is not correct (same in the new calendar navigation).
  3. _bootstrap_icon() does not allow us to set a title as we cannot inject anything to $attributes.
  4. No space between the word and the icon. We cannot add icon-after to the header link (a.icon-after .glyphicon) easily. tablesort_header() is not a theme function.

How should this solved?

markhalliwell’s picture

There are several issues with _bootstrap_icon():

  1. No it doesn't.
  2. Yes it is.
  3. For now, just wrap the icon (like you previously did) and add it there)... then open an issue asking to add an optional $attributes parameter to Bootstrap::glyphicon as a follow up... instead of just complaining about it.
  4. With custom CSS, like the existing .icon-after, but targeting table header cells and any icons inside them.
markhalliwell’s picture

Title: Tablesort indicator has incorrect classes / wraps line » Add tablesort_indicator template to utilize glyphicons
markhalliwell’s picture

Version: 8.x-3.x-dev » 7.x-3.x-dev
Status: Needs work » Patch (to be ported)
Issue tags: -needs backport to 7.x-3.x
FileSize
4.34 KB

.

markhalliwell’s picture

Status: Patch (to be ported) » Fixed
FileSize
3.43 KB

.

  • markcarver committed 3239640 on 8.x-3.x
    Automated commit: grunt compile (CSS)
    
    Issue #2840304 by markcarver,...
  • markcarver committed 56a8a3f on 8.x-3.x
    Issue #2840304 by markcarver, hass: Add tablesort_indicator
    
    Signed-off-...

  • markcarver committed 0e3cc66 on 7.x-3.x
    Issue #2840304 by markcarver, hass: Add tablesort_indicator
    
    Signed-off-...
  • markcarver committed a64c82b on 7.x-3.x
    Automated commit: grunt compile (CSS)
    
    Issue #2840304 by markcarver,...

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.