From 799fd6add0d82c203be5484ea92d139f9c2ea35e Mon Sep 17 00:00:00 2001 From: Jacob Thornton Date: Sat, 2 Jul 2011 11:51:05 -0700 Subject: get rid of assets/img in favor of css arrows --- lib/patterns.less | 8 +++++--- lib/tables.less | 44 +++++++++++++++++++++++++++++++++----------- 2 files changed, 38 insertions(+), 14 deletions(-) (limited to 'lib') diff --git a/lib/patterns.less b/lib/patterns.less index 3ce02ea10..a3a949244 100644 --- a/lib/patterns.less +++ b/lib/patterns.less @@ -131,15 +131,17 @@ div.topbar { position: relative; a.menu { &:after { - width: 7px; - height: 7px; + width: 0px; + height: 0px; display: inline-block; - background: transparent url(assets/img/dropdown-arrow.gif) no-repeat top center; content: "↓"; text-indent: -99999px; vertical-align: top; margin-top: 8px; margin-left: 4px; + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-top: 4px solid #fff; .opacity(50); } } diff --git a/lib/tables.less b/lib/tables.less index 5cde1b5ce..7c315ff35 100644 --- a/lib/tables.less +++ b/lib/tables.less @@ -44,32 +44,54 @@ table.zebra-striped { // Tablesorting styles w/ jQuery plugin th.header { // For tablesorter tables, make THs have a pointer on hover cursor: pointer; - padding-right: 20px; + &:after { + width: 0px; + height: 0px; + display: inline-block; + float: right; + margin-top:7px; + content: "↓"; + text-indent: -99999px; + vertical-align: top; + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-bottom: 4px solid #000; + visibility:hidden; + .box-shadow(0 1px 0 #fff); + .opacity(30); + } } th.headerSortUp, th.headerSortDown { // Style the sorted column headers (THs) - background-image: url(assets/img/tablesorter-indicators.png); - background-position: right -23px; - background-repeat: no-repeat; background-color: rgba(141,192,219,.25); text-shadow: 0 1px 1px rgba(255,255,255,.75); .border-radius(3px 3px 0 0); } th.header:hover { // Style the ascending (reverse alphabetical) column header - background-image: url(assets/img/tablesorter-indicators.png); - background-position: right 15px; - background-repeat: no-repeat; + &:after { + visibility:visible; + } } th.actions:hover { background-image: none; } th.headerSortDown, th.headerSortDown:hover { // Style the descending (alphabetical) column header - background-position: right -25px; + &:after { + visibility:visible; + .opacity(60); + } } - th.headerSortUp, - th.headerSortUp:hover { // Style the ascending (reverse alphabetical) column header - background-position: right -65px; + th.headerSortUp { // Style the ascending (reverse alphabetical) column header + &:after { + border-bottom: none; + border-left: 4px solid transparent; + border-right: 4px solid transparent; + border-top: 4px solid #000; + visibility:visible; + .box-shadow(none); //can't add boxshadow to downward facing arrow :( + .opacity(60); + } } // Blue Table Headings th.blue { -- cgit v1.2.3