CC-5749 : Datatables ColVis CSS upgrade

airtime_mvc/public/css/datatables/css/ColReorder.css

@@ -1,14 +0,0 @@
-/*
- * Namespace DTCR - "DataTables ColReorder" plug-in
- */
-
-table.DTCR_clonedTable {
-	background-color: white;
-	z-index: 998;
-}
-
-div.DTCR_pointer {
-	width: 1px;
-	background-color: #5B5B5B;
-	z-index: 997;
-}

airtime_mvc/public/css/datatables/css/ColVis.css

@@ -1,75 +0,0 @@
-
-/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
- * ColVis styles
- */
-.ColVis {
-	float: right;
-	margin-bottom: 1em;
-}
-
-.ColVis_Button {
-	position: relative;
-	float: left;
-	margin-right: 3px;
-	padding: 3px 5px;
-	height: 30px;
-	background-color: #fff;
-	border: 1px solid #d0d0d0;
-	cursor: pointer;
-}
-
-button.ColVis_Button::-moz-focus-inner { 
-	border: none !important;
-	padding: 0;
-}
-
-.ColVis_text_hover {
-	border: 1px solid #999;
-	background-color: #f0f0f0;
-}
-
-div.ColVis_collectionBackground {
-	background-color: black;
-	z-index: 1003;
-}
-
-div.ColVis_collection {
-	position: relative;
-	width: 130px;
-	background-color: #999;
-	padding: 3px;
-	border: 1px solid #ccc;
-	z-index: 1005;
-}
-
-div.ColVis_collection button.ColVis_Button {
-	background-color: white;
-	width: 100%;
-	float: none;
-	margin-bottom: 2px;
-}
-
-div.ColVis_catcher {
-	position: absolute;
-	z-index: 1004;
-}
-
-.disabled {
-	color: #999;
-}
-
-
-
-button.ColVis_Button {
-	text-align: left;
-}
-
-div.ColVis_collection button.ColVis_Button:hover {
-	border: 1px solid #999;
-	background-color: #f0f0f0;
-}
-
-span.ColVis_radio {
-	display: inline-block;
-	width: 20px;
-}

airtime_mvc/public/css/datatables/css/dataTables.colVis.css

@@ -7,44 +7,9 @@ div.ColVis {
 	margin-bottom: 1em;
 }
 
