Commit 1ebac75ad28318779a42627363770f04a49b3346

Golmote 2015-09-30T08:54:44

Plugin: gradient previewer

diff --git a/components.js b/components.js
index 39e5bdc..d9526ed 100644
--- a/components.js
+++ b/components.js
@@ -519,6 +519,11 @@ var components = {
 			"require": "previewer-base",
 			"owner": "Golmote"
 		},
+		"previewer-gradient": {
+			"title": "Previewer: Gradient",
+			"require": "previewer-base",
+			"owner": "Golmote"
+		},
 		"previewer-easing": {
 			"title": "Previewer: Easing",
 			"require": "previewer-base",
diff --git a/plugins/previewer-base/prism-previewer-base.js b/plugins/previewer-base/prism-previewer-base.js
index 570739f..a735205 100644
--- a/plugins/previewer-base/prism-previewer-base.js
+++ b/plugins/previewer-base/prism-previewer-base.js
@@ -95,11 +95,15 @@
 	 * @param token
 	 */
 	Previewer.prototype.check = function (token) {
-		if (tokenRegexp.test(token.className) && this._clsRegexp.test(token.className)) {
-			if (token !== this._token) {
-				this._token = token;
-				this.show();
+		do {
+			if (tokenRegexp.test(token.className) && this._clsRegexp.test(token.className)) {
+				break;
 			}
+		} while(token = token.parentNode);
+
+		if (token && token !== this._token) {
+			this._token = token;
+			this.show();
 		}
 	};
 
diff --git a/plugins/previewer-base/prism-previewer-base.min.js b/plugins/previewer-base/prism-previewer-base.min.js
index 82bdc18..830a5a3 100644
--- a/plugins/previewer-base/prism-previewer-base.min.js
+++ b/plugins/previewer-base/prism-previewer-base.min.js
@@ -1 +1 @@
-!function(){if("undefined"!=typeof self&&self.Prism&&self.document){var t=function(t){var e=0,s=0,i=t;if(i.parentNode){do e+=i.offsetLeft,s+=i.offsetTop;while((i=i.offsetParent)&&i.nodeType<9);i=t;do e-=i.scrollLeft,s-=i.scrollTop;while((i=i.parentNode)&&!/body/i.test(i.nodeName))}return{top:s,right:innerWidth-e-t.offsetWidth,bottom:innerHeight-s-t.offsetHeight,left:e}},e=/(?:^|\s)token(?=$|\s)/,s=/(?:^|\s)active(?=$|\s)/g,i=/(?:^|\s)flipped(?=$|\s)/g,o=function(t,e,s,i){this._elt=null,this._type=t,this._clsRegexp=RegExp("(?:^|\\s)"+t+"(?=$|\\s)"),this._token=null,this.updater=e,this._mouseout=this.mouseout.bind(this),this.initializer=i;var n=this;s||(s=["*"]),"Array"!==Prism.util.type(s)&&(s=[s]),s.forEach(function(t){"string"!=typeof t&&(t=t.lang),o.byLanguages[t]||(o.byLanguages[t]=[]),o.byLanguages[t].indexOf(n)<0&&o.byLanguages[t].push(n)})};o.prototype.init=function(){this._elt||(this._elt=document.createElement("div"),this._elt.className="prism-previewer prism-previewer-"+this._type,document.body.appendChild(this._elt),this.initializer&&this.initializer())},o.prototype.check=function(t){e.test(t.className)&&this._clsRegexp.test(t.className)&&t!==this._token&&(this._token=t,this.show())},o.prototype.mouseout=function(){this._token.removeEventListener("mouseout",this._mouseout,!1),this._token=null,this.hide()},o.prototype.show=function(){if(this._elt||this.init(),this._token)if(this.updater.call(this._elt,this._token.textContent)){this._token.addEventListener("mouseout",this._mouseout,!1);var e=t(this._token);this._elt.className+=" active",e.top-this._elt.offsetHeight>0?(this._elt.className=this._elt.className.replace(i,""),this._elt.style.top=e.top+"px",this._elt.style.bottom=""):(this._elt.className+=" flipped",this._elt.style.bottom=e.bottom+"px",this._elt.style.top=""),this._elt.style.left=e.left+Math.min(200,this._token.offsetWidth/2)+"px"}else this.hide()},o.prototype.hide=function(){this._elt.className=this._elt.className.replace(s,"")},o.byLanguages={},o.initEvents=function(t,e){var s=[];o.byLanguages[e]&&(s=s.concat(o.byLanguages[e])),o.byLanguages["*"]&&(s=s.concat(o.byLanguages["*"])),t.addEventListener("mouseover",function(t){var e=t.target;s.forEach(function(t){t.check(e)})},!1)},Prism.plugins.Previewer=o,Prism.hooks.add("after-highlight",function(t){(o.byLanguages["*"]||o.byLanguages[t.language])&&o.initEvents(t.element,t.language)})}}();
\ No newline at end of file
+!function(){if("undefined"!=typeof self&&self.Prism&&self.document){var t=function(t){var e=0,s=0,i=t;if(i.parentNode){do e+=i.offsetLeft,s+=i.offsetTop;while((i=i.offsetParent)&&i.nodeType<9);i=t;do e-=i.scrollLeft,s-=i.scrollTop;while((i=i.parentNode)&&!/body/i.test(i.nodeName))}return{top:s,right:innerWidth-e-t.offsetWidth,bottom:innerHeight-s-t.offsetHeight,left:e}},e=/(?:^|\s)token(?=$|\s)/,s=/(?:^|\s)active(?=$|\s)/g,i=/(?:^|\s)flipped(?=$|\s)/g,o=function(t,e,s,i){this._elt=null,this._type=t,this._clsRegexp=RegExp("(?:^|\\s)"+t+"(?=$|\\s)"),this._token=null,this.updater=e,this._mouseout=this.mouseout.bind(this),this.initializer=i;var n=this;s||(s=["*"]),"Array"!==Prism.util.type(s)&&(s=[s]),s.forEach(function(t){"string"!=typeof t&&(t=t.lang),o.byLanguages[t]||(o.byLanguages[t]=[]),o.byLanguages[t].indexOf(n)<0&&o.byLanguages[t].push(n)})};o.prototype.init=function(){this._elt||(this._elt=document.createElement("div"),this._elt.className="prism-previewer prism-previewer-"+this._type,document.body.appendChild(this._elt),this.initializer&&this.initializer())},o.prototype.check=function(t){do if(e.test(t.className)&&this._clsRegexp.test(t.className))break;while(t=t.parentNode);t&&t!==this._token&&(this._token=t,this.show())},o.prototype.mouseout=function(){this._token.removeEventListener("mouseout",this._mouseout,!1),this._token=null,this.hide()},o.prototype.show=function(){if(this._elt||this.init(),this._token)if(this.updater.call(this._elt,this._token.textContent)){this._token.addEventListener("mouseout",this._mouseout,!1);var e=t(this._token);this._elt.className+=" active",e.top-this._elt.offsetHeight>0?(this._elt.className=this._elt.className.replace(i,""),this._elt.style.top=e.top+"px",this._elt.style.bottom=""):(this._elt.className+=" flipped",this._elt.style.bottom=e.bottom+"px",this._elt.style.top=""),this._elt.style.left=e.left+Math.min(200,this._token.offsetWidth/2)+"px"}else this.hide()},o.prototype.hide=function(){this._elt.className=this._elt.className.replace(s,"")},o.byLanguages={},o.initEvents=function(t,e){var s=[];o.byLanguages[e]&&(s=s.concat(o.byLanguages[e])),o.byLanguages["*"]&&(s=s.concat(o.byLanguages["*"])),t.addEventListener("mouseover",function(t){var e=t.target;s.forEach(function(t){t.check(e)})},!1)},Prism.plugins.Previewer=o,Prism.hooks.add("after-highlight",function(t){(o.byLanguages["*"]||o.byLanguages[t.language])&&o.initEvents(t.element,t.language)})}}();
\ No newline at end of file
diff --git a/plugins/previewer-gradient/index.html b/plugins/previewer-gradient/index.html
new file mode 100644
index 0000000..e783ca8
--- /dev/null
+++ b/plugins/previewer-gradient/index.html
@@ -0,0 +1,90 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+
+	<meta charset="utf-8" />
+	<link rel="shortcut icon" href="favicon.png" />
+	<title>Previewer: Gradient ▲ Prism plugins</title>
+	<base href="../.." />
+	<link rel="stylesheet" href="style.css" />
+	<link rel="stylesheet" href="themes/prism.css" data-noprefix />
+	<link rel="stylesheet" href="plugins/previewer-base/prism-previewer-base.css" data-noprefix />
+	<link rel="stylesheet" href="plugins/previewer-gradient/prism-previewer-gradient.css" data-noprefix />
+	<script src="prefixfree.min.js"></script>
+
+	<script>var _gaq = [['_setAccount', 'UA-33746269-1'], ['_trackPageview']];</script>
+	<script src="http://www.google-analytics.com/ga.js" async></script>
+</head>
+<body>
+
+<header>
+	<div class="intro" data-src="templates/header-plugins.html" data-type="text/html"></div>
+
+	<h2>Previewer: Gradient</h2>
+	<p>Previewer for CSS gradients.</p>
+</header>
+
+<section class="language-markup">
+	<h1>How to use</h1>
+
+	<p>You don't need to do anything. With this plugin loaded, a previewer will appear on hovering the gradient values in code blocks.</p>
+	<p>Vendor-prefixed gradients are converted to W3C-valid ones, except the old Webkit syntax (<code class="language-css">-webkit-gradient(linear, ...)</code> and <code class="language-css">-webkit-gradient(radial, ...)</code>) is not supported.</p>
+	<p>This plugin is compatible with CSS, Less, Sass, Scss and Stylus.</p>
+</section>
+
+<section>
+	<h1>Examples</h1>
+
+	<h2>CSS</h2>
+	<pre class="language-css"><code>div {
+	background: -moz-linear-gradient(left,  #cb60b3 0%, #c146a1 50%, #a80077 51%, #db36a4 100%); /* FF3.6+ */
+	background: -webkit-linear-gradient(left,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(left,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(left,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%); /* IE10+ */
+	background: linear-gradient(to right,  #cb60b3 0%,#c146a1 50%,#a80077 51%,#db36a4 100%); /* W3C */
+}</code></pre>
+
+	<h2>Less</h2>
+	<pre class="language-less"><code>#header a {
+	background: -moz-linear-gradient(-45deg,  #9dd53a 0%, #a1d54f 50%, #80c217 51%, #7cbc0a 100%); /* FF3.6+ */
+	background: -webkit-linear-gradient(-45deg,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* Chrome10+,Safari5.1+ */
+	background: -o-linear-gradient(-45deg,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* Opera 11.10+ */
+	background: -ms-linear-gradient(-45deg,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* IE10+ */
+	background: linear-gradient(135deg,  #9dd53a 0%,#a1d54f 50%,#80c217 51%,#7cbc0a 100%); /* W3C */
+}</code></pre>
+
+	<h2>Sass</h2>
+	<pre class="language-sass"><code>@mixin foobar
+	background: -moz-radial-gradient(center, ellipse cover,  #f2f6f8 0%, #d8e1e7 50%, #b5c6d0 51%, #e0eff9 100%)
+	background: radial-gradient(ellipse at center,  #f2f6f8 0%,#d8e1e7 50%,#b5c6d0 51%,#e0eff9 100%)
+</code></pre>
+
+	<h2>Scss</h2>
+	<pre class="language-scss"><code>$attr: background;
+.foo {
+    #{$attr}-image: repeating-linear-gradient(10deg, rgba(255,0,0,0), rgba(255,0,0,1) 10px, rgba(255,0,0,0) 20px);
+}</code></pre>
+
+	<h2>Stylus</h2>
+	<pre class="language-stylus"><code>.foo
+	background-image: repeating-radial-gradient(circle, rgba(255,0,0,0), rgba(255,0,0,1) 10px, rgba(255,0,0,0) 20px)
+</code></pre>
+
+</section>
+
+<footer data-src="templates/footer.html" data-type="text/html"></footer>
+
+<script src="prism.js"></script>
+<script src="components/prism-less.js"></script>
+<script src="components/prism-sass.js"></script>
+<script src="components/prism-scss.js"></script>
+<script src="components/prism-stylus.js"></script>
+<script src="plugins/previewer-base/prism-previewer-base.js"></script>
+<script src="plugins/previewer-gradient/prism-previewer-gradient.js"></script>
+<script src="utopia.js"></script>
+<script src="components.js"></script>
+<script src="code.js"></script>
+
+
+</body>
+</html>
\ No newline at end of file
diff --git a/plugins/previewer-gradient/prism-previewer-gradient.css b/plugins/previewer-gradient/prism-previewer-gradient.css
new file mode 100644
index 0000000..6152a6e
--- /dev/null
+++ b/plugins/previewer-gradient/prism-previewer-gradient.css
@@ -0,0 +1,27 @@
+.prism-previewer-gradient {
+	background-image: linear-gradient(45deg, #bbb 25%, transparent 25%, transparent 75%, #bbb 75%, #bbb), linear-gradient(45deg, #bbb 25%, #eee 25%, #eee 75%, #bbb 75%, #bbb);
+	background-size: 10px 10px;
+	background-position: 0 0, 5px 5px;
+
+	width: 64px;
+	margin-left: -32px;
+}
+.prism-previewer-gradient:before {
+	content: none;
+}
+.prism-previewer-gradient div {
+	position: absolute;
+	top: -5px;
+	left: -5px;
+	right: -5px;
+	bottom: -5px;
+	-webkit-border-radius: 10px;
+	-moz-border-radius: 10px;
+	border-radius: 10px;
+	border: 5px solid #fff;
+	-webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.5) inset, 0 0 10px rgba(0, 0, 0, 0.75);
+	-moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.5) inset, 0 0 10px rgba(0, 0, 0, 0.75);
+	-ms-box-shadow: 0 0 3px rgba(0, 0, 0, 0.5) inset, 0 0 10px rgba(0, 0, 0, 0.75);
+	-o-box-shadow: 0 0 3px rgba(0, 0, 0, 0.5) inset, 0 0 10px rgba(0, 0, 0, 0.75);
+	box-shadow: 0 0 3px rgba(0, 0, 0, 0.5) inset, 0 0 10px rgba(0, 0, 0, 0.75);
+}
\ No newline at end of file
diff --git a/plugins/previewer-gradient/prism-previewer-gradient.js b/plugins/previewer-gradient/prism-previewer-gradient.js
new file mode 100644
index 0000000..089ebc7
--- /dev/null
+++ b/plugins/previewer-gradient/prism-previewer-gradient.js
@@ -0,0 +1,205 @@
+(function() {
+
+	if (
+		typeof self !== 'undefined' && !self.Prism ||
+		typeof global !== 'undefined' && !global.Prism
+	) {
+		return;
+	}
+
+	var languages = {
+		'css': true,
+		'less': true,
+		'sass': {
+			lang: 'sass',
+			before: 'punctuation',
+			inside: 'inside',
+			root: Prism.languages.sass && Prism.languages.sass['property-line']
+		},
+		'scss': true,
+		'stylus': [
+			{
+				lang: 'stylus',
+				before: 'func',
+				inside: 'rest',
+				root: Prism.languages.stylus && Prism.languages.stylus['property-declaration'].inside
+			},
+			{
+				lang: 'stylus',
+				before: 'hexcode',
+				inside: 'rest',
+				root: Prism.languages.stylus && Prism.languages.stylus['variable-declaration'].inside
+			}
+		]
+	};
+
+	// Stores already processed gradients so that we don't
+	// make the conversion every time the previewer is shown
+	var cache = {};
+
+	/**
+	 * Returns a W3C-valid linear gradient
+	 * @param {string} prefix Vendor prefix if any ("-moz-", "-webkit-", etc.)
+	 * @param {string} func Gradient function name ("linear-gradient")
+	 * @param {string[]} values Array of the gradient function parameters (["0deg", "red 0%", "blue 100%"])
+	 */
+	var convertToW3CLinearGradient = function(prefix, func, values) {
+		// Default value for angle
+		var angle = '180deg';
+
+		if (/^(?:-?\d*\.?\d+(?:deg|rad)|to\b|top|right|bottom|left)/.test(values[0])) {
+			angle = values.shift();
+			if (angle.indexOf('to ') < 0) {
+				// Angle uses old keywords
+				// W3C syntax uses "to" + opposite keywords
+				if (angle.indexOf('top') >= 0) {
+					if (angle.indexOf('left') >= 0) {
+						angle = 'to bottom right';
+					} else if (angle.indexOf('right') >= 0) {
+						angle = 'to bottom left';
+					} else {
+						angle = 'to bottom';
+					}
+				} else if (angle.indexOf('bottom') >= 0) {
+					if (angle.indexOf('left') >= 0) {
+						angle = 'to top right';
+					} else if (angle.indexOf('right') >= 0) {
+						angle = 'to top left';
+					} else {
+						angle = 'to top';
+					}
+				} else if (angle.indexOf('left') >= 0) {
+					angle = 'to right';
+				} else if (angle.indexOf('right') >= 0) {
+					angle = 'to left';
+				} else if (prefix) {
+					// Angle is shifted by 90deg in prefixed gradients
+					if (angle.indexOf('deg') >= 0) {
+						angle = (90 - parseFloat(angle)) + 'deg';
+					} else if (angle.indexOf('rad') >= 0) {
+						angle = (Math.PI / 2 - parseFloat(angle)) + 'rad';
+					}
+				}
+			}
+		}
+
+		return func + '(' + angle + ',' + values.join(',') + ')';
+	};
+
+	/**
+	 * Returns a W3C-valid radial gradient
+	 * @param {string} prefix Vendor prefix if any ("-moz-", "-webkit-", etc.)
+	 * @param {string} func Gradient function name ("linear-gradient")
+	 * @param {string[]} values Array of the gradient function parameters (["0deg", "red 0%", "blue 100%"])
+	 */
+	var convertToW3CRadialGradient = function(prefix, func, values) {
+		if (values[0].indexOf('at') < 0) {
+			// Looks like old syntax
+
+			// Default values
+			var position = 'center';
+			var shape = 'ellipse';
+			var size = 'farthest-corner';
+
+			if (/\bcenter|top|right|bottom|left\b|^\d+/.test(values[0])) {
+				// Found a position
+				// Remove angle value, if any
+				position = values.shift().replace(/\s*-?\d+(?:rad|deg)\s*/, '');
+			}
+			if (/\bcircle|ellipse|closest|farthest|contain|cover\b/.test(values[0])) {
+				// Found a shape and/or size
+				var shapeSizeParts = values.shift().split(/\s+/);
+				if (shapeSizeParts[0] && (shapeSizeParts[0] === 'circle' || shapeSizeParts[0] === 'ellipse')) {
+					shape = shapeSizeParts.shift();
+				}
+				if (shapeSizeParts[0]) {
+					size = shapeSizeParts.shift();
+				}
+
+				// Old keywords are converted to their synonyms
+				if (size === 'cover') {
+					size = 'farthest-corner';
+				} else if (size === 'contain') {
+					size = 'clothest-side';
+				}
+			}
+
+			return func + '(' + shape + ' ' + size + ' at ' + position + ',' + values.join(',') + ')';
+		}
+		return func + '(' + values.join(',') + ')';
+	};
+
+	/**
+	 * Converts a gradient to a W3C-valid one
+	 * Does not support old webkit syntax (-webkit-gradient(linear...) and -webkit-gradient(radial...))
+	 * @param {string} gradient The CSS gradient
+	 */
+	var convertToW3CGradient = function(gradient) {
+		if (cache[gradient]) {
+			return cache[gradient];
+		}
+		var parts = gradient.match(/^(\b|\B-[a-z]{1,10}-)((?:repeating-)?(?:linear|radial)-gradient)/);
+		// "", "-moz-", etc.
+		var prefix = parts && parts[1];
+		// "linear-gradient", "radial-gradient", etc.
+		var func = parts && parts[2];
+
+		var values = gradient.replace(/^(?:\b|\B-[a-z]{1,10}-)(?:repeating-)?(?:linear|radial)-gradient\(|\)$/g, '').split(/\s*,\s*/);
+
+		if (func.indexOf('linear') >= 0) {
+			return cache[gradient] = convertToW3CLinearGradient(prefix, func, values);
+		} else if (func.indexOf('radial') >= 0) {
+			return cache[gradient] = convertToW3CRadialGradient(prefix, func, values);
+		}
+		return cache[gradient] = func + '(' + values.join(',') + ')';
+	};
+
+	Prism.hooks.add('before-highlight', function (env) {
+		if (env.language && languages[env.language] && !languages[env.language].initialized) {
+			var lang = languages[env.language];
+			if (Prism.util.type(lang) !== 'Array') {
+				lang = [lang];
+			}
+			lang.forEach(function(lang) {
+				var before, inside, root, skip;
+				if (lang === true) {
+					before = 'important';
+					inside = env.language;
+					lang = env.language;
+				} else {
+					before = lang.before || 'important';
+					inside = lang.inside || lang.lang;
+					root = lang.root || Prism.languages;
+					skip = lang.skip;
+					lang = env.language;
+				}
+
+				if (!skip && Prism.languages[lang]) {
+					Prism.languages.insertBefore(inside, before, {
+						'gradient': {
+							pattern: /(?:\b|\B-[a-z]{1,10}-)(?:repeating-)?(?:linear|radial)-gradient\((?:(?:rgb|hsl)a?\(.+?\)|[^\)])+\)/gi,
+							inside: {
+								'function': /[\w-]+(?=\()/,
+								'punctuation': /[(),]/
+							}
+						}
+					}, root);
+					env.grammar = Prism.languages[lang];
+
+					languages[env.language] = {initialized: true};
+				}
+			});
+		}
+	});
+
+	if (Prism.plugins.Previewer) {
+		new Prism.plugins.Previewer('gradient', function(value) {
+			this.firstChild.style.backgroundImage = '';
+			this.firstChild.style.backgroundImage = convertToW3CGradient(value);
+			return !!this.firstChild.style.backgroundImage;
+		}, '*', function () {
+			this._elt.innerHTML = '<div></div>';
+		});
+	}
+
+}());
\ No newline at end of file
diff --git a/plugins/previewer-gradient/prism-previewer-gradient.min.js b/plugins/previewer-gradient/prism-previewer-gradient.min.js
new file mode 100644
index 0000000..c3478e8
--- /dev/null
+++ b/plugins/previewer-gradient/prism-previewer-gradient.min.js
@@ -0,0 +1 @@
+!function(){if(("undefined"==typeof self||self.Prism)&&("undefined"==typeof global||global.Prism)){var e={css:!0,less:!0,sass:{lang:"sass",inside:"inside",root:Prism.languages.sass&&Prism.languages.sass["property-line"]},scss:!0,stylus:[{lang:"stylus",before:"hexcode",inside:"rest",root:Prism.languages.stylus&&Prism.languages.stylus["property-declaration"].inside},{lang:"stylus",before:"hexcode",inside:"rest",root:Prism.languages.stylus&&Prism.languages.stylus["variable-declaration"].inside}]},i={},t=function(e,i,t){var a="180deg";return/^(?:\d*\.?\d+(?:deg|rad)|to\b|top|right|bottom|left)/.test(t[0])&&(a=t.shift(),a.indexOf("to ")<0&&(a.indexOf("top")>=0?a=a.indexOf("left")>=0?"to bottom right":a.indexOf("right")>=0?"to bottom left":"to bottom":a.indexOf("bottom")>=0?a=a.indexOf("left")>=0?"to top right":a.indexOf("right")>=0?"to top left":"to top":a.indexOf("left")>=0?a="to right":a.indexOf("right")>=0?a="to left":e&&(a.indexOf("deg")>=0?a=90-parseFloat(a)+"deg":a.indexOf("rad")>=0&&(a=Math.PI/2-parseFloat(a)+"rad")))),i+"("+a+","+t.join(",")+")"},a=function(e,i,t){if(t[0].indexOf("at")<0){var a="center",r="ellipse",n="farthest-corner";if(/\bcenter|top|right|bottom|left\b|^\d+/.test(t[0])&&(a=t.shift().replace(/\s*\d+(?:rad|deg)\s*/,"")),/\bcircle|ellipse|closest|farthest|contain|cover\b/.test(t[0])){var s=t.shift().split(/\s+/);!s[0]||"circle"!==s[0]&&"ellipse"!==s[0]||(r=s.shift()),s[0]&&(n=s.shift()),"cover"===n?n="farthest-corner":"contain"===n&&(n="clothest-side")}return i+"("+r+" "+n+" at "+a+","+t.join(",")+")"}return i+"("+t.join(",")+")"},r=function(e){if(i[e])return i[e];var r=e.match(/^(\b|\B-[a-z]{1,10}-)((?:repeating-)?(?:linear|radial)-gradient)/),n=r&&r[1],s=r&&r[2],l=e.replace(/^(?:\b|\B-[a-z]{1,10}-)(?:repeating-)?(?:linear|radial)-gradient\(|\)$/g,"").split(/\s*,\s*/);return i[e]=s.indexOf("linear")>=0?t(n,s,l):s.indexOf("radial")>=0?a(n,s,l):s+"("+l.join(",")+")"};Prism.hooks.add("before-highlight",function(i){if(i.language&&e[i.language]&&!e[i.language].initialized){var t=e[i.language];"Array"!==Prism.util.type(t)&&(t=[t]),t.forEach(function(t){var a,r,n,s;t===!0?(a="important",r=i.language,t=i.language):(a=t.before||"important",r=t.inside||t.lang,n=t.root||Prism.languages,s=t.skip,t=i.language),!s&&Prism.languages[t]&&(Prism.languages.insertBefore(r,a,{gradient:{pattern:/(?:\b|\B-[a-z]{1,10}-)(?:repeating-)?(?:linear|radial)-gradient\((?:(?:rgb|hsl)a?\(.+?\)|[^\)])+\)/gi,inside:{"function":/[\w-]+(?=\()/,punctuation:/[(),]/}}},n),i.grammar=Prism.languages[t],e[i.language]={initialized:!0})})}}),Prism.plugins.Previewer&&new Prism.plugins.Previewer("gradient",function(e){return this.firstChild.style.backgroundImage="",this.firstChild.style.backgroundImage=r(e),!!this.firstChild.style.backgroundImage},"*",function(){this._elt.innerHTML="<div></div>"})}}();
\ No newline at end of file