dojox/grid/enhanced/resources/Sorter.css

Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.

/*
.dojoxGrid
    Sorted, SingleSorted | NestSorted
.dojoxGridCell
    Over, SortFocus, ShowIndex
.dojoxGridSortNode
    Asc | Desc, Main|Sub
.dojoxGridSortBtn
    :hover, Single|Nested
*/
.dojoxGrid .dojoxGridSortNode {
	position: relative;
	border: 1px solid transparent;
	cursor: pointer;
}
.dj_ie6 .dojoxGrid .dojoxGridSortNode,
.dj_ie7 .dojoxGrid .dojoxGridSortNode {
	overflow: hidden;
	width:100%;	
}
.dojoxGrid .dojoxGridSortNoWrap {
	white-space:nowrap;
	word-wrap: normal;
}
.dojoxGridSortBtn {
	width: 10px;
	height:100%;
	visibility: hidden;
	top: 0;
	display:block;
	position: absolute;
	color: #000;
	background: #DFEAF1 url(images/sprite_icons.png) no-repeat 100px 0;
	text-decoration: none;
	outline: none;
	right: 0;
	border: 1px solid transparent;
	box-sizing: border-box; /* css3 rec */
	-moz-box-sizing: border-box; /* ff */
	-ms-box-sizing: border-box; /* ie8 */
	-webkit-box-sizing: border-box; /* safari3 */
	-khtml-box-sizing: border-box; /* konqueror */
}
.dj_ie6 .dojoxGridSortBtn,
.dj_ie6 .dojoxGrid .dojoxGridSortNode {
	border: none;
}
.dojoxGridSortBtnNested {
	right: 10px;
}
.dojoxGridCellSortFocus  .dojoxGridSortBtn {
	border-left: 1px solid #999999;
	background-color: #DFEAF1;
}
.dojoxGridCellOver .dojoxGridSortBtn {
	border-left: 1px solid #999999;
	background-color: #9dcfff;
}
.dojoxGridSortNode {
	outline: none;
}

/*Control the title node width*/
.dojoxGridSorted .dojoxGridCellOver .dojoxGridSortNode,
.dojoxGridCellSortFocus .dojoxGridSortNode,
.dojoxGridSingleSorted .dojoxGridHeader .dojoxGridCellOver .dojoxGridSortNodeMain,
.dojoxGridSingleSorted .dojoxGridHeader .dojoxGridCellSortFocus .dojoxGridSortNodeMain {
	margin-right: 5px;
}
.dojoxGridSorted .dojoxGridCellOver .dojoxGridSortNode,
.dojoxGridSorted .dojoxGridCellSortFocus .dojoxGridSortNode {
	margin-right: 24px;
}
/*html > body used for !dj_ie6, TBD - a better way*/
html > body .dojoxGridCellOver .dojoxGridSortNode .dojoxGridSortBtnSingle {
	right: -5px;
}
html > body .dojoxGridCellSortFocus .dojoxGridSortNode .dojoxGridSortBtnSingle,
html > body .dojoxGridSorted .dojoxGridCellOver .dojoxGridSortNodeMain .dojoxGridSortBtnSingle,
html > body .dojoxGridSorted .dojoxGridCellSortFocus .dojoxGridSortNodeMain .dojoxGridSortBtnSingle {
	right: -10px;
}
html > body .dojoxGridSorted .dojoxGridCellOver .dojoxGridSortBtnSingle,
html > body .dojoxGridSorted .dojoxGridCellSortFocus .dojoxGridSortBtnSingle,
html > body .dojoxGridNestSorted .dojoxGridCellOver .dojoxGridSortNodeMain .dojoxGridSortBtnSingle,
html > body .dojoxGridNestSorted .dojoxGridCellSortFocus .dojoxGridSortNodeMain .dojoxGridSortBtnSingle {
	right: -28px;
}
html > body .dojoxGridSorted .dojoxGridCellOver .dojoxGridSortBtnNested,
html > body .dojoxGridSorted .dojoxGridCellSortFocus .dojoxGridSortBtnNested {
	right: -17px;
}

.dojoxGrid .dojoxGridHeader .dojoxGridRowTable .dojoxGridNoSort .dojoxGridSortNode {
	margin: 0!important;
}

.dj_ie7 .dojoxGridSortBtn {
	right: 0!important;
}
.dj_ie7 .dojoxGridSortBtnNested {
	right: 10px!important;
}

