MINOR: (SSF-106) tidied up the datagrid header styling

silverstripe · Feb 29, 2012 · fea1a93 · fea1a93
1 parent af59228
commit fea1a93
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 9 deletions.
diff --git a/css/GridField.css b/css/GridField.css
diff --git a/scss/GridField.scss b/scss/GridField.scss
@@ -23,6 +23,8 @@ $gf_colour_font: #666;
 $gf_colour_text_shadow: rgba(0,0,0,.3);
 $gf_border_radius:	7px;
 
+$gf_grid_y:	12px;
+$gf_grid_x:	16px;
 
 @mixin box-shadow-none {
 	-moz-box-shadow: none;
@@ -100,20 +102,24 @@ $gf_border_radius:	7px;
 					@include single-text-shadow($gf_colour_text_shadow, 0px, -1px, 0);
 					h2{
 						padding: 0px;
-						font-size: 16px;
+						font-size: $gf_grid_y*1.4;
 						color:#fff;
-						margin:0;
-						display:inline;
+						margin:3px $gf_grid_x/2 0;
+						display:inline-block;
 					}
 					.new{
-						font-size: 14px; 
+						font-size: $gf_grid_y*1.2; 
 						border-color: $gf_colour_border;
 						float: right;
 					}
 				}
 			}	
 			&.sortable-header {
 				background: $gf_colour_subheader;	
+				th{
+					padding: 0px;
+				}
+
 			}			
 			&:hover {
 				background: #FFFAD6 !important;
@@ -134,7 +140,7 @@ $gf_border_radius:	7px;
 
 			th {
 				font-weight: bold;
-				font-size: 12px;
+				font-size: $gf_grid_y;
 				color: #FFF;
 				padding: 5px;
 				border-right: 1px solid $gf_colour_border;
@@ -210,14 +216,20 @@ $gf_border_radius:	7px;
 						@include box-shadow-none; 
 					}
 					&.ss-gridfield-sort {
-						background: transparent url(../images/arrows-01.png) no-repeat right 2px;
+						background: transparent url(../images/arrows.png) no-repeat right 6px;
 						border:none;	
 						width:100%;
 						text-align: left;
 						padding: 4px 0;
 						@include single-text-shadow($gf_colour_text_shadow, 0px, -1px, 0);
 						color: #fff;
 						@include border-radius(0);
+						&:hover {
+							background-position: right -34px;
+						}
+						&.ss-gridfield-sorted {
+							background-position: right -116px;
+						}
 					}		
 				}
 				input {
@@ -226,6 +238,7 @@ $gf_border_radius:	7px;
 						&:focus {
 							@include box-shadow-none;
 						}
+
 					}
 				}
 			}