3.2.0

Make a "sortable".png for headers

By default there is no "up" & "down" arrow to help end users know columns are sortable off-hand. If I created a sort.png file using the grid.png arrows which style would I apply the background:url ?
Joseph
July 9,
If I understand correctly you want to assign some image to the non-sorted state. You can use .aw-sort-none class, but you should also restore the display:inline-block rule, because normally .aw-sort-none has display:none value -

.aw-grid-control .aw-header-0 .aw-grid-sort {
    display: inline-block;
}

.aw-gecko .aw-header-0 .aw-grid-sort {
    display: -moz-inline-box;
}

.aw-sort-none .aw-grid-sort {
    background: url(???.png);
}

.aw-sort-ascending .aw-grid-sort {
    background: url(up.png);
}

.aw-sort-descending .aw-grid-sort {
    background: url(down.png);
}
Alex (ActiveWidgets)
July 10,
Alex,

Thank You for your direction! What I did was open grid.png containing the up/down arrows and saved a version with just the both arrows together. One minor tweak was to the:

.aw-gecko .aw-header-0 .aw-grid-sort {
display: -moz-inline-box;
width:18px;
}

Needed to increase width of the display box to contain the with of the new image.
Thanks again.
Joseph
July 10,

This topic is archived.

See also:


Back to support forum