/*Focus border*/
/*Control visibility*/
.dojoxGrid .dojoxGridCellOver .dojoxGridSortNode .dojoxGridSortBtnSingle,					/* single sort btn is always visible when mouseover*/
.dojoxGrid .dojoxGridCellSortFocus .dojoxGridSortNode .dojoxGridSortBtnSingle,
.dojoxGridSorted .dojoxGridCellOver .dojoxGridSortNode .dojoxGridSortBtnNested,				/* in a sorted grid, nest btn is always visible when mouseover (except 1)*/
.dojoxGridSorted .dojoxGridCellSortFocus .dojoxGridSortNode .dojoxGridSortBtnNested,
.dojoxGrid .dojoxGridCellShowIndex .dojoxGridSortNode .dojoxGridSortBtnNested,		/* in a single sort grid, when mouseover other columns, show 1 on the main sort column*/
.dojoxGrid .dojoxGridSortNodeSorted .dojoxGridSortBtn {										/* in a sorted column, single or nested sort btn are always visible (except 2)*/
	visibility: visible;
}
.dojoxGridSingleSorted .dojoxGridCellOver .dojoxGridSortNodeMain .dojoxGridSortBtnNested,	/*(1)in a single sorted grid, nest btn is hidden in sort column when mouseover*/
.dojoxGridSingleSorted .dojoxGridCellSortFocus .dojoxGridSortNodeMain .dojoxGridSortBtnNested,
.dojoxGridSingleSorted .dojoxGridSortNode .dojoxGridSortBtnNested {							/*(2)all nested btn is hidden in single sort grid without mouse over*/
	visibility: hidden;
}

/*
-119 asc
-99 desc
-159 do asc
-139 do desc
-179 no sort
*/
/*Control background image*/
.dojoxGridSortNodeAsc .dojoxGridSortBtnSingle {
	background-position: -119px 5px;
	visibility: visible;
}
.dojoxGridSortNodeDesc .dojoxGridSortBtnSingle {
	background-position: -99px  5px;
	visibility: visible;
}
/*hover single sort*/
.dojoxGridCellOver .dojoxGridSortBtnSingle,
.dojoxGridCellSortFocus .dojoxGridSortBtnSingle {
	background-position: -159px 5px;
}
.dojoxGridCellOver .dojoxGridSortNodeAsc .dojoxGridSortBtnSingle,
.dojoxGridCellSortFocus .dojoxGridSortNodeAsc .dojoxGridSortBtnSingle,
.dojoxGrid .dojoxGridCellOver .dojoxGridSortNode .dojoxGridSortBtnAsc,
.dojoxGrid .dojoxGridCellSortFocus .dojoxGridSortNode .dojoxGridSortBtnAsc {
	background-position: -139px 5px;
}
.dojoxGridCellOver .dojoxGridSortNodeDesc .dojoxGridSortBtnSingle, 
.dojoxGridCellSortFocus .dojoxGridSortNodeDesc .dojoxGridSortBtnSingle, 
.dojoxGrid .dojoxGridCellOver .dojoxGridSortNode .dojoxGridSortBtnDesc, 
.dojoxGrid .dojoxGridCellSortFocus .dojoxGridSortNode .dojoxGridSortBtnDesc {
	background-position: -179px 5px;
}
/*hover nested sort*/
.dojoxGridCellOver .dojoxGridSortBtnNested,
.dojoxGridCellSortFocus .dojoxGridSortBtnNested {
	background-position: -149px 5px;
	width: 19px;
}
.dojoxGridCellOver .dojoxGridSortNodeAsc .dojoxGridSortBtnNested,
.dojoxGridCellSortFocus .dojoxGridSortNodeAsc .dojoxGridSortBtnNested {
	background-position: -129px 5px;
}
.dojoxGridCellOver .dojoxGridSortNodeDesc .dojoxGridSortBtnNested,
.dojoxGridCellSortFocus .dojoxGridSortNodeDesc .dojoxGridSortBtnNested {
	background-position: -169px 5px;
}
.dojoxGridNestSorted .dojoxGridCellOver .dojoxGridSortBtnSingle,
.dojoxGridNestSorted .dojoxGridCellSortFocus .dojoxGridSortBtnSingle {
	background-position: -159px 5px;
}
.dojoxGridCellOver .dojoxGridSortBtn:hover {
	background-color:#A3E4FF;  
}
.dojoxGrid .dojoxGridSortNodeFocus,
.dojoxGridCellSortFocus .dojoxGridRowSelector,
.dojoxGridCellSortFocus .dojoxGridSortBtnFocus {
	border: 1px dashed #666;
}