-button.ColVis_Button,
-ul.ColVis_collection li {
-	position: relative;
-	float: left;
-	margin-right: 3px;
-	padding: 5px 8px;
-	border: 1px solid #999;
-	cursor: pointer;
-	*cursor: hand;
-	font-size: 0.88em;
-	color: black !important;
-	white-space: nowrap;
-
-	-webkit-border-radius: 2px;
-	   -moz-border-radius: 2px;
-	    -ms-border-radius: 2px;
-	     -o-border-radius: 2px;
-	        border-radius: 2px;
-
-	-webkit-box-shadow: 1px 1px 3px #ccc;
-	   -moz-box-shadow: 1px 1px 3px #ccc;
-	    -ms-box-shadow: 1px 1px 3px #ccc;
-	     -o-box-shadow: 1px 1px 3px #ccc;
-	        box-shadow: 1px 1px 3px #ccc;
-
-	/* Generated by http://www.colorzilla.com/gradient-editor/ */
-	background: #ffffff; /* Old browsers */
-	background: -webkit-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* Chrome10+,Safari5.1+ */
-	background:    -moz-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* FF3.6+ */
-	background:     -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* IE10+ */
-	background:      -o-linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* Opera 11.10+ */
-	background:         linear-gradient(top, #ffffff 0%,#f3f3f3 89%,#f9f9f9 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */
-}
-
 .ColVis_Button:hover,
 ul.ColVis_collection li:hover {
-	border: 1px solid #666;
+	border: 1px solid white;
 	text-decoration: none !important;
 
 	-webkit-box-shadow: 1px 1px 3px #999;
@@ -53,13 +18,9 @@ ul.ColVis_collection li:hover {
 	     -o-box-shadow: 1px 1px 3px #999;
 	        box-shadow: 1px 1px 3px #999;
 
-	background: #f3f3f3; /* Old browsers */
+	background-color: #3C3C3C; 
-	background: -webkit-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* Chrome10+,Safari5.1+ */
+	background: -moz-linear-gradient(top, #7E7E7E 0, #5A5A5A 100%); 
-	background:    -moz-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* FF3.6+ */
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #7E7E7E), color-stop(100%, #5A5A5A));
-	background:     -ms-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* IE10+ */
-	background:      -o-linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* Opera 11.10+ */
-	background:         linear-gradient(top, #f3f3f3 0%,#e2e2e2 89%,#f4f4f4 100%); /* W3C */
-	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3f3f3', endColorstr='#f4f4f4',GradientType=0 ); /* IE6-9 */
 }
 
 button.ColVis_Button {
@@ -89,12 +50,10 @@ div.ColVis_collectionBackground {
 
 ul.ColVis_collection {
 	width: 150px;
-	padding: 8px 8px 4px 8px;
+	padding: 8px 9px 4px 7px;
 	margin: 0;
-	border: 1px solid #ccc;
 	border: 1px solid rgba( 0, 0, 0, 0.4 );
-	background-color: #f3f3f3;
+	background-color: #999;
-	background-color: rgba( 255, 255, 255, 0.3 );
 	overflow: hidden;
 	z-index: 2002;
 
@@ -122,17 +81,26 @@ ul.ColVis_collection li {
 	float: none;
 	margin-bottom: 4px;
 	
-	-webkit-box-shadow: 1px 1px 3px #999;
+	-webkit-box-shadow: none;
-	   -moz-box-shadow: 1px 1px 3px #999;
+	   -moz-box-shadow: none;
-	    -ms-box-shadow: 1px 1px 3px #999;
+	    -ms-box-shadow: none;
-	     -o-box-shadow: 1px 1px 3px #999;
+	     -o-box-shadow: none;
-	        box-shadow: 1px 1px 3px #999;
+	        box-shadow: none;
+	        
+	background-color: #6e6e6e; 
+	background: -moz-linear-gradient(top, #868686 0, #6e6e6e 100%); 
+	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #868686), color-stop(100%, #6e6e6e)); 
+	border: 1px solid #d0d0d0;
 }
 
 ul.ColVis_collection li {
 	text-align: left;
 }
 
+ul.ColVis_collection li label { 
+	color: #fff; 
+}
+
 ul.ColVis_collection li.ColVis_Button:hover {
 	border: 1px solid #999;
 	background-color: #f0f0f0;

airtime_mvc/public/js/datatables/plugin/AIRTIME_DEV_README_COL_VIS

@@ -3,31 +3,19 @@ in this file.
 
 The following function has been modified:
 
-_fnDomBaseButton
+_fnConstruct
 
-The new _fnDomBaseButton looks like this:
+this.dom.button has been changed like this:
 
-    "_fnDomBaseButton": function ( text )
+    this.dom.button = $( '<button />', {
-    {
+        'class': !this.s.dt.bJUI ?
-        var
+            "ColVis_Button ColVis_MasterButton" :
-            that = this,
+            "btn-toolbar btn btn-small dropdown-toggle ColVis_MasterButton"
-            nButton = document.createElement('button'),
+    } )
-            nSpan = document.createElement('span'),
+    .append( '<span>'+this.s.buttonText+'</span><span class="caret"></span>' )
-            sEvent = this.s.activate=="mouseover" ? "mouseover" : "click";
+    .bind( this.s.activate=="mouseover" ? "mouseover" : "click", function (e) {
-        
+        e.preventDefault();
-        //nButton.className = !this.s.dt.bJUI ? "ColVis_Button TableTools_Button" :
+        that._fnCollectionShow();
-            //"ColVis_Button TableTools_Button ui-button ui-state-default";
+    } )
-        nButton.className = "btn-toolbar btn btn-small dropdown-toggle ColVis_MasterButton";
+    .appendTo( this.dom.wrapper )[0];
-        
-        nButton.appendChild( nSpan );
-        $(nButton).append("<span class='caret'></span>");
-        nSpan.innerHTML = text;
-        
-        $(nButton).bind( 'click', function (e) {
-            that._fnCollectionShow();
-            e.preventDefault();
-        } );
-        
-        return nButton;
-    },
     

airtime_mvc/public/js/datatables/plugin/dataTables.ColVis.js

@@ -253,9 +253,9 @@ ColVis.prototype = {
 		this.dom.button = $( '<button />', {
 				'class': !this.s.dt.bJUI ?
 					"ColVis_Button ColVis_MasterButton" :
-					"ColVis_Button ColVis_MasterButton ui-button ui-state-default"
+					"btn-toolbar btn btn-small dropdown-toggle ColVis_MasterButton"
 			} )
-			.append( '<span>'+this.s.buttonText+'</span>' )
+			.append( '<span>'+this.s.buttonText+'</span><span class="caret"></span>' )
 			.bind( this.s.activate=="mouseover" ? "mouseover" : "click", function (e) {
 				e.preventDefault();
 				that._fnCollectionShow();