Allow javascript get some less variables value

Push grid variables into body data for javascript use. Example, get
small screen size value by jQuery ('body').data('screen-sm');

source/plg_system_t3/base-bs3/js/script.js

@@ -13,6 +13,29 @@
 
 !function($){
 
+	// Detect grid-float-breakpoint value and put to $(body) data
+	$(document).ready(function(){
+		var fromClass = 'body-data-holder',
+				prop = 'content',
+				$inspector = $('<div>').css('display', 'none').addClass(fromClass).appendTo($('body'));
+
+    try {
+			var attrs = window.getComputedStyle(
+					$inspector[0], ':before'
+				).getPropertyValue(prop),
+				matches = attrs.match(/([\da-z\-]+)/gi),
+				data = {};
+				if (matches && matches.length) {
+					for (var i=0; i<matches.length; i++) {
+						data[matches[i++]] = i<matches.length ? matches[i] : null;
+					}
+				}
+				$('body').data (data);
+    } finally {
+        $inspector.remove(); // and remove from DOM
+    }
+	});
+
 	//detect transform (https://github.com/cubiq/)
 	(function(){
 		$.support.t3transform = (function () {

source/plg_system_t3/base-bs3/less/t3.less

@@ -117,4 +117,13 @@
     overflow: hidden;
     display: block;
   }  
-}
+}
+
+
+// for interact with javascript
+// ---------------------------------------------------------------------------
+// place holder class to detect the grid variables value in javascript
+.body-data-holder:before {
+	display: none;
+	content: "grid-float-breakpoint:@{grid-float-breakpoint} screen-xs:@{screen-xs} screen-sm:@{screen-sm} screen-md:@{screen-md} screen-lg:@{screen-lg}";
+}	

source/plg_system_t3/base/js/script.js

@@ -13,6 +13,30 @@
 
 !function($){
 
+	// Detect grid-float-breakpoint value and put to $(body) data
+	$(document).ready(function(){
+		var fromClass = 'body-data-holder',
+				prop = 'content',
+				$inspector = $('<div>').css('display', 'none').addClass(fromClass).appendTo($('body'));
+
+    try {
+			var attrs = window.getComputedStyle(
+					$inspector[0], ':before'
+				).getPropertyValue(prop),
+				matches = attrs.match(/([\da-z\-]+)/gi),
+				data = {};
+				if (matches && matches.length) {
+					for (var i=0; i<matches.length; i++) {
+						data[matches[i++]] = i<matches.length ? matches[i] : null;
+					}
+				}
+				$('body').data (data);
+    } finally {
+        $inspector.remove(); // and remove from DOM
+    }
+	});
+
+
 	//detect transform (https://github.com/cubiq/)
 	$.support.t3transform = (function () {
 		var style = document.createElement('div').style,

source/plg_system_t3/base/less/t3.less

@@ -47,4 +47,13 @@
       display: block;
     }
   }
+}
+
+
+// for interact with javascript
+// ---------------------------------------------------------------------------
+// place holder class to detect the grid variables value in javascript
+.body-data-holder:before {
+	display: none;
+	content: "grid-float-breakpoint:@{navbarCollapseWidth} screen-xs:600px screen-sm:@{gridRowWidth768} screen-md:@{gridRowWidth} screen-lg:@{gridRowWidth1200}";
 }