├── .gitignore ├── README.md ├── highlight ├── highlight.min.js └── styles │ ├── agate.css │ ├── androidstudio.css │ ├── arduino-light.css │ ├── arta.css │ ├── ascetic.css │ ├── atelier-cave-dark.css │ ├── atelier-cave-light.css │ ├── atelier-dune-dark.css │ ├── atelier-dune-light.css │ ├── atelier-estuary-dark.css │ ├── atelier-estuary-light.css │ ├── atelier-forest-dark.css │ ├── atelier-forest-light.css │ ├── atelier-heath-dark.css │ ├── atelier-heath-light.css │ ├── atelier-lakeside-dark.css │ ├── atelier-lakeside-light.css │ ├── atelier-plateau-dark.css │ ├── atelier-plateau-light.css │ ├── atelier-savanna-dark.css │ ├── atelier-savanna-light.css │ ├── atelier-seaside-dark.css │ ├── atelier-seaside-light.css │ ├── atelier-sulphurpool-dark.css │ ├── atelier-sulphurpool-light.css │ ├── brown-paper.css │ ├── brown-papersq.png │ ├── codepen-embed.css │ ├── color-brewer.css │ ├── dark.css │ ├── darkula.css │ ├── default.css │ ├── docco.css │ ├── dracula.css │ ├── far.css │ ├── foundation.css │ ├── github-gist.css │ ├── github.css │ ├── googlecode.css │ ├── grayscale.css │ ├── gruvbox-dark.css │ ├── gruvbox-light.css │ ├── hopscotch.css │ ├── hybrid.css │ ├── idea.css │ ├── ir-black.css │ ├── kimbie.dark.css │ ├── kimbie.light.css │ ├── magula.css │ ├── mono-blue.css │ ├── monokai-sublime.css │ ├── monokai.css │ ├── obsidian.css │ ├── paraiso-dark.css │ ├── paraiso-light.css │ ├── pojoaque.css │ ├── pojoaque.jpg │ ├── qtcreator_dark.css │ ├── qtcreator_light.css │ ├── railscasts.css │ ├── rainbow.css │ ├── school-book.css │ ├── school-book.png │ ├── solarized-dark.css │ ├── solarized-light.css │ ├── sunburst.css │ ├── tomorrow-night-blue.css │ ├── tomorrow-night-bright.css │ ├── tomorrow-night-eighties.css │ ├── tomorrow-night.css │ ├── tomorrow.css │ ├── vs.css │ ├── xcode.css │ └── zenburn.css ├── index.html ├── pictures ├── Eric-Meyer.jpg ├── Microsoft.svg ├── bg-attach.jpg ├── bg-browsers.jpg ├── bg-frameworks.jpg ├── bootstrap-grid-cols.jpg ├── bootstrap-grid.jpg ├── example.jpg ├── flag.svg └── why.jpg └── shower ├── LICENSE.md ├── README.md ├── screen-16x10.css ├── shower.js └── shower.min.js /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | bower_components 3 | test/bower_components 4 | 5 | .DS_Store 6 | Thumbs.db 7 | 8 | .idea 9 | *.sublime* 10 | 11 | *.log 12 | *.psd 13 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Постигаем CSS Grid Layout 2 | ======================== 3 | 4 | [Смотреть презентацию](http://meuwka.github.io/css-grid-layout/) 5 | -------------------------------------------------------------------------------- /highlight/highlight.min.js: -------------------------------------------------------------------------------- 1 | /*! highlight.js v9.2.0 | BSD3 License | git.io/hljslicense */ 2 | !function(e){var n="object"==typeof window&&window||"object"==typeof self&&self;"undefined"!=typeof exports?e(exports):n&&(n.hljs=e({}),"function"==typeof define&&define.amd&&define([],function(){return n.hljs}))}(function(e){function n(e){return e.replace(/&/gm,"&").replace(//gm,">")}function t(e){return e.nodeName.toLowerCase()}function r(e,n){var t=e&&e.exec(n);return t&&0==t.index}function a(e){return/^(no-?highlight|plain|text)$/i.test(e)}function i(e){var n,t,r,i=e.className+" ";if(i+=e.parentNode?e.parentNode.className:"",t=/\blang(?:uage)?-([\w-]+)\b/i.exec(i))return w(t[1])?t[1]:"no-highlight";for(i=i.split(/\s+/),n=0,r=i.length;r>n;n++)if(w(i[n])||a(i[n]))return i[n]}function o(e,n){var t,r={};for(t in e)r[t]=e[t];if(n)for(t in n)r[t]=n[t];return r}function u(e){var n=[];return function r(e,a){for(var i=e.firstChild;i;i=i.nextSibling)3==i.nodeType?a+=i.nodeValue.length:1==i.nodeType&&(n.push({event:"start",offset:a,node:i}),a=r(i,a),t(i).match(/br|hr|img|input/)||n.push({event:"stop",offset:a,node:i}));return a}(e,0),n}function c(e,r,a){function i(){return e.length&&r.length?e[0].offset!=r[0].offset?e[0].offset"}function u(e){f+=""}function c(e){("start"==e.event?o:u)(e.node)}for(var s=0,f="",l=[];e.length||r.length;){var g=i();if(f+=n(a.substr(s,g[0].offset-s)),s=g[0].offset,g==e){l.reverse().forEach(u);do c(g.splice(0,1)[0]),g=i();while(g==e&&g.length&&g[0].offset==s);l.reverse().forEach(o)}else"start"==g[0].event?l.push(g[0].node):l.pop(),c(g.splice(0,1)[0])}return f+n(a.substr(s))}function s(e){function n(e){return e&&e.source||e}function t(t,r){return new RegExp(n(t),"m"+(e.cI?"i":"")+(r?"g":""))}function r(a,i){if(!a.compiled){if(a.compiled=!0,a.k=a.k||a.bK,a.k){var u={},c=function(n,t){e.cI&&(t=t.toLowerCase()),t.split(" ").forEach(function(e){var t=e.split("|");u[t[0]]=[n,t[1]?Number(t[1]):1]})};"string"==typeof a.k?c("keyword",a.k):Object.keys(a.k).forEach(function(e){c(e,a.k[e])}),a.k=u}a.lR=t(a.l||/\b\w+\b/,!0),i&&(a.bK&&(a.b="\\b("+a.bK.split(" ").join("|")+")\\b"),a.b||(a.b=/\B|\b/),a.bR=t(a.b),a.e||a.eW||(a.e=/\B|\b/),a.e&&(a.eR=t(a.e)),a.tE=n(a.e)||"",a.eW&&i.tE&&(a.tE+=(a.e?"|":"")+i.tE)),a.i&&(a.iR=t(a.i)),void 0===a.r&&(a.r=1),a.c||(a.c=[]);var s=[];a.c.forEach(function(e){e.v?e.v.forEach(function(n){s.push(o(e,n))}):s.push("self"==e?a:e)}),a.c=s,a.c.forEach(function(e){r(e,a)}),a.starts&&r(a.starts,i);var f=a.c.map(function(e){return e.bK?"\\.?("+e.b+")\\.?":e.b}).concat([a.tE,a.i]).map(n).filter(Boolean);a.t=f.length?t(f.join("|"),!0):{exec:function(){return null}}}}r(e)}function f(e,t,a,i){function o(e,n){for(var t=0;t";return i+=e+'">',i+n+o}function h(){if(!k.k)return n(M);var e="",t=0;k.lR.lastIndex=0;for(var r=k.lR.exec(M);r;){e+=n(M.substr(t,r.index-t));var a=g(k,r);a?(B+=a[1],e+=p(a[0],n(r[0]))):e+=n(r[0]),t=k.lR.lastIndex,r=k.lR.exec(M)}return e+n(M.substr(t))}function d(){var e="string"==typeof k.sL;if(e&&!R[k.sL])return n(M);var t=e?f(k.sL,M,!0,y[k.sL]):l(M,k.sL.length?k.sL:void 0);return k.r>0&&(B+=t.r),e&&(y[k.sL]=t.top),p(t.language,t.value,!1,!0)}function b(){L+=void 0!==k.sL?d():h(),M=""}function v(e,n){L+=e.cN?p(e.cN,"",!0):"",k=Object.create(e,{parent:{value:k}})}function m(e,n){if(M+=e,void 0===n)return b(),0;var t=o(n,k);if(t)return t.skip?M+=n:(t.eB&&(M+=n),b(),t.rB||t.eB||(M=n)),v(t,n),t.rB?0:n.length;var r=u(k,n);if(r){var a=k;a.skip?M+=n:(a.rE||a.eE||(M+=n),b(),a.eE&&(M=n));do k.cN&&(L+=""),k.skip||(B+=k.r),k=k.parent;while(k!=r.parent);return r.starts&&v(r.starts,""),a.rE?0:n.length}if(c(n,k))throw new Error('Illegal lexeme "'+n+'" for mode "'+(k.cN||"")+'"');return M+=n,n.length||1}var N=w(e);if(!N)throw new Error('Unknown language: "'+e+'"');s(N);var x,k=i||N,y={},L="";for(x=k;x!=N;x=x.parent)x.cN&&(L=p(x.cN,"",!0)+L);var M="",B=0;try{for(var C,j,I=0;;){if(k.t.lastIndex=I,C=k.t.exec(t),!C)break;j=m(t.substr(I,C.index-I),C[0]),I=C.index+j}for(m(t.substr(I)),x=k;x.parent;x=x.parent)x.cN&&(L+="");return{r:B,value:L,language:e,top:k}}catch(O){if(-1!=O.message.indexOf("Illegal"))return{r:0,value:n(t)};throw O}}function l(e,t){t=t||E.languages||Object.keys(R);var r={r:0,value:n(e)},a=r;return t.forEach(function(n){if(w(n)){var t=f(n,e,!1);t.language=n,t.r>a.r&&(a=t),t.r>r.r&&(a=r,r=t)}}),a.language&&(r.second_best=a),r}function g(e){return E.tabReplace&&(e=e.replace(/^((<[^>]+>|\t)+)/gm,function(e,n){return n.replace(/\t/g,E.tabReplace)})),E.useBR&&(e=e.replace(/\n/g,"
")),e}function p(e,n,t){var r=n?x[n]:t,a=[e.trim()];return e.match(/\bhljs\b/)||a.push("hljs"),-1===e.indexOf(r)&&a.push(r),a.join(" ").trim()}function h(e){var n=i(e);if(!a(n)){var t;E.useBR?(t=document.createElementNS("http://www.w3.org/1999/xhtml","div"),t.innerHTML=e.innerHTML.replace(/\n/g,"").replace(//g,"\n")):t=e;var r=t.textContent,o=n?f(n,r,!0):l(r),s=u(t);if(s.length){var h=document.createElementNS("http://www.w3.org/1999/xhtml","div");h.innerHTML=o.value,o.value=c(s,u(h),r)}o.value=g(o.value),e.innerHTML=o.value,e.className=p(e.className,n,o.language),e.result={language:o.language,re:o.r},o.second_best&&(e.second_best={language:o.second_best.language,re:o.second_best.r})}}function d(e){E=o(E,e)}function b(){if(!b.called){b.called=!0;var e=document.querySelectorAll("pre code");Array.prototype.forEach.call(e,h)}}function v(){addEventListener("DOMContentLoaded",b,!1),addEventListener("load",b,!1)}function m(n,t){var r=R[n]=t(e);r.aliases&&r.aliases.forEach(function(e){x[e]=n})}function N(){return Object.keys(R)}function w(e){return e=(e||"").toLowerCase(),R[e]||R[x[e]]}var E={classPrefix:"hljs-",tabReplace:null,useBR:!1,languages:void 0},R={},x={};return e.highlight=f,e.highlightAuto=l,e.fixMarkup=g,e.highlightBlock=h,e.configure=d,e.initHighlighting=b,e.initHighlightingOnLoad=v,e.registerLanguage=m,e.listLanguages=N,e.getLanguage=w,e.inherit=o,e.IR="[a-zA-Z]\\w*",e.UIR="[a-zA-Z_]\\w*",e.NR="\\b\\d+(\\.\\d+)?",e.CNR="(-?)(\\b0[xX][a-fA-F0-9]+|(\\b\\d+(\\.\\d*)?|\\.\\d+)([eE][-+]?\\d+)?)",e.BNR="\\b(0b[01]+)",e.RSR="!|!=|!==|%|%=|&|&&|&=|\\*|\\*=|\\+|\\+=|,|-|-=|/=|/|:|;|<<|<<=|<=|<|===|==|=|>>>=|>>=|>=|>>>|>>|>|\\?|\\[|\\{|\\(|\\^|\\^=|\\||\\|=|\\|\\||~",e.BE={b:"\\\\[\\s\\S]",r:0},e.ASM={cN:"string",b:"'",e:"'",i:"\\n",c:[e.BE]},e.QSM={cN:"string",b:'"',e:'"',i:"\\n",c:[e.BE]},e.PWM={b:/\b(a|an|the|are|I|I'm|isn't|don't|doesn't|won't|but|just|should|pretty|simply|enough|gonna|going|wtf|so|such|will|you|your|like)\b/},e.C=function(n,t,r){var a=e.inherit({cN:"comment",b:n,e:t,c:[]},r||{});return a.c.push(e.PWM),a.c.push({cN:"doctag",b:"(?:TODO|FIXME|NOTE|BUG|XXX):",r:0}),a},e.CLCM=e.C("//","$"),e.CBCM=e.C("/\\*","\\*/"),e.HCM=e.C("#","$"),e.NM={cN:"number",b:e.NR,r:0},e.CNM={cN:"number",b:e.CNR,r:0},e.BNM={cN:"number",b:e.BNR,r:0},e.CSSNM={cN:"number",b:e.NR+"(%|em|ex|ch|rem|vw|vh|vmin|vmax|cm|mm|in|pt|pc|px|deg|grad|rad|turn|s|ms|Hz|kHz|dpi|dpcm|dppx)?",r:0},e.RM={cN:"regexp",b:/\//,e:/\/[gimuy]*/,i:/\n/,c:[e.BE,{b:/\[/,e:/\]/,r:0,c:[e.BE]}]},e.TM={cN:"title",b:e.IR,r:0},e.UTM={cN:"title",b:e.UIR,r:0},e.METHOD_GUARD={b:"\\.\\s*"+e.UIR,r:0},e});hljs.registerLanguage("xml",function(s){var e="[A-Za-z0-9\\._:-]+",t={eW:!0,i:/]+/}]}]}]};return{aliases:["html","xhtml","rss","atom","xsl","plist"],cI:!0,c:[{cN:"meta",b:"",r:10,c:[{b:"\\[",e:"\\]"}]},s.C("",{r:10}),{b:"<\\!\\[CDATA\\[",e:"\\]\\]>",r:10},{b:/<\?(php)?/,e:/\?>/,sL:"php",c:[{b:"/\\*",e:"\\*/",skip:!0}]},{cN:"tag",b:"|$)",e:">",k:{name:"style"},c:[t],starts:{e:"",rE:!0,sL:["css","xml"]}},{cN:"tag",b:"|$)",e:">",k:{name:"script"},c:[t],starts:{e:"",rE:!0,sL:["actionscript","javascript","handlebars","xml"]}},{cN:"meta",v:[{b:/<\?xml/,e:/\?>/,r:10},{b:/<\?\w+/,e:/\?>/}]},{cN:"tag",b:"",c:[{cN:"name",b:/[^\/><\s]+/,r:0},t]}]}});hljs.registerLanguage("css",function(e){var c="[a-zA-Z-][a-zA-Z0-9_-]*",t={b:/[A-Z\_\.\-]+\s*:/,rB:!0,e:";",eW:!0,c:[{cN:"attribute",b:/\S/,e:":",eE:!0,starts:{eW:!0,eE:!0,c:[{b:/[\w-]+\(/,rB:!0,c:[{cN:"built_in",b:/[\w-]+/},{b:/\(/,e:/\)/,c:[e.ASM,e.QSM]}]},e.CSSNM,e.QSM,e.ASM,e.CBCM,{cN:"number",b:"#[0-9A-Fa-f]+"},{cN:"meta",b:"!important"}]}}]};return{cI:!0,i:/[=\/|'\$]/,c:[e.CBCM,{cN:"selector-id",b:/#[A-Za-z0-9_-]+/},{cN:"selector-class",b:/\.[A-Za-z0-9_-]+/},{cN:"selector-attr",b:/\[/,e:/\]/,i:"$"},{cN:"selector-pseudo",b:/:(:)?[a-zA-Z0-9\_\-\+\(\)"'.]+/},{b:"@(font-face|page)",l:"[a-z-]+",k:"font-face page"},{b:"@",e:"[{;]",c:[{cN:"keyword",b:/\S+/},{b:/\s/,eW:!0,eE:!0,r:0,c:[e.ASM,e.QSM,e.CSSNM]}]},{cN:"selector-tag",b:c,r:0},{b:"{",e:"}",i:/\S/,c:[e.CBCM,t]}]}}); -------------------------------------------------------------------------------- /highlight/styles/agate.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Agate by Taufik Nurrohman 3 | * ---------------------------------------------------- 4 | * 5 | * #ade5fc 6 | * #a2fca2 7 | * #c6b4f0 8 | * #d36363 9 | * #fcc28c 10 | * #fc9b9b 11 | * #ffa 12 | * #fff 13 | * #333 14 | * #62c8f3 15 | * #888 16 | * 17 | */ 18 | 19 | .hljs { 20 | display: block; 21 | overflow-x: auto; 22 | padding: 0.5em; 23 | background: #333; 24 | color: white; 25 | } 26 | 27 | .hljs-name, 28 | .hljs-strong { 29 | font-weight: bold; 30 | } 31 | 32 | .hljs-code, 33 | .hljs-emphasis { 34 | font-style: italic; 35 | } 36 | 37 | .hljs-tag { 38 | color: #62c8f3; 39 | } 40 | 41 | .hljs-variable, 42 | .hljs-template-variable, 43 | .hljs-selector-id, 44 | .hljs-selector-class { 45 | color: #ade5fc; 46 | } 47 | 48 | .hljs-string, 49 | .hljs-bullet { 50 | color: #a2fca2; 51 | } 52 | 53 | .hljs-type, 54 | .hljs-title, 55 | .hljs-section, 56 | .hljs-attribute, 57 | .hljs-quote, 58 | .hljs-built_in, 59 | .hljs-builtin-name { 60 | color: #ffa; 61 | } 62 | 63 | .hljs-number, 64 | .hljs-symbol, 65 | .hljs-bullet { 66 | color: #d36363; 67 | } 68 | 69 | .hljs-keyword, 70 | .hljs-selector-tag, 71 | .hljs-literal { 72 | color: #fcc28c; 73 | } 74 | 75 | .hljs-comment, 76 | .hljs-deletion, 77 | .hljs-code { 78 | color: #888; 79 | } 80 | 81 | .hljs-regexp, 82 | .hljs-link { 83 | color: #c6b4f0; 84 | } 85 | 86 | .hljs-meta { 87 | color: #fc9b9b; 88 | } 89 | 90 | .hljs-deletion { 91 | background-color: #fc9b9b; 92 | color: #333; 93 | } 94 | 95 | .hljs-addition { 96 | background-color: #a2fca2; 97 | color: #333; 98 | } 99 | 100 | .hljs a { 101 | color: inherit; 102 | } 103 | 104 | .hljs a:focus, 105 | .hljs a:hover { 106 | color: inherit; 107 | text-decoration: underline; 108 | } 109 | -------------------------------------------------------------------------------- /highlight/styles/androidstudio.css: -------------------------------------------------------------------------------- 1 | /* 2 | Date: 24 Fev 2015 3 | Author: Pedro Oliveira 4 | */ 5 | 6 | .hljs { 7 | color: #a9b7c6; 8 | background: #282b2e; 9 | display: block; 10 | overflow-x: auto; 11 | padding: 0.5em; 12 | } 13 | 14 | .hljs-number, 15 | .hljs-literal, 16 | .hljs-symbol, 17 | .hljs-bullet { 18 | color: #6897BB; 19 | } 20 | 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-deletion { 24 | color: #cc7832; 25 | } 26 | 27 | .hljs-variable, 28 | .hljs-template-variable, 29 | .hljs-link { 30 | color: #629755; 31 | } 32 | 33 | .hljs-comment, 34 | .hljs-quote { 35 | color: #808080; 36 | } 37 | 38 | .hljs-meta { 39 | color: #bbb529; 40 | } 41 | 42 | .hljs-string, 43 | .hljs-attribute, 44 | .hljs-addition { 45 | color: #6A8759; 46 | } 47 | 48 | .hljs-section, 49 | .hljs-title, 50 | .hljs-type { 51 | color: #ffc66d; 52 | } 53 | 54 | .hljs-name, 55 | .hljs-selector-id, 56 | .hljs-selector-class { 57 | color: #e8bf6a; 58 | } 59 | 60 | .hljs-emphasis { 61 | font-style: italic; 62 | } 63 | 64 | .hljs-strong { 65 | font-weight: bold; 66 | } 67 | -------------------------------------------------------------------------------- /highlight/styles/arduino-light.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Arduino® Light Theme - Stefania Mellai 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #FFFFFF; 12 | } 13 | 14 | .hljs, 15 | .hljs-subst { 16 | color: #434f54; 17 | } 18 | 19 | .hljs-keyword, 20 | .hljs-attribute, 21 | .hljs-selector-tag, 22 | .hljs-doctag, 23 | .hljs-name { 24 | color: #00979D; 25 | } 26 | 27 | .hljs-built_in, 28 | .hljs-literal, 29 | .hljs-bullet, 30 | .hljs-code, 31 | .hljs-addition { 32 | color: #D35400; 33 | } 34 | 35 | .hljs-regexp, 36 | .hljs-symbol, 37 | .hljs-variable, 38 | .hljs-template-variable, 39 | .hljs-link, 40 | .hljs-selector-attr, 41 | .hljs-selector-pseudo { 42 | color: #00979D; 43 | } 44 | 45 | .hljs-type, 46 | .hljs-string, 47 | .hljs-selector-id, 48 | .hljs-selector-class, 49 | .hljs-quote, 50 | .hljs-template-tag, 51 | .hljs-deletion { 52 | color: #005C5F; 53 | } 54 | 55 | .hljs-title, 56 | .hljs-section { 57 | color: #880000; 58 | font-weight: bold; 59 | } 60 | 61 | .hljs-comment { 62 | color: rgba(149,165,166,.8); 63 | } 64 | 65 | .hljs-meta-keyword { 66 | color: #728E00; 67 | } 68 | 69 | .hljs-meta { 70 | color: #728E00; 71 | color: #434f54; 72 | } 73 | 74 | .hljs-emphasis { 75 | font-style: italic; 76 | } 77 | 78 | .hljs-strong { 79 | font-weight: bold; 80 | } 81 | 82 | .hljs-function { 83 | color: #728E00; 84 | } 85 | 86 | .hljs-number { 87 | color: #8A7B52; 88 | } 89 | -------------------------------------------------------------------------------- /highlight/styles/arta.css: -------------------------------------------------------------------------------- 1 | /* 2 | Date: 17.V.2011 3 | Author: pumbur 4 | */ 5 | 6 | .hljs { 7 | display: block; 8 | overflow-x: auto; 9 | padding: 0.5em; 10 | background: #222; 11 | } 12 | 13 | .hljs, 14 | .hljs-subst { 15 | color: #aaa; 16 | } 17 | 18 | .hljs-section { 19 | color: #fff; 20 | } 21 | 22 | .hljs-comment, 23 | .hljs-quote, 24 | .hljs-meta { 25 | color: #444; 26 | } 27 | 28 | .hljs-string, 29 | .hljs-symbol, 30 | .hljs-bullet, 31 | .hljs-regexp { 32 | color: #ffcc33; 33 | } 34 | 35 | .hljs-number, 36 | .hljs-addition { 37 | color: #00cc66; 38 | } 39 | 40 | .hljs-built_in, 41 | .hljs-builtin-name, 42 | .hljs-literal, 43 | .hljs-type, 44 | .hljs-template-variable, 45 | .hljs-attribute, 46 | .hljs-link { 47 | color: #32aaee; 48 | } 49 | 50 | .hljs-keyword, 51 | .hljs-selector-tag, 52 | .hljs-name, 53 | .hljs-selector-id, 54 | .hljs-selector-class { 55 | color: #6644aa; 56 | } 57 | 58 | .hljs-title, 59 | .hljs-variable, 60 | .hljs-deletion, 61 | .hljs-template-tag { 62 | color: #bb1166; 63 | } 64 | 65 | .hljs-section, 66 | .hljs-doctag, 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | 71 | .hljs-emphasis { 72 | font-style: italic; 73 | } 74 | -------------------------------------------------------------------------------- /highlight/styles/ascetic.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Original style from softwaremaniacs.org (c) Ivan Sagalaev 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: white; 12 | color: black; 13 | } 14 | 15 | .hljs-string, 16 | .hljs-variable, 17 | .hljs-template-variable, 18 | .hljs-symbol, 19 | .hljs-bullet, 20 | .hljs-section, 21 | .hljs-addition, 22 | .hljs-attribute, 23 | .hljs-link { 24 | color: #888; 25 | } 26 | 27 | .hljs-comment, 28 | .hljs-quote, 29 | .hljs-meta, 30 | .hljs-deletion { 31 | color: #ccc; 32 | } 33 | 34 | .hljs-keyword, 35 | .hljs-selector-tag, 36 | .hljs-section, 37 | .hljs-name, 38 | .hljs-type, 39 | .hljs-strong { 40 | font-weight: bold; 41 | } 42 | 43 | .hljs-emphasis { 44 | font-style: italic; 45 | } 46 | -------------------------------------------------------------------------------- /highlight/styles/atelier-cave-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Cave Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Cave Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #7e7887; 9 | } 10 | 11 | /* Atelier-Cave Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-regexp, 16 | .hljs-link, 17 | .hljs-tag, 18 | .hljs-name, 19 | .hljs-selector-id, 20 | .hljs-selector-class { 21 | color: #be4678; 22 | } 23 | 24 | /* Atelier-Cave Orange */ 25 | .hljs-number, 26 | .hljs-meta, 27 | .hljs-built_in, 28 | .hljs-builtin-name, 29 | .hljs-literal, 30 | .hljs-type, 31 | .hljs-params { 32 | color: #aa573c; 33 | } 34 | 35 | /* Atelier-Cave Green */ 36 | .hljs-string, 37 | .hljs-symbol, 38 | .hljs-bullet { 39 | color: #2a9292; 40 | } 41 | 42 | /* Atelier-Cave Blue */ 43 | .hljs-title, 44 | .hljs-section { 45 | color: #576ddb; 46 | } 47 | 48 | /* Atelier-Cave Purple */ 49 | .hljs-keyword, 50 | .hljs-selector-tag { 51 | color: #955ae7; 52 | } 53 | 54 | .hljs-deletion, 55 | .hljs-addition { 56 | color: #19171c; 57 | display: inline-block; 58 | width: 100%; 59 | } 60 | 61 | .hljs-deletion { 62 | background-color: #be4678; 63 | } 64 | 65 | .hljs-addition { 66 | background-color: #2a9292; 67 | } 68 | 69 | .hljs { 70 | display: block; 71 | overflow-x: auto; 72 | background: #19171c; 73 | color: #8b8792; 74 | padding: 0.5em; 75 | } 76 | 77 | .hljs-emphasis { 78 | font-style: italic; 79 | } 80 | 81 | .hljs-strong { 82 | font-weight: bold; 83 | } 84 | -------------------------------------------------------------------------------- /highlight/styles/atelier-cave-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Cave Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/cave) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Cave Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #655f6d; 9 | } 10 | 11 | /* Atelier-Cave Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-name, 21 | .hljs-selector-id, 22 | .hljs-selector-class { 23 | color: #be4678; 24 | } 25 | 26 | /* Atelier-Cave Orange */ 27 | .hljs-number, 28 | .hljs-meta, 29 | .hljs-built_in, 30 | .hljs-builtin-name, 31 | .hljs-literal, 32 | .hljs-type, 33 | .hljs-params { 34 | color: #aa573c; 35 | } 36 | 37 | /* Atelier-Cave Green */ 38 | .hljs-string, 39 | .hljs-symbol, 40 | .hljs-bullet { 41 | color: #2a9292; 42 | } 43 | 44 | /* Atelier-Cave Blue */ 45 | .hljs-title, 46 | .hljs-section { 47 | color: #576ddb; 48 | } 49 | 50 | /* Atelier-Cave Purple */ 51 | .hljs-keyword, 52 | .hljs-selector-tag { 53 | color: #955ae7; 54 | } 55 | 56 | .hljs-deletion, 57 | .hljs-addition { 58 | color: #19171c; 59 | display: inline-block; 60 | width: 100%; 61 | } 62 | 63 | .hljs-deletion { 64 | background-color: #be4678; 65 | } 66 | 67 | .hljs-addition { 68 | background-color: #2a9292; 69 | } 70 | 71 | .hljs { 72 | display: block; 73 | overflow-x: auto; 74 | background: #efecf4; 75 | color: #585260; 76 | padding: 0.5em; 77 | } 78 | 79 | .hljs-emphasis { 80 | font-style: italic; 81 | } 82 | 83 | .hljs-strong { 84 | font-weight: bold; 85 | } 86 | -------------------------------------------------------------------------------- /highlight/styles/atelier-dune-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Dune Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Dune Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #999580; 9 | } 10 | 11 | /* Atelier-Dune Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #d73737; 23 | } 24 | 25 | /* Atelier-Dune Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #b65611; 34 | } 35 | 36 | /* Atelier-Dune Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #60ac39; 41 | } 42 | 43 | /* Atelier-Dune Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #6684e1; 47 | } 48 | 49 | /* Atelier-Dune Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #b854d4; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #20201d; 59 | color: #a6a28c; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-dune-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Dune Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/dune) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Dune Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #7d7a68; 9 | } 10 | 11 | /* Atelier-Dune Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #d73737; 23 | } 24 | 25 | /* Atelier-Dune Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #b65611; 34 | } 35 | 36 | /* Atelier-Dune Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #60ac39; 41 | } 42 | 43 | /* Atelier-Dune Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #6684e1; 47 | } 48 | 49 | /* Atelier-Dune Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #b854d4; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #fefbec; 59 | color: #6e6b5e; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-estuary-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Estuary Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/estuary) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Estuary Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #878573; 9 | } 10 | 11 | /* Atelier-Estuary Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #ba6236; 23 | } 24 | 25 | /* Atelier-Estuary Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #ae7313; 34 | } 35 | 36 | /* Atelier-Estuary Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #7d9726; 41 | } 42 | 43 | /* Atelier-Estuary Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #36a166; 47 | } 48 | 49 | /* Atelier-Estuary Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #5f9182; 53 | } 54 | 55 | .hljs-deletion, 56 | .hljs-addition { 57 | color: #22221b; 58 | display: inline-block; 59 | width: 100%; 60 | } 61 | 62 | .hljs-deletion { 63 | background-color: #ba6236; 64 | } 65 | 66 | .hljs-addition { 67 | background-color: #7d9726; 68 | } 69 | 70 | .hljs { 71 | display: block; 72 | overflow-x: auto; 73 | background: #22221b; 74 | color: #929181; 75 | padding: 0.5em; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/atelier-estuary-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Estuary Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/estuary) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Estuary Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #6c6b5a; 9 | } 10 | 11 | /* Atelier-Estuary Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #ba6236; 23 | } 24 | 25 | /* Atelier-Estuary Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #ae7313; 34 | } 35 | 36 | /* Atelier-Estuary Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #7d9726; 41 | } 42 | 43 | /* Atelier-Estuary Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #36a166; 47 | } 48 | 49 | /* Atelier-Estuary Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #5f9182; 53 | } 54 | 55 | .hljs-deletion, 56 | .hljs-addition { 57 | color: #22221b; 58 | display: inline-block; 59 | width: 100%; 60 | } 61 | 62 | .hljs-deletion { 63 | background-color: #ba6236; 64 | } 65 | 66 | .hljs-addition { 67 | background-color: #7d9726; 68 | } 69 | 70 | .hljs { 71 | display: block; 72 | overflow-x: auto; 73 | background: #f4f3ec; 74 | color: #5f5e4e; 75 | padding: 0.5em; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/atelier-forest-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Forest Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/forest) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Forest Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #9c9491; 9 | } 10 | 11 | /* Atelier-Forest Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #f22c40; 23 | } 24 | 25 | /* Atelier-Forest Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #df5320; 34 | } 35 | 36 | /* Atelier-Forest Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #7b9726; 41 | } 42 | 43 | /* Atelier-Forest Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #407ee7; 47 | } 48 | 49 | /* Atelier-Forest Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #6666ea; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #1b1918; 59 | color: #a8a19f; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-forest-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Forest Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/forest) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Forest Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #766e6b; 9 | } 10 | 11 | /* Atelier-Forest Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #f22c40; 23 | } 24 | 25 | /* Atelier-Forest Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #df5320; 34 | } 35 | 36 | /* Atelier-Forest Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #7b9726; 41 | } 42 | 43 | /* Atelier-Forest Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #407ee7; 47 | } 48 | 49 | /* Atelier-Forest Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #6666ea; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #f1efee; 59 | color: #68615e; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-heath-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Heath Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Heath Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #9e8f9e; 9 | } 10 | 11 | /* Atelier-Heath Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #ca402b; 23 | } 24 | 25 | /* Atelier-Heath Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #a65926; 34 | } 35 | 36 | /* Atelier-Heath Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #918b3b; 41 | } 42 | 43 | /* Atelier-Heath Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #516aec; 47 | } 48 | 49 | /* Atelier-Heath Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #7b59c0; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #1b181b; 59 | color: #ab9bab; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-heath-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Heath Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/heath) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Heath Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #776977; 9 | } 10 | 11 | /* Atelier-Heath Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #ca402b; 23 | } 24 | 25 | /* Atelier-Heath Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #a65926; 34 | } 35 | 36 | /* Atelier-Heath Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #918b3b; 41 | } 42 | 43 | /* Atelier-Heath Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #516aec; 47 | } 48 | 49 | /* Atelier-Heath Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #7b59c0; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #f7f3f7; 59 | color: #695d69; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-lakeside-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Lakeside Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/lakeside) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Lakeside Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #7195a8; 9 | } 10 | 11 | /* Atelier-Lakeside Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #d22d72; 23 | } 24 | 25 | /* Atelier-Lakeside Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #935c25; 34 | } 35 | 36 | /* Atelier-Lakeside Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #568c3b; 41 | } 42 | 43 | /* Atelier-Lakeside Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #257fad; 47 | } 48 | 49 | /* Atelier-Lakeside Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #6b6bb8; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #161b1d; 59 | color: #7ea2b4; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-lakeside-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Lakeside Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/lakeside) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Lakeside Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #5a7b8c; 9 | } 10 | 11 | /* Atelier-Lakeside Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #d22d72; 23 | } 24 | 25 | /* Atelier-Lakeside Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #935c25; 34 | } 35 | 36 | /* Atelier-Lakeside Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #568c3b; 41 | } 42 | 43 | /* Atelier-Lakeside Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #257fad; 47 | } 48 | 49 | /* Atelier-Lakeside Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #6b6bb8; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #ebf8ff; 59 | color: #516d7b; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-plateau-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Plateau Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/plateau) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Plateau Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #7e7777; 9 | } 10 | 11 | /* Atelier-Plateau Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #ca4949; 23 | } 24 | 25 | /* Atelier-Plateau Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #b45a3c; 34 | } 35 | 36 | /* Atelier-Plateau Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #4b8b8b; 41 | } 42 | 43 | /* Atelier-Plateau Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #7272ca; 47 | } 48 | 49 | /* Atelier-Plateau Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #8464c4; 53 | } 54 | 55 | .hljs-deletion, 56 | .hljs-addition { 57 | color: #1b1818; 58 | display: inline-block; 59 | width: 100%; 60 | } 61 | 62 | .hljs-deletion { 63 | background-color: #ca4949; 64 | } 65 | 66 | .hljs-addition { 67 | background-color: #4b8b8b; 68 | } 69 | 70 | .hljs { 71 | display: block; 72 | overflow-x: auto; 73 | background: #1b1818; 74 | color: #8a8585; 75 | padding: 0.5em; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/atelier-plateau-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Plateau Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/plateau) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Plateau Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #655d5d; 9 | } 10 | 11 | /* Atelier-Plateau Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #ca4949; 23 | } 24 | 25 | /* Atelier-Plateau Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #b45a3c; 34 | } 35 | 36 | /* Atelier-Plateau Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #4b8b8b; 41 | } 42 | 43 | /* Atelier-Plateau Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #7272ca; 47 | } 48 | 49 | /* Atelier-Plateau Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #8464c4; 53 | } 54 | 55 | .hljs-deletion, 56 | .hljs-addition { 57 | color: #1b1818; 58 | display: inline-block; 59 | width: 100%; 60 | } 61 | 62 | .hljs-deletion { 63 | background-color: #ca4949; 64 | } 65 | 66 | .hljs-addition { 67 | background-color: #4b8b8b; 68 | } 69 | 70 | .hljs { 71 | display: block; 72 | overflow-x: auto; 73 | background: #f4ecec; 74 | color: #585050; 75 | padding: 0.5em; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/atelier-savanna-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Savanna Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/savanna) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Savanna Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #78877d; 9 | } 10 | 11 | /* Atelier-Savanna Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #b16139; 23 | } 24 | 25 | /* Atelier-Savanna Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #9f713c; 34 | } 35 | 36 | /* Atelier-Savanna Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #489963; 41 | } 42 | 43 | /* Atelier-Savanna Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #478c90; 47 | } 48 | 49 | /* Atelier-Savanna Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #55859b; 53 | } 54 | 55 | .hljs-deletion, 56 | .hljs-addition { 57 | color: #171c19; 58 | display: inline-block; 59 | width: 100%; 60 | } 61 | 62 | .hljs-deletion { 63 | background-color: #b16139; 64 | } 65 | 66 | .hljs-addition { 67 | background-color: #489963; 68 | } 69 | 70 | .hljs { 71 | display: block; 72 | overflow-x: auto; 73 | background: #171c19; 74 | color: #87928a; 75 | padding: 0.5em; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/atelier-savanna-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Savanna Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/savanna) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Savanna Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #5f6d64; 9 | } 10 | 11 | /* Atelier-Savanna Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #b16139; 23 | } 24 | 25 | /* Atelier-Savanna Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #9f713c; 34 | } 35 | 36 | /* Atelier-Savanna Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #489963; 41 | } 42 | 43 | /* Atelier-Savanna Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #478c90; 47 | } 48 | 49 | /* Atelier-Savanna Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #55859b; 53 | } 54 | 55 | .hljs-deletion, 56 | .hljs-addition { 57 | color: #171c19; 58 | display: inline-block; 59 | width: 100%; 60 | } 61 | 62 | .hljs-deletion { 63 | background-color: #b16139; 64 | } 65 | 66 | .hljs-addition { 67 | background-color: #489963; 68 | } 69 | 70 | .hljs { 71 | display: block; 72 | overflow-x: auto; 73 | background: #ecf4ee; 74 | color: #526057; 75 | padding: 0.5em; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/atelier-seaside-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Seaside Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Seaside Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #809980; 9 | } 10 | 11 | /* Atelier-Seaside Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #e6193c; 23 | } 24 | 25 | /* Atelier-Seaside Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #87711d; 34 | } 35 | 36 | /* Atelier-Seaside Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #29a329; 41 | } 42 | 43 | /* Atelier-Seaside Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #3d62f5; 47 | } 48 | 49 | /* Atelier-Seaside Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #ad2bee; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #131513; 59 | color: #8ca68c; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-seaside-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Seaside Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/seaside) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Seaside Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #687d68; 9 | } 10 | 11 | /* Atelier-Seaside Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #e6193c; 23 | } 24 | 25 | /* Atelier-Seaside Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #87711d; 34 | } 35 | 36 | /* Atelier-Seaside Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #29a329; 41 | } 42 | 43 | /* Atelier-Seaside Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #3d62f5; 47 | } 48 | 49 | /* Atelier-Seaside Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #ad2bee; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #f4fbf4; 59 | color: #5e6e5e; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-sulphurpool-dark.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Sulphurpool Dark - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/sulphurpool) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Sulphurpool Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #898ea4; 9 | } 10 | 11 | /* Atelier-Sulphurpool Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #c94922; 23 | } 24 | 25 | /* Atelier-Sulphurpool Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #c76b29; 34 | } 35 | 36 | /* Atelier-Sulphurpool Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #ac9739; 41 | } 42 | 43 | /* Atelier-Sulphurpool Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #3d8fd1; 47 | } 48 | 49 | /* Atelier-Sulphurpool Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #6679cc; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #202746; 59 | color: #979db4; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/atelier-sulphurpool-light.css: -------------------------------------------------------------------------------- 1 | /* Base16 Atelier Sulphurpool Light - Theme */ 2 | /* by Bram de Haan (http://atelierbram.github.io/syntax-highlighting/atelier-schemes/sulphurpool) */ 3 | /* Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16) */ 4 | 5 | /* Atelier-Sulphurpool Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #6b7394; 9 | } 10 | 11 | /* Atelier-Sulphurpool Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-attribute, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-regexp, 18 | .hljs-link, 19 | .hljs-name, 20 | .hljs-selector-id, 21 | .hljs-selector-class { 22 | color: #c94922; 23 | } 24 | 25 | /* Atelier-Sulphurpool Orange */ 26 | .hljs-number, 27 | .hljs-meta, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params { 33 | color: #c76b29; 34 | } 35 | 36 | /* Atelier-Sulphurpool Green */ 37 | .hljs-string, 38 | .hljs-symbol, 39 | .hljs-bullet { 40 | color: #ac9739; 41 | } 42 | 43 | /* Atelier-Sulphurpool Blue */ 44 | .hljs-title, 45 | .hljs-section { 46 | color: #3d8fd1; 47 | } 48 | 49 | /* Atelier-Sulphurpool Purple */ 50 | .hljs-keyword, 51 | .hljs-selector-tag { 52 | color: #6679cc; 53 | } 54 | 55 | .hljs { 56 | display: block; 57 | overflow-x: auto; 58 | background: #f5f7ff; 59 | color: #5e6687; 60 | padding: 0.5em; 61 | } 62 | 63 | .hljs-emphasis { 64 | font-style: italic; 65 | } 66 | 67 | .hljs-strong { 68 | font-weight: bold; 69 | } 70 | -------------------------------------------------------------------------------- /highlight/styles/brown-paper.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Brown Paper style from goldblog.com.ua (c) Zaripov Yura 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background:#b7a68e url(./brown-papersq.png); 12 | } 13 | 14 | .hljs-keyword, 15 | .hljs-selector-tag, 16 | .hljs-literal { 17 | color:#005599; 18 | font-weight:bold; 19 | } 20 | 21 | .hljs, 22 | .hljs-subst { 23 | color: #363c69; 24 | } 25 | 26 | .hljs-string, 27 | .hljs-title, 28 | .hljs-section, 29 | .hljs-type, 30 | .hljs-attribute, 31 | .hljs-symbol, 32 | .hljs-bullet, 33 | .hljs-built_in, 34 | .hljs-addition, 35 | .hljs-variable, 36 | .hljs-template-tag, 37 | .hljs-template-variable, 38 | .hljs-link, 39 | .hljs-name { 40 | color: #2c009f; 41 | } 42 | 43 | .hljs-comment, 44 | .hljs-quote, 45 | .hljs-meta, 46 | .hljs-deletion { 47 | color: #802022; 48 | } 49 | 50 | .hljs-keyword, 51 | .hljs-selector-tag, 52 | .hljs-literal, 53 | .hljs-doctag, 54 | .hljs-title, 55 | .hljs-section, 56 | .hljs-type, 57 | .hljs-name, 58 | .hljs-strong { 59 | font-weight: bold; 60 | } 61 | 62 | .hljs-emphasis { 63 | font-style: italic; 64 | } 65 | -------------------------------------------------------------------------------- /highlight/styles/brown-papersq.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/highlight/styles/brown-papersq.png -------------------------------------------------------------------------------- /highlight/styles/codepen-embed.css: -------------------------------------------------------------------------------- 1 | /* 2 | codepen.io Embed Theme 3 | Author: Justin Perry 4 | Original theme - https://github.com/chriskempson/tomorrow-theme 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #222; 12 | color: #fff; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #777; 18 | } 19 | 20 | .hljs-variable, 21 | .hljs-template-variable, 22 | .hljs-tag, 23 | .hljs-regexp, 24 | .hljs-meta, 25 | .hljs-number, 26 | .hljs-built_in, 27 | .hljs-builtin-name, 28 | .hljs-literal, 29 | .hljs-params, 30 | .hljs-symbol, 31 | .hljs-bullet, 32 | .hljs-link, 33 | .hljs-deletion { 34 | color: #ab875d; 35 | } 36 | 37 | .hljs-section, 38 | .hljs-title, 39 | .hljs-name, 40 | .hljs-selector-id, 41 | .hljs-selector-class, 42 | .hljs-type, 43 | .hljs-attribute { 44 | color: #9b869b; 45 | } 46 | 47 | .hljs-string, 48 | .hljs-keyword, 49 | .hljs-selector-tag, 50 | .hljs-addition { 51 | color: #8f9c6c; 52 | } 53 | 54 | .hljs-emphasis { 55 | font-style: italic; 56 | } 57 | 58 | .hljs-strong { 59 | font-weight: bold; 60 | } 61 | -------------------------------------------------------------------------------- /highlight/styles/color-brewer.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Colorbrewer theme 4 | Original: https://github.com/mbostock/colorbrewer-theme (c) Mike Bostock 5 | Ported by Fabrício Tavares de Oliveira 6 | 7 | */ 8 | 9 | .hljs { 10 | display: block; 11 | overflow-x: auto; 12 | padding: 0.5em; 13 | background: #fff; 14 | } 15 | 16 | .hljs, 17 | .hljs-subst { 18 | color: #000; 19 | } 20 | 21 | .hljs-string, 22 | .hljs-meta, 23 | .hljs-symbol, 24 | .hljs-template-tag, 25 | .hljs-template-variable, 26 | .hljs-addition { 27 | color: #756bb1; 28 | } 29 | 30 | .hljs-comment, 31 | .hljs-quote { 32 | color: #636363; 33 | } 34 | 35 | .hljs-number, 36 | .hljs-regexp, 37 | .hljs-literal, 38 | .hljs-bullet, 39 | .hljs-link { 40 | color: #31a354; 41 | } 42 | 43 | .hljs-deletion, 44 | .hljs-variable { 45 | color: #88f; 46 | } 47 | 48 | 49 | 50 | .hljs-keyword, 51 | .hljs-selector-tag, 52 | .hljs-title, 53 | .hljs-section, 54 | .hljs-built_in, 55 | .hljs-doctag, 56 | .hljs-type, 57 | .hljs-tag, 58 | .hljs-name, 59 | .hljs-selector-id, 60 | .hljs-selector-class, 61 | .hljs-strong { 62 | color: #3182bd; 63 | } 64 | 65 | .hljs-emphasis { 66 | font-style: italic; 67 | } 68 | 69 | .hljs-attribute { 70 | color: #e6550d; 71 | } 72 | -------------------------------------------------------------------------------- /highlight/styles/dark.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Dark style from softwaremaniacs.org (c) Ivan Sagalaev 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #444; 12 | } 13 | 14 | .hljs-keyword, 15 | .hljs-selector-tag, 16 | .hljs-literal, 17 | .hljs-section, 18 | .hljs-link { 19 | color: white; 20 | } 21 | 22 | .hljs, 23 | .hljs-subst { 24 | color: #ddd; 25 | } 26 | 27 | .hljs-string, 28 | .hljs-title, 29 | .hljs-name, 30 | .hljs-type, 31 | .hljs-attribute, 32 | .hljs-symbol, 33 | .hljs-bullet, 34 | .hljs-built_in, 35 | .hljs-addition, 36 | .hljs-variable, 37 | .hljs-template-tag, 38 | .hljs-template-variable { 39 | color: #d88; 40 | } 41 | 42 | .hljs-comment, 43 | .hljs-quote, 44 | .hljs-deletion, 45 | .hljs-meta { 46 | color: #777; 47 | } 48 | 49 | .hljs-keyword, 50 | .hljs-selector-tag, 51 | .hljs-literal, 52 | .hljs-title, 53 | .hljs-section, 54 | .hljs-doctag, 55 | .hljs-type, 56 | .hljs-name, 57 | .hljs-strong { 58 | font-weight: bold; 59 | } 60 | 61 | .hljs-emphasis { 62 | font-style: italic; 63 | } 64 | -------------------------------------------------------------------------------- /highlight/styles/darkula.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Darkula color scheme from the JetBrains family of IDEs 4 | 5 | */ 6 | 7 | 8 | .hljs { 9 | display: block; 10 | overflow-x: auto; 11 | padding: 0.5em; 12 | background: #2b2b2b; 13 | } 14 | 15 | .hljs { 16 | color: #bababa; 17 | } 18 | 19 | .hljs-strong, 20 | .hljs-emphasis { 21 | color: #a8a8a2; 22 | } 23 | 24 | .hljs-bullet, 25 | .hljs-quote, 26 | .hljs-link, 27 | .hljs-number, 28 | .hljs-regexp, 29 | .hljs-literal { 30 | color: #6896ba; 31 | } 32 | 33 | .hljs-code, 34 | .hljs-selector-class { 35 | color: #a6e22e; 36 | } 37 | 38 | .hljs-emphasis { 39 | font-style: italic; 40 | } 41 | 42 | .hljs-keyword, 43 | .hljs-selector-tag, 44 | .hljs-section, 45 | .hljs-attribute, 46 | .hljs-name, 47 | .hljs-variable { 48 | color: #cb7832; 49 | } 50 | 51 | .hljs-params { 52 | color: #b9b9b9; 53 | } 54 | 55 | .hljs-string, 56 | .hljs-subst, 57 | .hljs-type, 58 | .hljs-built_in, 59 | .hljs-builtin-name, 60 | .hljs-symbol, 61 | .hljs-selector-id, 62 | .hljs-selector-attr, 63 | .hljs-selector-pseudo, 64 | .hljs-template-tag, 65 | .hljs-template-variable, 66 | .hljs-addition { 67 | color: #e0c46c; 68 | } 69 | 70 | .hljs-comment, 71 | .hljs-deletion, 72 | .hljs-meta { 73 | color: #7f7f7f; 74 | } 75 | -------------------------------------------------------------------------------- /highlight/styles/default.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Original highlight.js style (c) Ivan Sagalaev 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #F0F0F0; 12 | } 13 | 14 | 15 | /* Base color: saturation 0; */ 16 | 17 | .hljs, 18 | .hljs-subst { 19 | color: #444; 20 | } 21 | 22 | .hljs-comment { 23 | color: #888888; 24 | } 25 | 26 | .hljs-keyword, 27 | .hljs-attribute, 28 | .hljs-selector-tag, 29 | .hljs-meta-keyword, 30 | .hljs-doctag, 31 | .hljs-name { 32 | font-weight: bold; 33 | } 34 | 35 | 36 | /* User color: hue: 0 */ 37 | 38 | .hljs-type, 39 | .hljs-string, 40 | .hljs-number, 41 | .hljs-selector-id, 42 | .hljs-selector-class, 43 | .hljs-quote, 44 | .hljs-template-tag, 45 | .hljs-deletion { 46 | color: #880000; 47 | } 48 | 49 | .hljs-title, 50 | .hljs-section { 51 | color: #880000; 52 | font-weight: bold; 53 | } 54 | 55 | .hljs-regexp, 56 | .hljs-symbol, 57 | .hljs-variable, 58 | .hljs-template-variable, 59 | .hljs-link, 60 | .hljs-selector-attr, 61 | .hljs-selector-pseudo { 62 | color: #BC6060; 63 | } 64 | 65 | 66 | /* Language color: hue: 90; */ 67 | 68 | .hljs-literal { 69 | color: #78A960; 70 | } 71 | 72 | .hljs-built_in, 73 | .hljs-bullet, 74 | .hljs-code, 75 | .hljs-addition { 76 | color: #397300; 77 | } 78 | 79 | 80 | /* Meta color: hue: 200 */ 81 | 82 | .hljs-meta { 83 | color: #1f7199; 84 | } 85 | 86 | .hljs-meta-string { 87 | color: #4d99bf; 88 | } 89 | 90 | 91 | /* Misc effects */ 92 | 93 | .hljs-emphasis { 94 | font-style: italic; 95 | } 96 | 97 | .hljs-strong { 98 | font-weight: bold; 99 | } 100 | -------------------------------------------------------------------------------- /highlight/styles/docco.css: -------------------------------------------------------------------------------- 1 | /* 2 | Docco style used in http://jashkenas.github.com/docco/ converted by Simon Madine (@thingsinjars) 3 | */ 4 | 5 | .hljs { 6 | display: block; 7 | overflow-x: auto; 8 | padding: 0.5em; 9 | color: #000; 10 | background: #f8f8ff; 11 | } 12 | 13 | .hljs-comment, 14 | .hljs-quote { 15 | color: #408080; 16 | font-style: italic; 17 | } 18 | 19 | .hljs-keyword, 20 | .hljs-selector-tag, 21 | .hljs-literal, 22 | .hljs-subst { 23 | color: #954121; 24 | } 25 | 26 | .hljs-number { 27 | color: #40a070; 28 | } 29 | 30 | .hljs-string, 31 | .hljs-doctag { 32 | color: #219161; 33 | } 34 | 35 | .hljs-selector-id, 36 | .hljs-selector-class, 37 | .hljs-section, 38 | .hljs-type { 39 | color: #19469d; 40 | } 41 | 42 | .hljs-params { 43 | color: #00f; 44 | } 45 | 46 | .hljs-title { 47 | color: #458; 48 | font-weight: bold; 49 | } 50 | 51 | .hljs-tag, 52 | .hljs-name, 53 | .hljs-attribute { 54 | color: #000080; 55 | font-weight: normal; 56 | } 57 | 58 | .hljs-variable, 59 | .hljs-template-variable { 60 | color: #008080; 61 | } 62 | 63 | .hljs-regexp, 64 | .hljs-link { 65 | color: #b68; 66 | } 67 | 68 | .hljs-symbol, 69 | .hljs-bullet { 70 | color: #990073; 71 | } 72 | 73 | .hljs-built_in, 74 | .hljs-builtin-name { 75 | color: #0086b3; 76 | } 77 | 78 | .hljs-meta { 79 | color: #999; 80 | font-weight: bold; 81 | } 82 | 83 | .hljs-deletion { 84 | background: #fdd; 85 | } 86 | 87 | .hljs-addition { 88 | background: #dfd; 89 | } 90 | 91 | .hljs-emphasis { 92 | font-style: italic; 93 | } 94 | 95 | .hljs-strong { 96 | font-weight: bold; 97 | } 98 | -------------------------------------------------------------------------------- /highlight/styles/dracula.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Dracula Theme v1.2.0 4 | 5 | https://github.com/zenorocha/dracula-theme 6 | 7 | Copyright 2015, All rights reserved 8 | 9 | Code licensed under the MIT license 10 | http://zenorocha.mit-license.org 11 | 12 | @author Éverton Ribeiro 13 | @author Zeno Rocha 14 | 15 | */ 16 | 17 | .hljs { 18 | display: block; 19 | overflow-x: auto; 20 | padding: 0.5em; 21 | background: #282a36; 22 | } 23 | 24 | .hljs-keyword, 25 | .hljs-selector-tag, 26 | .hljs-literal, 27 | .hljs-section, 28 | .hljs-link { 29 | color: #8be9fd; 30 | } 31 | 32 | .hljs-function .hljs-keyword { 33 | color: #ff79c6; 34 | } 35 | 36 | .hljs, 37 | .hljs-subst { 38 | color: #f8f8f2; 39 | } 40 | 41 | .hljs-string, 42 | .hljs-title, 43 | .hljs-name, 44 | .hljs-type, 45 | .hljs-attribute, 46 | .hljs-symbol, 47 | .hljs-bullet, 48 | .hljs-addition, 49 | .hljs-variable, 50 | .hljs-template-tag, 51 | .hljs-template-variable { 52 | color: #f1fa8c; 53 | } 54 | 55 | .hljs-comment, 56 | .hljs-quote, 57 | .hljs-deletion, 58 | .hljs-meta { 59 | color: #6272a4; 60 | } 61 | 62 | .hljs-keyword, 63 | .hljs-selector-tag, 64 | .hljs-literal, 65 | .hljs-title, 66 | .hljs-section, 67 | .hljs-doctag, 68 | .hljs-type, 69 | .hljs-name, 70 | .hljs-strong { 71 | font-weight: bold; 72 | } 73 | 74 | .hljs-emphasis { 75 | font-style: italic; 76 | } 77 | -------------------------------------------------------------------------------- /highlight/styles/far.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | FAR Style (c) MajestiC 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #000080; 12 | } 13 | 14 | .hljs, 15 | .hljs-subst { 16 | color: #0ff; 17 | } 18 | 19 | .hljs-string, 20 | .hljs-attribute, 21 | .hljs-symbol, 22 | .hljs-bullet, 23 | .hljs-built_in, 24 | .hljs-builtin-name, 25 | .hljs-template-tag, 26 | .hljs-template-variable, 27 | .hljs-addition { 28 | color: #ff0; 29 | } 30 | 31 | .hljs-keyword, 32 | .hljs-selector-tag, 33 | .hljs-section, 34 | .hljs-type, 35 | .hljs-name, 36 | .hljs-selector-id, 37 | .hljs-selector-class, 38 | .hljs-variable { 39 | color: #fff; 40 | } 41 | 42 | .hljs-comment, 43 | .hljs-quote, 44 | .hljs-doctag, 45 | .hljs-deletion { 46 | color: #888; 47 | } 48 | 49 | .hljs-number, 50 | .hljs-regexp, 51 | .hljs-literal, 52 | .hljs-link { 53 | color: #0f0; 54 | } 55 | 56 | .hljs-meta { 57 | color: #008080; 58 | } 59 | 60 | .hljs-keyword, 61 | .hljs-selector-tag, 62 | .hljs-title, 63 | .hljs-section, 64 | .hljs-name, 65 | .hljs-strong { 66 | font-weight: bold; 67 | } 68 | 69 | .hljs-emphasis { 70 | font-style: italic; 71 | } 72 | -------------------------------------------------------------------------------- /highlight/styles/foundation.css: -------------------------------------------------------------------------------- 1 | /* 2 | Description: Foundation 4 docs style for highlight.js 3 | Author: Dan Allen 4 | Website: http://foundation.zurb.com/docs/ 5 | Version: 1.0 6 | Date: 2013-04-02 7 | */ 8 | 9 | .hljs { 10 | display: block; 11 | overflow-x: auto; 12 | padding: 0.5em; 13 | background: #eee; color: black; 14 | } 15 | 16 | .hljs-link, 17 | .hljs-emphasis, 18 | .hljs-attribute, 19 | .hljs-addition { 20 | color: #070; 21 | } 22 | 23 | .hljs-emphasis { 24 | font-style: italic; 25 | } 26 | 27 | .hljs-strong, 28 | .hljs-string, 29 | .hljs-deletion { 30 | color: #d14; 31 | } 32 | 33 | .hljs-strong { 34 | font-weight: bold; 35 | } 36 | 37 | .hljs-quote, 38 | .hljs-comment { 39 | color: #998; 40 | font-style: italic; 41 | } 42 | 43 | .hljs-section, 44 | .hljs-title { 45 | color: #900; 46 | } 47 | 48 | .hljs-class .hljs-title, 49 | .hljs-type { 50 | color: #458; 51 | } 52 | 53 | .hljs-variable, 54 | .hljs-template-variable { 55 | color: #336699; 56 | } 57 | 58 | .hljs-bullet { 59 | color: #997700; 60 | } 61 | 62 | .hljs-meta { 63 | color: #3344bb; 64 | } 65 | 66 | .hljs-code, 67 | .hljs-number, 68 | .hljs-literal, 69 | .hljs-keyword, 70 | .hljs-selector-tag { 71 | color: #099; 72 | } 73 | 74 | .hljs-regexp { 75 | background-color: #fff0ff; 76 | color: #880088; 77 | } 78 | 79 | .hljs-symbol { 80 | color: #990073; 81 | } 82 | 83 | .hljs-tag, 84 | .hljs-name, 85 | .hljs-selector-id, 86 | .hljs-selector-class { 87 | color: #007700; 88 | } 89 | -------------------------------------------------------------------------------- /highlight/styles/github-gist.css: -------------------------------------------------------------------------------- 1 | /** 2 | * GitHub Gist Theme 3 | * Author : Louis Barranqueiro - https://github.com/LouisBarranqueiro 4 | */ 5 | 6 | .hljs { 7 | display: block; 8 | background: white; 9 | padding: 0.5em; 10 | color: #333333; 11 | overflow-x: auto; 12 | } 13 | 14 | .hljs-comment, 15 | .hljs-meta { 16 | color: #969896; 17 | } 18 | 19 | .hljs-string, 20 | .hljs-variable, 21 | .hljs-template-variable, 22 | .hljs-strong, 23 | .hljs-emphasis, 24 | .hljs-quote { 25 | color: #df5000; 26 | } 27 | 28 | .hljs-keyword, 29 | .hljs-selector-tag, 30 | .hljs-type { 31 | color: #a71d5d; 32 | } 33 | 34 | .hljs-literal, 35 | .hljs-symbol, 36 | .hljs-bullet, 37 | .hljs-attribute { 38 | color: #0086b3; 39 | } 40 | 41 | .hljs-section, 42 | .hljs-name { 43 | color: #63a35c; 44 | } 45 | 46 | .hljs-tag { 47 | color: #333333; 48 | } 49 | 50 | .hljs-title, 51 | .hljs-attr, 52 | .hljs-selector-id, 53 | .hljs-selector-class, 54 | .hljs-selector-attr, 55 | .hljs-selector-pseudo { 56 | color: #795da3; 57 | } 58 | 59 | .hljs-addition { 60 | color: #55a532; 61 | background-color: #eaffea; 62 | } 63 | 64 | .hljs-deletion { 65 | color: #bd2c00; 66 | background-color: #ffecec; 67 | } 68 | 69 | .hljs-link { 70 | text-decoration: underline; 71 | } 72 | -------------------------------------------------------------------------------- /highlight/styles/github.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | github.com style (c) Vasily Polovnyov 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | color: #333; 12 | background: #f8f8f8; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #998; 18 | font-style: italic; 19 | } 20 | 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-subst { 24 | color: #333; 25 | font-weight: bold; 26 | } 27 | 28 | .hljs-number, 29 | .hljs-literal, 30 | .hljs-variable, 31 | .hljs-template-variable, 32 | .hljs-tag .hljs-attr { 33 | color: #008080; 34 | } 35 | 36 | .hljs-string, 37 | .hljs-doctag { 38 | color: #d14; 39 | } 40 | 41 | .hljs-title, 42 | .hljs-section, 43 | .hljs-selector-id { 44 | color: #900; 45 | font-weight: bold; 46 | } 47 | 48 | .hljs-subst { 49 | font-weight: normal; 50 | } 51 | 52 | .hljs-type, 53 | .hljs-class .hljs-title { 54 | color: #458; 55 | font-weight: bold; 56 | } 57 | 58 | .hljs-tag, 59 | .hljs-name, 60 | .hljs-attribute { 61 | color: #000080; 62 | font-weight: normal; 63 | } 64 | 65 | .hljs-regexp, 66 | .hljs-link { 67 | color: #009926; 68 | } 69 | 70 | .hljs-symbol, 71 | .hljs-bullet { 72 | color: #990073; 73 | } 74 | 75 | .hljs-built_in, 76 | .hljs-builtin-name { 77 | color: #0086b3; 78 | } 79 | 80 | .hljs-meta { 81 | color: #999; 82 | font-weight: bold; 83 | } 84 | 85 | .hljs-deletion { 86 | background: #fdd; 87 | } 88 | 89 | .hljs-addition { 90 | background: #dfd; 91 | } 92 | 93 | .hljs-emphasis { 94 | font-style: italic; 95 | } 96 | 97 | .hljs-strong { 98 | font-weight: bold; 99 | } 100 | -------------------------------------------------------------------------------- /highlight/styles/googlecode.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Google Code style (c) Aahan Krish 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: white; 12 | color: black; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #800; 18 | } 19 | 20 | .hljs-keyword, 21 | .hljs-selector-tag, 22 | .hljs-section, 23 | .hljs-title, 24 | .hljs-name { 25 | color: #008; 26 | } 27 | 28 | .hljs-variable, 29 | .hljs-template-variable { 30 | color: #660; 31 | } 32 | 33 | .hljs-string, 34 | .hljs-selector-attr, 35 | .hljs-selector-pseudo, 36 | .hljs-regexp { 37 | color: #080; 38 | } 39 | 40 | .hljs-literal, 41 | .hljs-symbol, 42 | .hljs-bullet, 43 | .hljs-meta, 44 | .hljs-number, 45 | .hljs-link { 46 | color: #066; 47 | } 48 | 49 | .hljs-title, 50 | .hljs-doctag, 51 | .hljs-type, 52 | .hljs-attr, 53 | .hljs-built_in, 54 | .hljs-builtin-name, 55 | .hljs-params { 56 | color: #606; 57 | } 58 | 59 | .hljs-attribute, 60 | .hljs-subst { 61 | color: #000; 62 | } 63 | 64 | .hljs-formula { 65 | background-color: #eee; 66 | font-style: italic; 67 | } 68 | 69 | .hljs-selector-id, 70 | .hljs-selector-class { 71 | color: #9B703F 72 | } 73 | 74 | .hljs-addition { 75 | background-color: #baeeba; 76 | } 77 | 78 | .hljs-deletion { 79 | background-color: #ffc8bd; 80 | } 81 | 82 | .hljs-doctag, 83 | .hljs-strong { 84 | font-weight: bold; 85 | } 86 | 87 | .hljs-emphasis { 88 | font-style: italic; 89 | } 90 | -------------------------------------------------------------------------------- /highlight/styles/grayscale.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | grayscale style (c) MY Sun 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | color: #333; 12 | background: #fff; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #777; 18 | font-style: italic; 19 | } 20 | 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-subst { 24 | color: #333; 25 | font-weight: bold; 26 | } 27 | 28 | .hljs-number, 29 | .hljs-literal { 30 | color: #777; 31 | } 32 | 33 | .hljs-string, 34 | .hljs-doctag, 35 | .hljs-formula { 36 | color: #333; 37 | background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAJ0lEQVQIW2O8e/fufwYGBgZBQUEQxcCIIfDu3Tuwivfv30NUoAsAALHpFMMLqZlPAAAAAElFTkSuQmCC) repeat; 38 | } 39 | 40 | .hljs-title, 41 | .hljs-section, 42 | .hljs-selector-id { 43 | color: #000; 44 | font-weight: bold; 45 | } 46 | 47 | .hljs-subst { 48 | font-weight: normal; 49 | } 50 | 51 | .hljs-class .hljs-title, 52 | .hljs-type, 53 | .hljs-name { 54 | color: #333; 55 | font-weight: bold; 56 | } 57 | 58 | .hljs-tag { 59 | color: #333; 60 | } 61 | 62 | .hljs-regexp { 63 | color: #333; 64 | background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAICAYAAADA+m62AAAAPUlEQVQYV2NkQAN37979r6yszIgujiIAU4RNMVwhuiQ6H6wQl3XI4oy4FMHcCJPHcDS6J2A2EqUQpJhohQDexSef15DBCwAAAABJRU5ErkJggg==) repeat; 65 | } 66 | 67 | .hljs-symbol, 68 | .hljs-bullet, 69 | .hljs-link { 70 | color: #000; 71 | background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAKElEQVQIW2NkQAO7d+/+z4gsBhJwdXVlhAvCBECKwIIwAbhKZBUwBQA6hBpm5efZsgAAAABJRU5ErkJggg==) repeat; 72 | } 73 | 74 | .hljs-built_in, 75 | .hljs-builtin-name { 76 | color: #000; 77 | text-decoration: underline; 78 | } 79 | 80 | .hljs-meta { 81 | color: #999; 82 | font-weight: bold; 83 | } 84 | 85 | .hljs-deletion { 86 | color: #fff; 87 | background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAADCAYAAABS3WWCAAAAE0lEQVQIW2MMDQ39zzhz5kwIAQAyxweWgUHd1AAAAABJRU5ErkJggg==) repeat; 88 | } 89 | 90 | .hljs-addition { 91 | color: #000; 92 | background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAALUlEQVQYV2N89+7dfwYk8P79ewZBQUFkIQZGOiu6e/cuiptQHAPl0NtNxAQBAM97Oejj3Dg7AAAAAElFTkSuQmCC) repeat; 93 | } 94 | 95 | .hljs-emphasis { 96 | font-style: italic; 97 | } 98 | 99 | .hljs-strong { 100 | font-weight: bold; 101 | } 102 | -------------------------------------------------------------------------------- /highlight/styles/gruvbox-dark.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Gruvbox style (dark) (c) Pavel Pertsev (original style at https://github.com/morhetz/gruvbox) 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #282828; 12 | } 13 | 14 | .hljs, 15 | .hljs-subst { 16 | color: #ebdbb2; 17 | } 18 | 19 | /* Gruvbox Red */ 20 | .hljs-deletion, 21 | .hljs-formula, 22 | .hljs-keyword, 23 | .hljs-link, 24 | .hljs-selector-tag { 25 | color: #fb4934; 26 | } 27 | 28 | /* Gruvbox Blue */ 29 | .hljs-built_in, 30 | .hljs-emphasis, 31 | .hljs-name, 32 | .hljs-quote, 33 | .hljs-strong, 34 | .hljs-title, 35 | .hljs-variable { 36 | color: #83a598; 37 | } 38 | 39 | /* Gruvbox Yellow */ 40 | .hljs-attr, 41 | .hljs-params, 42 | .hljs-template-tag, 43 | .hljs-type { 44 | color: #fabd2f; 45 | } 46 | 47 | /* Gruvbox Purple */ 48 | .hljs-builtin-name, 49 | .hljs-doctag, 50 | .hljs-literal, 51 | .hljs-number { 52 | color: #8f3f71; 53 | } 54 | 55 | /* Gruvbox Orange */ 56 | .hljs-code, 57 | .hljs-meta, 58 | .hljs-regexp, 59 | .hljs-selector-id, 60 | .hljs-template-variable { 61 | color: #fe8019; 62 | } 63 | 64 | /* Gruvbox Green */ 65 | .hljs-addition, 66 | .hljs-meta-string, 67 | .hljs-section, 68 | .hljs-selector-attr, 69 | .hljs-selector-class, 70 | .hljs-string, 71 | .hljs-symbol { 72 | color: #b8bb26; 73 | } 74 | 75 | /* Gruvbox Aqua */ 76 | .hljs-attribute, 77 | .hljs-bullet, 78 | .hljs-class, 79 | .hljs-function, 80 | .hljs-function .hljs-keyword, 81 | .hljs-meta-keyword, 82 | .hljs-selector-pseudo, 83 | .hljs-tag { 84 | color: #8ec07c; 85 | } 86 | 87 | /* Gruvbox Gray */ 88 | .hljs-comment { 89 | color: #928374; 90 | } 91 | 92 | /* Gruvbox Purple */ 93 | .hljs-link_label, 94 | .hljs-literal, 95 | .hljs-number { 96 | color: #d3869b; 97 | } 98 | 99 | .hljs-comment, 100 | .hljs-emphasis { 101 | font-style: italic; 102 | } 103 | 104 | .hljs-section, 105 | .hljs-strong, 106 | .hljs-tag { 107 | font-weight: bold; 108 | } 109 | -------------------------------------------------------------------------------- /highlight/styles/gruvbox-light.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Gruvbox style (light) (c) Pavel Pertsev (original style at https://github.com/morhetz/gruvbox) 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #fbf1c7; 12 | } 13 | 14 | .hljs, 15 | .hljs-subst { 16 | color: #3c3836; 17 | } 18 | 19 | /* Gruvbox Red */ 20 | .hljs-deletion, 21 | .hljs-formula, 22 | .hljs-keyword, 23 | .hljs-link, 24 | .hljs-selector-tag { 25 | color: #9d0006; 26 | } 27 | 28 | /* Gruvbox Blue */ 29 | .hljs-built_in, 30 | .hljs-emphasis, 31 | .hljs-name, 32 | .hljs-quote, 33 | .hljs-strong, 34 | .hljs-title, 35 | .hljs-variable { 36 | color: #076678; 37 | } 38 | 39 | /* Gruvbox Yellow */ 40 | .hljs-attr, 41 | .hljs-params, 42 | .hljs-template-tag, 43 | .hljs-type { 44 | color: #b57614; 45 | } 46 | 47 | /* Gruvbox Purple */ 48 | .hljs-builtin-name, 49 | .hljs-doctag, 50 | .hljs-literal, 51 | .hljs-number { 52 | color: #8f3f71; 53 | } 54 | 55 | /* Gruvbox Orange */ 56 | .hljs-code, 57 | .hljs-meta, 58 | .hljs-regexp, 59 | .hljs-selector-id, 60 | .hljs-template-variable { 61 | color: #af3a03; 62 | } 63 | 64 | /* Gruvbox Green */ 65 | .hljs-addition, 66 | .hljs-meta-string, 67 | .hljs-section, 68 | .hljs-selector-attr, 69 | .hljs-selector-class, 70 | .hljs-string, 71 | .hljs-symbol { 72 | color: #79740e; 73 | } 74 | 75 | /* Gruvbox Aqua */ 76 | .hljs-attribute, 77 | .hljs-bullet, 78 | .hljs-class, 79 | .hljs-function, 80 | .hljs-function .hljs-keyword, 81 | .hljs-meta-keyword, 82 | .hljs-selector-pseudo, 83 | .hljs-tag { 84 | color: #427b58; 85 | } 86 | 87 | /* Gruvbox Gray */ 88 | .hljs-comment { 89 | color: #928374; 90 | } 91 | 92 | /* Gruvbox Purple */ 93 | .hljs-link_label, 94 | .hljs-literal, 95 | .hljs-number { 96 | color: #8f3f71; 97 | } 98 | 99 | .hljs-comment, 100 | .hljs-emphasis { 101 | font-style: italic; 102 | } 103 | 104 | .hljs-section, 105 | .hljs-strong, 106 | .hljs-tag { 107 | font-weight: bold; 108 | } 109 | -------------------------------------------------------------------------------- /highlight/styles/hopscotch.css: -------------------------------------------------------------------------------- 1 | /* 2 | * Hopscotch 3 | * by Jan T. Sott 4 | * https://github.com/idleberg/Hopscotch 5 | * 6 | * This work is licensed under the Creative Commons CC0 1.0 Universal License 7 | */ 8 | 9 | /* Comment */ 10 | .hljs-comment, 11 | .hljs-quote { 12 | color: #989498; 13 | } 14 | 15 | /* Red */ 16 | .hljs-variable, 17 | .hljs-template-variable, 18 | .hljs-attribute, 19 | .hljs-tag, 20 | .hljs-name, 21 | .hljs-selector-id, 22 | .hljs-selector-class, 23 | .hljs-regexp, 24 | .hljs-link, 25 | .hljs-deletion { 26 | color: #dd464c; 27 | } 28 | 29 | /* Orange */ 30 | .hljs-number, 31 | .hljs-built_in, 32 | .hljs-builtin-name, 33 | .hljs-literal, 34 | .hljs-type, 35 | .hljs-params { 36 | color: #fd8b19; 37 | } 38 | 39 | /* Yellow */ 40 | .hljs-class .hljs-title { 41 | color: #fdcc59; 42 | } 43 | 44 | /* Green */ 45 | .hljs-string, 46 | .hljs-symbol, 47 | .hljs-bullet, 48 | .hljs-addition { 49 | color: #8fc13e; 50 | } 51 | 52 | /* Aqua */ 53 | .hljs-meta { 54 | color: #149b93; 55 | } 56 | 57 | /* Blue */ 58 | .hljs-function, 59 | .hljs-section, 60 | .hljs-title { 61 | color: #1290bf; 62 | } 63 | 64 | /* Purple */ 65 | .hljs-keyword, 66 | .hljs-selector-tag { 67 | color: #c85e7c; 68 | } 69 | 70 | .hljs { 71 | display: block; 72 | background: #322931; 73 | color: #b9b5b8; 74 | padding: 0.5em; 75 | } 76 | 77 | .hljs-emphasis { 78 | font-style: italic; 79 | } 80 | 81 | .hljs-strong { 82 | font-weight: bold; 83 | } 84 | -------------------------------------------------------------------------------- /highlight/styles/hybrid.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | vim-hybrid theme by w0ng (https://github.com/w0ng/vim-hybrid) 4 | 5 | */ 6 | 7 | /*background color*/ 8 | .hljs { 9 | display: block; 10 | overflow-x: auto; 11 | padding: 0.5em; 12 | background: #1d1f21; 13 | } 14 | 15 | /*selection color*/ 16 | .hljs::selection, 17 | .hljs span::selection { 18 | background: #373b41; 19 | } 20 | 21 | .hljs::-moz-selection, 22 | .hljs span::-moz-selection { 23 | background: #373b41; 24 | } 25 | 26 | /*foreground color*/ 27 | .hljs { 28 | color: #c5c8c6; 29 | } 30 | 31 | /*color: fg_yellow*/ 32 | .hljs-title, 33 | .hljs-name { 34 | color: #f0c674; 35 | } 36 | 37 | /*color: fg_comment*/ 38 | .hljs-comment, 39 | .hljs-meta, 40 | .hljs-meta .hljs-keyword { 41 | color: #707880; 42 | } 43 | 44 | /*color: fg_red*/ 45 | .hljs-number, 46 | .hljs-symbol, 47 | .hljs-literal, 48 | .hljs-deletion, 49 | .hljs-link { 50 | color: #cc6666 51 | } 52 | 53 | /*color: fg_green*/ 54 | .hljs-string, 55 | .hljs-doctag, 56 | .hljs-addition, 57 | .hljs-regexp, 58 | .hljs-selector-attr, 59 | .hljs-selector-pseudo { 60 | color: #b5bd68; 61 | } 62 | 63 | /*color: fg_purple*/ 64 | .hljs-attribute, 65 | .hljs-code, 66 | .hljs-selector-id { 67 | color: #b294bb; 68 | } 69 | 70 | /*color: fg_blue*/ 71 | .hljs-keyword, 72 | .hljs-selector-tag, 73 | .hljs-bullet, 74 | .hljs-tag { 75 | color: #81a2be; 76 | } 77 | 78 | /*color: fg_aqua*/ 79 | .hljs-subst, 80 | .hljs-variable, 81 | .hljs-template-tag, 82 | .hljs-template-variable { 83 | color: #8abeb7; 84 | } 85 | 86 | /*color: fg_orange*/ 87 | .hljs-type, 88 | .hljs-built_in, 89 | .hljs-builtin-name, 90 | .hljs-quote, 91 | .hljs-section, 92 | .hljs-selector-class { 93 | color: #de935f; 94 | } 95 | 96 | .hljs-emphasis { 97 | font-style: italic; 98 | } 99 | 100 | .hljs-strong { 101 | font-weight: bold; 102 | } 103 | -------------------------------------------------------------------------------- /highlight/styles/idea.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Intellij Idea-like styling (c) Vasily Polovnyov 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | color: #000; 12 | background: #fff; 13 | } 14 | 15 | .hljs-subst, 16 | .hljs-title { 17 | font-weight: normal; 18 | color: #000; 19 | } 20 | 21 | .hljs-comment, 22 | .hljs-quote { 23 | color: #808080; 24 | font-style: italic; 25 | } 26 | 27 | .hljs-meta { 28 | color: #808000; 29 | } 30 | 31 | .hljs-tag { 32 | background: #efefef; 33 | } 34 | 35 | .hljs-section, 36 | .hljs-name, 37 | .hljs-literal, 38 | .hljs-keyword, 39 | .hljs-selector-tag, 40 | .hljs-type, 41 | .hljs-selector-id, 42 | .hljs-selector-class { 43 | font-weight: bold; 44 | color: #000080; 45 | } 46 | 47 | .hljs-attribute, 48 | .hljs-number, 49 | .hljs-regexp, 50 | .hljs-link { 51 | font-weight: bold; 52 | color: #0000ff; 53 | } 54 | 55 | .hljs-number, 56 | .hljs-regexp, 57 | .hljs-link { 58 | font-weight: normal; 59 | } 60 | 61 | .hljs-string { 62 | color: #008000; 63 | font-weight: bold; 64 | } 65 | 66 | .hljs-symbol, 67 | .hljs-bullet, 68 | .hljs-formula { 69 | color: #000; 70 | background: #d0eded; 71 | font-style: italic; 72 | } 73 | 74 | .hljs-doctag { 75 | text-decoration: underline; 76 | } 77 | 78 | .hljs-variable, 79 | .hljs-template-variable { 80 | color: #660e7a; 81 | } 82 | 83 | .hljs-addition { 84 | background: #baeeba; 85 | } 86 | 87 | .hljs-deletion { 88 | background: #ffc8bd; 89 | } 90 | 91 | .hljs-emphasis { 92 | font-style: italic; 93 | } 94 | 95 | .hljs-strong { 96 | font-weight: bold; 97 | } 98 | -------------------------------------------------------------------------------- /highlight/styles/ir-black.css: -------------------------------------------------------------------------------- 1 | /* 2 | IR_Black style (c) Vasily Mikhailitchenko 3 | */ 4 | 5 | .hljs { 6 | display: block; 7 | overflow-x: auto; 8 | padding: 0.5em; 9 | background: #000; 10 | color: #f8f8f8; 11 | } 12 | 13 | .hljs-comment, 14 | .hljs-quote, 15 | .hljs-meta { 16 | color: #7c7c7c; 17 | } 18 | 19 | .hljs-keyword, 20 | .hljs-selector-tag, 21 | .hljs-tag, 22 | .hljs-name { 23 | color: #96cbfe; 24 | } 25 | 26 | .hljs-attribute, 27 | .hljs-selector-id { 28 | color: #ffffb6; 29 | } 30 | 31 | .hljs-string, 32 | .hljs-selector-attr, 33 | .hljs-selector-pseudo, 34 | .hljs-addition { 35 | color: #a8ff60; 36 | } 37 | 38 | .hljs-subst { 39 | color: #daefa3; 40 | } 41 | 42 | .hljs-regexp, 43 | .hljs-link { 44 | color: #e9c062; 45 | } 46 | 47 | .hljs-title, 48 | .hljs-section, 49 | .hljs-type, 50 | .hljs-doctag { 51 | color: #ffffb6; 52 | } 53 | 54 | .hljs-symbol, 55 | .hljs-bullet, 56 | .hljs-variable, 57 | .hljs-template-variable, 58 | .hljs-literal { 59 | color: #c6c5fe; 60 | } 61 | 62 | .hljs-number, 63 | .hljs-deletion { 64 | color:#ff73fd; 65 | } 66 | 67 | .hljs-emphasis { 68 | font-style: italic; 69 | } 70 | 71 | .hljs-strong { 72 | font-weight: bold; 73 | } 74 | -------------------------------------------------------------------------------- /highlight/styles/kimbie.dark.css: -------------------------------------------------------------------------------- 1 | /* 2 | Name: Kimbie (dark) 3 | Author: Jan T. Sott 4 | License: Creative Commons Attribution-ShareAlike 4.0 Unported License 5 | URL: https://github.com/idleberg/Kimbie-highlight.js 6 | */ 7 | 8 | /* Kimbie Comment */ 9 | .hljs-comment, 10 | .hljs-quote { 11 | color: #d6baad; 12 | } 13 | 14 | /* Kimbie Red */ 15 | .hljs-variable, 16 | .hljs-template-variable, 17 | .hljs-tag, 18 | .hljs-name, 19 | .hljs-selector-id, 20 | .hljs-selector-class, 21 | .hljs-regexp, 22 | .hljs-meta { 23 | color: #dc3958; 24 | } 25 | 26 | /* Kimbie Orange */ 27 | .hljs-number, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params, 33 | .hljs-deletion, 34 | .hljs-link { 35 | color: #f79a32; 36 | } 37 | 38 | /* Kimbie Yellow */ 39 | .hljs-title, 40 | .hljs-section, 41 | .hljs-attribute { 42 | color: #f06431; 43 | } 44 | 45 | /* Kimbie Green */ 46 | .hljs-string, 47 | .hljs-symbol, 48 | .hljs-bullet, 49 | .hljs-addition { 50 | color: #889b4a; 51 | } 52 | 53 | /* Kimbie Purple */ 54 | .hljs-keyword, 55 | .hljs-selector-tag, 56 | .hljs-function { 57 | color: #98676a; 58 | } 59 | 60 | .hljs { 61 | display: block; 62 | overflow-x: auto; 63 | background: #221a0f; 64 | color: #d3af86; 65 | padding: 0.5em; 66 | } 67 | 68 | .hljs-emphasis { 69 | font-style: italic; 70 | } 71 | 72 | .hljs-strong { 73 | font-weight: bold; 74 | } 75 | -------------------------------------------------------------------------------- /highlight/styles/kimbie.light.css: -------------------------------------------------------------------------------- 1 | /* 2 | Name: Kimbie (light) 3 | Author: Jan T. Sott 4 | License: Creative Commons Attribution-ShareAlike 4.0 Unported License 5 | URL: https://github.com/idleberg/Kimbie-highlight.js 6 | */ 7 | 8 | /* Kimbie Comment */ 9 | .hljs-comment, 10 | .hljs-quote { 11 | color: #a57a4c; 12 | } 13 | 14 | /* Kimbie Red */ 15 | .hljs-variable, 16 | .hljs-template-variable, 17 | .hljs-tag, 18 | .hljs-name, 19 | .hljs-selector-id, 20 | .hljs-selector-class, 21 | .hljs-regexp, 22 | .hljs-meta { 23 | color: #dc3958; 24 | } 25 | 26 | /* Kimbie Orange */ 27 | .hljs-number, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params, 33 | .hljs-deletion, 34 | .hljs-link { 35 | color: #f79a32; 36 | } 37 | 38 | /* Kimbie Yellow */ 39 | .hljs-title, 40 | .hljs-section, 41 | .hljs-attribute { 42 | color: #f06431; 43 | } 44 | 45 | /* Kimbie Green */ 46 | .hljs-string, 47 | .hljs-symbol, 48 | .hljs-bullet, 49 | .hljs-addition { 50 | color: #889b4a; 51 | } 52 | 53 | /* Kimbie Purple */ 54 | .hljs-keyword, 55 | .hljs-selector-tag, 56 | .hljs-function { 57 | color: #98676a; 58 | } 59 | 60 | .hljs { 61 | display: block; 62 | overflow-x: auto; 63 | background: #fbebd4; 64 | color: #84613d; 65 | padding: 0.5em; 66 | } 67 | 68 | .hljs-emphasis { 69 | font-style: italic; 70 | } 71 | 72 | .hljs-strong { 73 | font-weight: bold; 74 | } 75 | -------------------------------------------------------------------------------- /highlight/styles/magula.css: -------------------------------------------------------------------------------- 1 | /* 2 | Description: Magula style for highligh.js 3 | Author: Ruslan Keba 4 | Website: http://rukeba.com/ 5 | Version: 1.0 6 | Date: 2009-01-03 7 | Music: Aphex Twin / Xtal 8 | */ 9 | 10 | .hljs { 11 | display: block; 12 | overflow-x: auto; 13 | padding: 0.5em; 14 | background-color: #f4f4f4; 15 | } 16 | 17 | .hljs, 18 | .hljs-subst { 19 | color: black; 20 | } 21 | 22 | .hljs-string, 23 | .hljs-title, 24 | .hljs-symbol, 25 | .hljs-bullet, 26 | .hljs-attribute, 27 | .hljs-addition, 28 | .hljs-variable, 29 | .hljs-template-tag, 30 | .hljs-template-variable { 31 | color: #050; 32 | } 33 | 34 | .hljs-comment, 35 | .hljs-quote { 36 | color: #777; 37 | } 38 | 39 | .hljs-number, 40 | .hljs-regexp, 41 | .hljs-literal, 42 | .hljs-type, 43 | .hljs-link { 44 | color: #800; 45 | } 46 | 47 | .hljs-deletion, 48 | .hljs-meta { 49 | color: #00e; 50 | } 51 | 52 | .hljs-keyword, 53 | .hljs-selector-tag, 54 | .hljs-doctag, 55 | .hljs-title, 56 | .hljs-section, 57 | .hljs-built_in, 58 | .hljs-tag, 59 | .hljs-name { 60 | font-weight: bold; 61 | color: navy; 62 | } 63 | 64 | .hljs-emphasis { 65 | font-style: italic; 66 | } 67 | 68 | .hljs-strong { 69 | font-weight: bold; 70 | } 71 | -------------------------------------------------------------------------------- /highlight/styles/mono-blue.css: -------------------------------------------------------------------------------- 1 | /* 2 | Five-color theme from a single blue hue. 3 | */ 4 | .hljs { 5 | display: block; 6 | overflow-x: auto; 7 | padding: 0.5em; 8 | background: #eaeef3; 9 | } 10 | 11 | .hljs { 12 | color: #00193a; 13 | } 14 | 15 | .hljs-keyword, 16 | .hljs-selector-tag, 17 | .hljs-title, 18 | .hljs-section, 19 | .hljs-doctag, 20 | .hljs-name, 21 | .hljs-strong { 22 | font-weight: bold; 23 | } 24 | 25 | .hljs-comment { 26 | color: #738191; 27 | } 28 | 29 | .hljs-string, 30 | .hljs-title, 31 | .hljs-section, 32 | .hljs-built_in, 33 | .hljs-literal, 34 | .hljs-type, 35 | .hljs-addition, 36 | .hljs-tag, 37 | .hljs-quote, 38 | .hljs-name, 39 | .hljs-selector-id, 40 | .hljs-selector-class { 41 | color: #0048ab; 42 | } 43 | 44 | .hljs-meta, 45 | .hljs-subst, 46 | .hljs-symbol, 47 | .hljs-regexp, 48 | .hljs-attribute, 49 | .hljs-deletion, 50 | .hljs-variable, 51 | .hljs-template-variable, 52 | .hljs-link, 53 | .hljs-bullet { 54 | color: #4c81c9; 55 | } 56 | 57 | .hljs-emphasis { 58 | font-style: italic; 59 | } 60 | -------------------------------------------------------------------------------- /highlight/styles/monokai-sublime.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Monokai Sublime style. Derived from Monokai by noformnocontent http://nn.mit-license.org/ 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #23241f; 12 | } 13 | 14 | .hljs, 15 | .hljs-tag, 16 | .hljs-subst { 17 | color: #f8f8f2; 18 | } 19 | 20 | .hljs-strong, 21 | .hljs-emphasis { 22 | color: #a8a8a2; 23 | } 24 | 25 | .hljs-bullet, 26 | .hljs-quote, 27 | .hljs-number, 28 | .hljs-regexp, 29 | .hljs-literal, 30 | .hljs-link { 31 | color: #ae81ff; 32 | } 33 | 34 | .hljs-code, 35 | .hljs-title, 36 | .hljs-section, 37 | .hljs-selector-class { 38 | color: #a6e22e; 39 | } 40 | 41 | .hljs-strong { 42 | font-weight: bold; 43 | } 44 | 45 | .hljs-emphasis { 46 | font-style: italic; 47 | } 48 | 49 | .hljs-keyword, 50 | .hljs-selector-tag, 51 | .hljs-name, 52 | .hljs-attr { 53 | color: #f92672; 54 | } 55 | 56 | .hljs-symbol, 57 | .hljs-attribute { 58 | color: #66d9ef; 59 | } 60 | 61 | .hljs-params, 62 | .hljs-class .hljs-title { 63 | color: #f8f8f2; 64 | } 65 | 66 | .hljs-string, 67 | .hljs-type, 68 | .hljs-built_in, 69 | .hljs-builtin-name, 70 | .hljs-selector-id, 71 | .hljs-selector-attr, 72 | .hljs-selector-pseudo, 73 | .hljs-addition, 74 | .hljs-variable, 75 | .hljs-template-variable { 76 | color: #e6db74; 77 | } 78 | 79 | .hljs-comment, 80 | .hljs-deletion, 81 | .hljs-meta { 82 | color: #75715e; 83 | } 84 | -------------------------------------------------------------------------------- /highlight/styles/monokai.css: -------------------------------------------------------------------------------- 1 | /* 2 | Monokai style - ported by Luigi Maselli - http://grigio.org 3 | */ 4 | 5 | .hljs { 6 | display: block; 7 | overflow-x: auto; 8 | padding: 0.5em; 9 | background: #272822; color: #ddd; 10 | } 11 | 12 | .hljs-tag, 13 | .hljs-keyword, 14 | .hljs-selector-tag, 15 | .hljs-literal, 16 | .hljs-strong, 17 | .hljs-name { 18 | color: #f92672; 19 | } 20 | 21 | .hljs-code { 22 | color: #66d9ef; 23 | } 24 | 25 | .hljs-class .hljs-title { 26 | color: white; 27 | } 28 | 29 | .hljs-attribute, 30 | .hljs-symbol, 31 | .hljs-regexp, 32 | .hljs-link { 33 | color: #bf79db; 34 | } 35 | 36 | .hljs-string, 37 | .hljs-bullet, 38 | .hljs-subst, 39 | .hljs-title, 40 | .hljs-section, 41 | .hljs-emphasis, 42 | .hljs-type, 43 | .hljs-built_in, 44 | .hljs-builtin-name, 45 | .hljs-selector-attr, 46 | .hljs-selector-pseudo, 47 | .hljs-addition, 48 | .hljs-variable, 49 | .hljs-template-tag, 50 | .hljs-template-variable { 51 | color: #a6e22e; 52 | } 53 | 54 | .hljs-comment, 55 | .hljs-quote, 56 | .hljs-deletion, 57 | .hljs-meta { 58 | color: #75715e; 59 | } 60 | 61 | .hljs-keyword, 62 | .hljs-selector-tag, 63 | .hljs-literal, 64 | .hljs-doctag, 65 | .hljs-title, 66 | .hljs-section, 67 | .hljs-type, 68 | .hljs-selector-id { 69 | font-weight: bold; 70 | } 71 | -------------------------------------------------------------------------------- /highlight/styles/obsidian.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Obsidian style 3 | * ported by Alexander Marenin (http://github.com/ioncreature) 4 | */ 5 | 6 | .hljs { 7 | display: block; 8 | overflow-x: auto; 9 | padding: 0.5em; 10 | background: #282b2e; 11 | } 12 | 13 | .hljs-keyword, 14 | .hljs-selector-tag, 15 | .hljs-literal, 16 | .hljs-selector-id { 17 | color: #93c763; 18 | } 19 | 20 | .hljs-number { 21 | color: #ffcd22; 22 | } 23 | 24 | .hljs { 25 | color: #e0e2e4; 26 | } 27 | 28 | .hljs-attribute { 29 | color: #668bb0; 30 | } 31 | 32 | .hljs-code, 33 | .hljs-class .hljs-title, 34 | .hljs-section { 35 | color: white; 36 | } 37 | 38 | .hljs-regexp, 39 | .hljs-link { 40 | color: #d39745; 41 | } 42 | 43 | .hljs-meta { 44 | color: #557182; 45 | } 46 | 47 | .hljs-tag, 48 | .hljs-name, 49 | .hljs-bullet, 50 | .hljs-subst, 51 | .hljs-emphasis, 52 | .hljs-type, 53 | .hljs-built_in, 54 | .hljs-selector-attr, 55 | .hljs-selector-pseudo, 56 | .hljs-addition, 57 | .hljs-variable, 58 | .hljs-template-tag, 59 | .hljs-template-variable { 60 | color: #8cbbad; 61 | } 62 | 63 | .hljs-string, 64 | .hljs-symbol { 65 | color: #ec7600; 66 | } 67 | 68 | .hljs-comment, 69 | .hljs-quote, 70 | .hljs-deletion { 71 | color: #818e96; 72 | } 73 | 74 | .hljs-selector-class { 75 | color: #A082BD 76 | } 77 | 78 | .hljs-keyword, 79 | .hljs-selector-tag, 80 | .hljs-literal, 81 | .hljs-doctag, 82 | .hljs-title, 83 | .hljs-section, 84 | .hljs-type, 85 | .hljs-name, 86 | .hljs-strong { 87 | font-weight: bold; 88 | } 89 | -------------------------------------------------------------------------------- /highlight/styles/paraiso-dark.css: -------------------------------------------------------------------------------- 1 | /* 2 | Paraíso (dark) 3 | Created by Jan T. Sott (http://github.com/idleberg) 4 | Inspired by the art of Rubens LP (http://www.rubenslp.com.br) 5 | */ 6 | 7 | /* Paraíso Comment */ 8 | .hljs-comment, 9 | .hljs-quote { 10 | color: #8d8687; 11 | } 12 | 13 | /* Paraíso Red */ 14 | .hljs-variable, 15 | .hljs-template-variable, 16 | .hljs-tag, 17 | .hljs-name, 18 | .hljs-selector-id, 19 | .hljs-selector-class, 20 | .hljs-regexp, 21 | .hljs-link, 22 | .hljs-meta { 23 | color: #ef6155; 24 | } 25 | 26 | /* Paraíso Orange */ 27 | .hljs-number, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params, 33 | .hljs-deletion { 34 | color: #f99b15; 35 | } 36 | 37 | /* Paraíso Yellow */ 38 | .hljs-title, 39 | .hljs-section, 40 | .hljs-attribute { 41 | color: #fec418; 42 | } 43 | 44 | /* Paraíso Green */ 45 | .hljs-string, 46 | .hljs-symbol, 47 | .hljs-bullet, 48 | .hljs-addition { 49 | color: #48b685; 50 | } 51 | 52 | /* Paraíso Purple */ 53 | .hljs-keyword, 54 | .hljs-selector-tag { 55 | color: #815ba4; 56 | } 57 | 58 | .hljs { 59 | display: block; 60 | overflow-x: auto; 61 | background: #2f1e2e; 62 | color: #a39e9b; 63 | padding: 0.5em; 64 | } 65 | 66 | .hljs-emphasis { 67 | font-style: italic; 68 | } 69 | 70 | .hljs-strong { 71 | font-weight: bold; 72 | } 73 | -------------------------------------------------------------------------------- /highlight/styles/paraiso-light.css: -------------------------------------------------------------------------------- 1 | /* 2 | Paraíso (light) 3 | Created by Jan T. Sott (http://github.com/idleberg) 4 | Inspired by the art of Rubens LP (http://www.rubenslp.com.br) 5 | */ 6 | 7 | /* Paraíso Comment */ 8 | .hljs-comment, 9 | .hljs-quote { 10 | color: #776e71; 11 | } 12 | 13 | /* Paraíso Red */ 14 | .hljs-variable, 15 | .hljs-template-variable, 16 | .hljs-tag, 17 | .hljs-name, 18 | .hljs-selector-id, 19 | .hljs-selector-class, 20 | .hljs-regexp, 21 | .hljs-link, 22 | .hljs-meta { 23 | color: #ef6155; 24 | } 25 | 26 | /* Paraíso Orange */ 27 | .hljs-number, 28 | .hljs-built_in, 29 | .hljs-builtin-name, 30 | .hljs-literal, 31 | .hljs-type, 32 | .hljs-params, 33 | .hljs-deletion { 34 | color: #f99b15; 35 | } 36 | 37 | /* Paraíso Yellow */ 38 | .hljs-title, 39 | .hljs-section, 40 | .hljs-attribute { 41 | color: #fec418; 42 | } 43 | 44 | /* Paraíso Green */ 45 | .hljs-string, 46 | .hljs-symbol, 47 | .hljs-bullet, 48 | .hljs-addition { 49 | color: #48b685; 50 | } 51 | 52 | /* Paraíso Purple */ 53 | .hljs-keyword, 54 | .hljs-selector-tag { 55 | color: #815ba4; 56 | } 57 | 58 | .hljs { 59 | display: block; 60 | overflow-x: auto; 61 | background: #e7e9db; 62 | color: #4f424c; 63 | padding: 0.5em; 64 | } 65 | 66 | .hljs-emphasis { 67 | font-style: italic; 68 | } 69 | 70 | .hljs-strong { 71 | font-weight: bold; 72 | } 73 | -------------------------------------------------------------------------------- /highlight/styles/pojoaque.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Pojoaque Style by Jason Tate 4 | http://web-cms-designs.com/ftopict-10-pojoaque-style-for-highlight-js-code-highlighter.html 5 | Based on Solarized Style from http://ethanschoonover.com/solarized 6 | 7 | */ 8 | 9 | .hljs { 10 | display: block; 11 | overflow-x: auto; 12 | padding: 0.5em; 13 | color: #dccf8f; 14 | background: url(./pojoaque.jpg) repeat scroll left top #181914; 15 | } 16 | 17 | .hljs-comment, 18 | .hljs-quote { 19 | color: #586e75; 20 | font-style: italic; 21 | } 22 | 23 | .hljs-keyword, 24 | .hljs-selector-tag, 25 | .hljs-literal, 26 | .hljs-addition { 27 | color: #b64926; 28 | } 29 | 30 | .hljs-number, 31 | .hljs-string, 32 | .hljs-doctag, 33 | .hljs-regexp { 34 | color: #468966; 35 | } 36 | 37 | .hljs-title, 38 | .hljs-section, 39 | .hljs-built_in, 40 | .hljs-name { 41 | color: #ffb03b; 42 | } 43 | 44 | .hljs-variable, 45 | .hljs-template-variable, 46 | .hljs-class .hljs-title, 47 | .hljs-type, 48 | .hljs-tag { 49 | color: #b58900; 50 | } 51 | 52 | .hljs-attribute { 53 | color: #b89859; 54 | } 55 | 56 | .hljs-symbol, 57 | .hljs-bullet, 58 | .hljs-link, 59 | .hljs-subst, 60 | .hljs-meta { 61 | color: #cb4b16; 62 | } 63 | 64 | .hljs-deletion { 65 | color: #dc322f; 66 | } 67 | 68 | .hljs-selector-id, 69 | .hljs-selector-class { 70 | color: #d3a60c; 71 | } 72 | 73 | .hljs-formula { 74 | background: #073642; 75 | } 76 | 77 | .hljs-emphasis { 78 | font-style: italic; 79 | } 80 | 81 | .hljs-strong { 82 | font-weight: bold; 83 | } 84 | -------------------------------------------------------------------------------- /highlight/styles/pojoaque.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/highlight/styles/pojoaque.jpg -------------------------------------------------------------------------------- /highlight/styles/qtcreator_dark.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Qt Creator dark color scheme 4 | 5 | */ 6 | 7 | 8 | .hljs { 9 | display: block; 10 | overflow-x: auto; 11 | padding: 0.5em; 12 | background: #000000; 13 | } 14 | 15 | .hljs, 16 | .hljs-subst, 17 | .hljs-tag, 18 | .hljs-title { 19 | color: #aaaaaa; 20 | } 21 | 22 | .hljs-strong, 23 | .hljs-emphasis { 24 | color: #a8a8a2; 25 | } 26 | 27 | .hljs-bullet, 28 | .hljs-quote, 29 | .hljs-number, 30 | .hljs-regexp, 31 | .hljs-literal { 32 | color: #ff55ff; 33 | } 34 | 35 | .hljs-code 36 | .hljs-selector-class { 37 | color: #aaaaff; 38 | } 39 | 40 | .hljs-emphasis, 41 | .hljs-stronge, 42 | .hljs-type { 43 | font-style: italic; 44 | } 45 | 46 | .hljs-keyword, 47 | .hljs-selector-tag, 48 | .hljs-function, 49 | .hljs-section, 50 | .hljs-symbol, 51 | .hljs-name { 52 | color: #ffff55; 53 | } 54 | 55 | .hljs-attribute { 56 | color: #ff5555; 57 | } 58 | 59 | .hljs-variable, 60 | .hljs-params, 61 | .hljs-class .hljs-title { 62 | color: #8888ff; 63 | } 64 | 65 | .hljs-string, 66 | .hljs-selector-id, 67 | .hljs-selector-attr, 68 | .hljs-selector-pseudo, 69 | .hljs-type, 70 | .hljs-built_in, 71 | .hljs-builtin-name, 72 | .hljs-template-tag, 73 | .hljs-template-variable, 74 | .hljs-addition, 75 | .hljs-link { 76 | color: #ff55ff; 77 | } 78 | 79 | .hljs-comment, 80 | .hljs-meta, 81 | .hljs-deletion { 82 | color: #55ffff; 83 | } 84 | -------------------------------------------------------------------------------- /highlight/styles/qtcreator_light.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Qt Creator light color scheme 4 | 5 | */ 6 | 7 | 8 | .hljs { 9 | display: block; 10 | overflow-x: auto; 11 | padding: 0.5em; 12 | background: #ffffff; 13 | } 14 | 15 | .hljs, 16 | .hljs-subst, 17 | .hljs-tag, 18 | .hljs-title { 19 | color: #000000; 20 | } 21 | 22 | .hljs-strong, 23 | .hljs-emphasis { 24 | color: #000000; 25 | } 26 | 27 | .hljs-bullet, 28 | .hljs-quote, 29 | .hljs-number, 30 | .hljs-regexp, 31 | .hljs-literal { 32 | color: #000080; 33 | } 34 | 35 | .hljs-code 36 | .hljs-selector-class { 37 | color: #800080; 38 | } 39 | 40 | .hljs-emphasis, 41 | .hljs-stronge, 42 | .hljs-type { 43 | font-style: italic; 44 | } 45 | 46 | .hljs-keyword, 47 | .hljs-selector-tag, 48 | .hljs-function, 49 | .hljs-section, 50 | .hljs-symbol, 51 | .hljs-name { 52 | color: #808000; 53 | } 54 | 55 | .hljs-attribute { 56 | color: #800000; 57 | } 58 | 59 | .hljs-variable, 60 | .hljs-params, 61 | .hljs-class .hljs-title { 62 | color: #0055AF; 63 | } 64 | 65 | .hljs-string, 66 | .hljs-selector-id, 67 | .hljs-selector-attr, 68 | .hljs-selector-pseudo, 69 | .hljs-type, 70 | .hljs-built_in, 71 | .hljs-builtin-name, 72 | .hljs-template-tag, 73 | .hljs-template-variable, 74 | .hljs-addition, 75 | .hljs-link { 76 | color: #008000; 77 | } 78 | 79 | .hljs-comment, 80 | .hljs-meta, 81 | .hljs-deletion { 82 | color: #008000; 83 | } 84 | -------------------------------------------------------------------------------- /highlight/styles/railscasts.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Railscasts-like style (c) Visoft, Inc. (Damien White) 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #232323; 12 | color: #e6e1dc; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #bc9458; 18 | font-style: italic; 19 | } 20 | 21 | .hljs-keyword, 22 | .hljs-selector-tag { 23 | color: #c26230; 24 | } 25 | 26 | .hljs-string, 27 | .hljs-number, 28 | .hljs-regexp, 29 | .hljs-variable, 30 | .hljs-template-variable { 31 | color: #a5c261; 32 | } 33 | 34 | .hljs-subst { 35 | color: #519f50; 36 | } 37 | 38 | .hljs-tag, 39 | .hljs-name { 40 | color: #e8bf6a; 41 | } 42 | 43 | .hljs-type { 44 | color: #da4939; 45 | } 46 | 47 | 48 | .hljs-symbol, 49 | .hljs-bullet, 50 | .hljs-built_in, 51 | .hljs-builtin-name, 52 | .hljs-attr, 53 | .hljs-link { 54 | color: #6d9cbe; 55 | } 56 | 57 | .hljs-params { 58 | color: #d0d0ff; 59 | } 60 | 61 | .hljs-attribute { 62 | color: #cda869; 63 | } 64 | 65 | .hljs-meta { 66 | color: #9b859d; 67 | } 68 | 69 | .hljs-title, 70 | .hljs-section { 71 | color: #ffc66d; 72 | } 73 | 74 | .hljs-addition { 75 | background-color: #144212; 76 | color: #e6e1dc; 77 | display: inline-block; 78 | width: 100%; 79 | } 80 | 81 | .hljs-deletion { 82 | background-color: #600; 83 | color: #e6e1dc; 84 | display: inline-block; 85 | width: 100%; 86 | } 87 | 88 | .hljs-selector-class { 89 | color: #9b703f; 90 | } 91 | 92 | .hljs-selector-id { 93 | color: #8b98ab; 94 | } 95 | 96 | .hljs-emphasis { 97 | font-style: italic; 98 | } 99 | 100 | .hljs-strong { 101 | font-weight: bold; 102 | } 103 | 104 | .hljs-link { 105 | text-decoration: underline; 106 | } 107 | -------------------------------------------------------------------------------- /highlight/styles/rainbow.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Style with support for rainbow parens 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #474949; 12 | color: #d1d9e1; 13 | } 14 | 15 | 16 | .hljs-comment, 17 | .hljs-quote { 18 | color: #969896; 19 | font-style: italic; 20 | } 21 | 22 | .hljs-keyword, 23 | .hljs-selector-tag, 24 | .hljs-literal, 25 | .hljs-type, 26 | .hljs-addition { 27 | color: #cc99cc; 28 | } 29 | 30 | .hljs-number, 31 | .hljs-selector-attr, 32 | .hljs-selector-pseudo { 33 | color: #f99157; 34 | } 35 | 36 | .hljs-string, 37 | .hljs-doctag, 38 | .hljs-regexp { 39 | color: #8abeb7; 40 | } 41 | 42 | .hljs-title, 43 | .hljs-name, 44 | .hljs-section, 45 | .hljs-built_in { 46 | color: #b5bd68; 47 | } 48 | 49 | .hljs-variable, 50 | .hljs-template-variable, 51 | .hljs-selector-id, 52 | .hljs-class .hljs-title { 53 | color: #ffcc66; 54 | } 55 | 56 | .hljs-section, 57 | .hljs-name, 58 | .hljs-strong { 59 | font-weight: bold; 60 | } 61 | 62 | .hljs-symbol, 63 | .hljs-bullet, 64 | .hljs-subst, 65 | .hljs-meta, 66 | .hljs-link { 67 | color: #f99157; 68 | } 69 | 70 | .hljs-deletion { 71 | color: #dc322f; 72 | } 73 | 74 | .hljs-formula { 75 | background: #eee8d5; 76 | } 77 | 78 | .hljs-attr, 79 | .hljs-attribute { 80 | color: #81a2be; 81 | } 82 | 83 | .hljs-emphasis { 84 | font-style: italic; 85 | } 86 | -------------------------------------------------------------------------------- /highlight/styles/school-book.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | School Book style from goldblog.com.ua (c) Zaripov Yura 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 15px 0.5em 0.5em 30px; 11 | font-size: 11px; 12 | line-height:16px; 13 | } 14 | 15 | pre{ 16 | background:#f6f6ae url(./school-book.png); 17 | border-top: solid 2px #d2e8b9; 18 | border-bottom: solid 1px #d2e8b9; 19 | } 20 | 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-literal { 24 | color:#005599; 25 | font-weight:bold; 26 | } 27 | 28 | .hljs, 29 | .hljs-subst { 30 | color: #3e5915; 31 | } 32 | 33 | .hljs-string, 34 | .hljs-title, 35 | .hljs-section, 36 | .hljs-type, 37 | .hljs-symbol, 38 | .hljs-bullet, 39 | .hljs-attribute, 40 | .hljs-built_in, 41 | .hljs-builtin-name, 42 | .hljs-addition, 43 | .hljs-variable, 44 | .hljs-template-tag, 45 | .hljs-template-variable, 46 | .hljs-link { 47 | color: #2c009f; 48 | } 49 | 50 | .hljs-comment, 51 | .hljs-quote, 52 | .hljs-deletion, 53 | .hljs-meta { 54 | color: #e60415; 55 | } 56 | 57 | .hljs-keyword, 58 | .hljs-selector-tag, 59 | .hljs-literal, 60 | .hljs-doctag, 61 | .hljs-title, 62 | .hljs-section, 63 | .hljs-type, 64 | .hljs-name, 65 | .hljs-selector-id, 66 | .hljs-strong { 67 | font-weight: bold; 68 | } 69 | 70 | .hljs-emphasis { 71 | font-style: italic; 72 | } 73 | -------------------------------------------------------------------------------- /highlight/styles/school-book.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/highlight/styles/school-book.png -------------------------------------------------------------------------------- /highlight/styles/solarized-dark.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #002b36; 12 | color: #839496; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #586e75; 18 | } 19 | 20 | /* Solarized Green */ 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-addition { 24 | color: #859900; 25 | } 26 | 27 | /* Solarized Cyan */ 28 | .hljs-number, 29 | .hljs-string, 30 | .hljs-meta .hljs-meta-string, 31 | .hljs-literal, 32 | .hljs-doctag, 33 | .hljs-regexp { 34 | color: #2aa198; 35 | } 36 | 37 | /* Solarized Blue */ 38 | .hljs-title, 39 | .hljs-section, 40 | .hljs-name, 41 | .hljs-selector-id, 42 | .hljs-selector-class { 43 | color: #268bd2; 44 | } 45 | 46 | /* Solarized Yellow */ 47 | .hljs-attribute, 48 | .hljs-attr, 49 | .hljs-variable, 50 | .hljs-template-variable, 51 | .hljs-class .hljs-title, 52 | .hljs-type { 53 | color: #b58900; 54 | } 55 | 56 | /* Solarized Orange */ 57 | .hljs-symbol, 58 | .hljs-bullet, 59 | .hljs-subst, 60 | .hljs-meta, 61 | .hljs-meta .hljs-keyword, 62 | .hljs-selector-attr, 63 | .hljs-selector-pseudo, 64 | .hljs-link { 65 | color: #cb4b16; 66 | } 67 | 68 | /* Solarized Red */ 69 | .hljs-built_in, 70 | .hljs-deletion { 71 | color: #dc322f; 72 | } 73 | 74 | .hljs-formula { 75 | background: #073642; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/solarized-light.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Orginal Style from ethanschoonover.com/solarized (c) Jeremy Hull 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #fdf6e3; 12 | color: #657b83; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #93a1a1; 18 | } 19 | 20 | /* Solarized Green */ 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-addition { 24 | color: #859900; 25 | } 26 | 27 | /* Solarized Cyan */ 28 | .hljs-number, 29 | .hljs-string, 30 | .hljs-meta .hljs-meta-string, 31 | .hljs-literal, 32 | .hljs-doctag, 33 | .hljs-regexp { 34 | color: #2aa198; 35 | } 36 | 37 | /* Solarized Blue */ 38 | .hljs-title, 39 | .hljs-section, 40 | .hljs-name, 41 | .hljs-selector-id, 42 | .hljs-selector-class { 43 | color: #268bd2; 44 | } 45 | 46 | /* Solarized Yellow */ 47 | .hljs-attribute, 48 | .hljs-attr, 49 | .hljs-variable, 50 | .hljs-template-variable, 51 | .hljs-class .hljs-title, 52 | .hljs-type { 53 | color: #b58900; 54 | } 55 | 56 | /* Solarized Orange */ 57 | .hljs-symbol, 58 | .hljs-bullet, 59 | .hljs-subst, 60 | .hljs-meta, 61 | .hljs-meta .hljs-keyword, 62 | .hljs-selector-attr, 63 | .hljs-selector-pseudo, 64 | .hljs-link { 65 | color: #cb4b16; 66 | } 67 | 68 | /* Solarized Red */ 69 | .hljs-built_in, 70 | .hljs-deletion { 71 | color: #dc322f; 72 | } 73 | 74 | .hljs-formula { 75 | background: #eee8d5; 76 | } 77 | 78 | .hljs-emphasis { 79 | font-style: italic; 80 | } 81 | 82 | .hljs-strong { 83 | font-weight: bold; 84 | } 85 | -------------------------------------------------------------------------------- /highlight/styles/sunburst.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Sunburst-like style (c) Vasily Polovnyov 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #000; 12 | color: #f8f8f8; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #aeaeae; 18 | font-style: italic; 19 | } 20 | 21 | .hljs-keyword, 22 | .hljs-selector-tag, 23 | .hljs-type { 24 | color: #e28964; 25 | } 26 | 27 | .hljs-string { 28 | color: #65b042; 29 | } 30 | 31 | .hljs-subst { 32 | color: #daefa3; 33 | } 34 | 35 | .hljs-regexp, 36 | .hljs-link { 37 | color: #e9c062; 38 | } 39 | 40 | .hljs-title, 41 | .hljs-section, 42 | .hljs-tag, 43 | .hljs-name { 44 | color: #89bdff; 45 | } 46 | 47 | .hljs-class .hljs-title, 48 | .hljs-doctag { 49 | text-decoration: underline; 50 | } 51 | 52 | .hljs-symbol, 53 | .hljs-bullet, 54 | .hljs-number { 55 | color: #3387cc; 56 | } 57 | 58 | .hljs-params, 59 | .hljs-variable, 60 | .hljs-template-variable { 61 | color: #3e87e3; 62 | } 63 | 64 | .hljs-attribute { 65 | color: #cda869; 66 | } 67 | 68 | .hljs-meta { 69 | color: #8996a8; 70 | } 71 | 72 | .hljs-formula { 73 | background-color: #0e2231; 74 | color: #f8f8f8; 75 | font-style: italic; 76 | } 77 | 78 | .hljs-addition { 79 | background-color: #253b22; 80 | color: #f8f8f8; 81 | } 82 | 83 | .hljs-deletion { 84 | background-color: #420e09; 85 | color: #f8f8f8; 86 | } 87 | 88 | .hljs-selector-class { 89 | color: #9b703f; 90 | } 91 | 92 | .hljs-selector-id { 93 | color: #8b98ab; 94 | } 95 | 96 | .hljs-emphasis { 97 | font-style: italic; 98 | } 99 | 100 | .hljs-strong { 101 | font-weight: bold; 102 | } 103 | -------------------------------------------------------------------------------- /highlight/styles/tomorrow-night-blue.css: -------------------------------------------------------------------------------- 1 | /* Tomorrow Night Blue Theme */ 2 | /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ 3 | /* Original theme - https://github.com/chriskempson/tomorrow-theme */ 4 | /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ 5 | 6 | /* Tomorrow Comment */ 7 | .hljs-comment, 8 | .hljs-quote { 9 | color: #7285b7; 10 | } 11 | 12 | /* Tomorrow Red */ 13 | .hljs-variable, 14 | .hljs-template-variable, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-selector-id, 18 | .hljs-selector-class, 19 | .hljs-regexp, 20 | .hljs-deletion { 21 | color: #ff9da4; 22 | } 23 | 24 | /* Tomorrow Orange */ 25 | .hljs-number, 26 | .hljs-built_in, 27 | .hljs-builtin-name, 28 | .hljs-literal, 29 | .hljs-type, 30 | .hljs-params, 31 | .hljs-meta, 32 | .hljs-link { 33 | color: #ffc58f; 34 | } 35 | 36 | /* Tomorrow Yellow */ 37 | .hljs-attribute { 38 | color: #ffeead; 39 | } 40 | 41 | /* Tomorrow Green */ 42 | .hljs-string, 43 | .hljs-symbol, 44 | .hljs-bullet, 45 | .hljs-addition { 46 | color: #d1f1a9; 47 | } 48 | 49 | /* Tomorrow Blue */ 50 | .hljs-title, 51 | .hljs-section { 52 | color: #bbdaff; 53 | } 54 | 55 | /* Tomorrow Purple */ 56 | .hljs-keyword, 57 | .hljs-selector-tag { 58 | color: #ebbbff; 59 | } 60 | 61 | .hljs { 62 | display: block; 63 | overflow-x: auto; 64 | background: #002451; 65 | color: white; 66 | padding: 0.5em; 67 | } 68 | 69 | .hljs-emphasis { 70 | font-style: italic; 71 | } 72 | 73 | .hljs-strong { 74 | font-weight: bold; 75 | } 76 | -------------------------------------------------------------------------------- /highlight/styles/tomorrow-night-bright.css: -------------------------------------------------------------------------------- 1 | /* Tomorrow Night Bright Theme */ 2 | /* Original theme - https://github.com/chriskempson/tomorrow-theme */ 3 | /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ 4 | 5 | /* Tomorrow Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #969896; 9 | } 10 | 11 | /* Tomorrow Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-tag, 15 | .hljs-name, 16 | .hljs-selector-id, 17 | .hljs-selector-class, 18 | .hljs-regexp, 19 | .hljs-deletion { 20 | color: #d54e53; 21 | } 22 | 23 | /* Tomorrow Orange */ 24 | .hljs-number, 25 | .hljs-built_in, 26 | .hljs-builtin-name, 27 | .hljs-literal, 28 | .hljs-type, 29 | .hljs-params, 30 | .hljs-meta, 31 | .hljs-link { 32 | color: #e78c45; 33 | } 34 | 35 | /* Tomorrow Yellow */ 36 | .hljs-attribute { 37 | color: #e7c547; 38 | } 39 | 40 | /* Tomorrow Green */ 41 | .hljs-string, 42 | .hljs-symbol, 43 | .hljs-bullet, 44 | .hljs-addition { 45 | color: #b9ca4a; 46 | } 47 | 48 | /* Tomorrow Blue */ 49 | .hljs-title, 50 | .hljs-section { 51 | color: #7aa6da; 52 | } 53 | 54 | /* Tomorrow Purple */ 55 | .hljs-keyword, 56 | .hljs-selector-tag { 57 | color: #c397d8; 58 | } 59 | 60 | .hljs { 61 | display: block; 62 | overflow-x: auto; 63 | background: black; 64 | color: #eaeaea; 65 | padding: 0.5em; 66 | } 67 | 68 | .hljs-emphasis { 69 | font-style: italic; 70 | } 71 | 72 | .hljs-strong { 73 | font-weight: bold; 74 | } 75 | -------------------------------------------------------------------------------- /highlight/styles/tomorrow-night-eighties.css: -------------------------------------------------------------------------------- 1 | /* Tomorrow Night Eighties Theme */ 2 | /* Original theme - https://github.com/chriskempson/tomorrow-theme */ 3 | /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ 4 | 5 | /* Tomorrow Comment */ 6 | .hljs-comment, 7 | .hljs-quote { 8 | color: #999999; 9 | } 10 | 11 | /* Tomorrow Red */ 12 | .hljs-variable, 13 | .hljs-template-variable, 14 | .hljs-tag, 15 | .hljs-name, 16 | .hljs-selector-id, 17 | .hljs-selector-class, 18 | .hljs-regexp, 19 | .hljs-deletion { 20 | color: #f2777a; 21 | } 22 | 23 | /* Tomorrow Orange */ 24 | .hljs-number, 25 | .hljs-built_in, 26 | .hljs-builtin-name, 27 | .hljs-literal, 28 | .hljs-type, 29 | .hljs-params, 30 | .hljs-meta, 31 | .hljs-link { 32 | color: #f99157; 33 | } 34 | 35 | /* Tomorrow Yellow */ 36 | .hljs-attribute { 37 | color: #ffcc66; 38 | } 39 | 40 | /* Tomorrow Green */ 41 | .hljs-string, 42 | .hljs-symbol, 43 | .hljs-bullet, 44 | .hljs-addition { 45 | color: #99cc99; 46 | } 47 | 48 | /* Tomorrow Blue */ 49 | .hljs-title, 50 | .hljs-section { 51 | color: #6699cc; 52 | } 53 | 54 | /* Tomorrow Purple */ 55 | .hljs-keyword, 56 | .hljs-selector-tag { 57 | color: #cc99cc; 58 | } 59 | 60 | .hljs { 61 | display: block; 62 | overflow-x: auto; 63 | background: #2d2d2d; 64 | color: #cccccc; 65 | padding: 0.5em; 66 | } 67 | 68 | .hljs-emphasis { 69 | font-style: italic; 70 | } 71 | 72 | .hljs-strong { 73 | font-weight: bold; 74 | } 75 | -------------------------------------------------------------------------------- /highlight/styles/tomorrow-night.css: -------------------------------------------------------------------------------- 1 | /* Tomorrow Night Theme */ 2 | /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ 3 | /* Original theme - https://github.com/chriskempson/tomorrow-theme */ 4 | /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ 5 | 6 | /* Tomorrow Comment */ 7 | .hljs-comment, 8 | .hljs-quote { 9 | color: #969896; 10 | } 11 | 12 | /* Tomorrow Red */ 13 | .hljs-variable, 14 | .hljs-template-variable, 15 | .hljs-tag, 16 | .hljs-name, 17 | .hljs-selector-id, 18 | .hljs-selector-class, 19 | .hljs-regexp, 20 | .hljs-deletion { 21 | color: #cc6666; 22 | } 23 | 24 | /* Tomorrow Orange */ 25 | .hljs-number, 26 | .hljs-built_in, 27 | .hljs-builtin-name, 28 | .hljs-literal, 29 | .hljs-type, 30 | .hljs-params, 31 | .hljs-meta, 32 | .hljs-link { 33 | color: #de935f; 34 | } 35 | 36 | /* Tomorrow Yellow */ 37 | .hljs-attribute { 38 | color: #f0c674; 39 | } 40 | 41 | /* Tomorrow Green */ 42 | .hljs-string, 43 | .hljs-symbol, 44 | .hljs-bullet, 45 | .hljs-addition { 46 | color: #b5bd68; 47 | } 48 | 49 | /* Tomorrow Blue */ 50 | .hljs-title, 51 | .hljs-section { 52 | color: #81a2be; 53 | } 54 | 55 | /* Tomorrow Purple */ 56 | .hljs-keyword, 57 | .hljs-selector-tag { 58 | color: #b294bb; 59 | } 60 | 61 | .hljs { 62 | display: block; 63 | overflow-x: auto; 64 | background: #1d1f21; 65 | color: #c5c8c6; 66 | padding: 0.5em; 67 | } 68 | 69 | .hljs-emphasis { 70 | font-style: italic; 71 | } 72 | 73 | .hljs-strong { 74 | font-weight: bold; 75 | } 76 | -------------------------------------------------------------------------------- /highlight/styles/tomorrow.css: -------------------------------------------------------------------------------- 1 | /* http://jmblog.github.com/color-themes-for-google-code-highlightjs */ 2 | 3 | /* Tomorrow Comment */ 4 | .hljs-comment, 5 | .hljs-quote { 6 | color: #8e908c; 7 | } 8 | 9 | /* Tomorrow Red */ 10 | .hljs-variable, 11 | .hljs-template-variable, 12 | .hljs-tag, 13 | .hljs-name, 14 | .hljs-selector-id, 15 | .hljs-selector-class, 16 | .hljs-regexp, 17 | .hljs-deletion { 18 | color: #c82829; 19 | } 20 | 21 | /* Tomorrow Orange */ 22 | .hljs-number, 23 | .hljs-built_in, 24 | .hljs-builtin-name, 25 | .hljs-literal, 26 | .hljs-type, 27 | .hljs-params, 28 | .hljs-meta, 29 | .hljs-link { 30 | color: #f5871f; 31 | } 32 | 33 | /* Tomorrow Yellow */ 34 | .hljs-attribute { 35 | color: #eab700; 36 | } 37 | 38 | /* Tomorrow Green */ 39 | .hljs-string, 40 | .hljs-symbol, 41 | .hljs-bullet, 42 | .hljs-addition { 43 | color: #718c00; 44 | } 45 | 46 | /* Tomorrow Blue */ 47 | .hljs-title, 48 | .hljs-section { 49 | color: #4271ae; 50 | } 51 | 52 | /* Tomorrow Purple */ 53 | .hljs-keyword, 54 | .hljs-selector-tag { 55 | color: #8959a8; 56 | } 57 | 58 | .hljs { 59 | display: block; 60 | overflow-x: auto; 61 | background: white; 62 | color: #4d4d4c; 63 | padding: 0.5em; 64 | } 65 | 66 | .hljs-emphasis { 67 | font-style: italic; 68 | } 69 | 70 | .hljs-strong { 71 | font-weight: bold; 72 | } 73 | -------------------------------------------------------------------------------- /highlight/styles/vs.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Visual Studio-like style based on original C# coloring by Jason Diamond 4 | 5 | */ 6 | .hljs { 7 | display: block; 8 | overflow-x: auto; 9 | padding: 0.5em; 10 | background: white; 11 | color: black; 12 | } 13 | 14 | .hljs-comment, 15 | .hljs-quote, 16 | .hljs-variable { 17 | color: #008000; 18 | } 19 | 20 | .hljs-keyword, 21 | .hljs-selector-tag, 22 | .hljs-built_in, 23 | .hljs-name, 24 | .hljs-tag { 25 | color: #00f; 26 | } 27 | 28 | .hljs-string, 29 | .hljs-title, 30 | .hljs-section, 31 | .hljs-attribute, 32 | .hljs-literal, 33 | .hljs-template-tag, 34 | .hljs-template-variable, 35 | .hljs-type, 36 | .hljs-addition { 37 | color: #a31515; 38 | } 39 | 40 | .hljs-deletion, 41 | .hljs-selector-attr, 42 | .hljs-selector-pseudo, 43 | .hljs-meta { 44 | color: #2b91af; 45 | } 46 | 47 | .hljs-doctag { 48 | color: #808080; 49 | } 50 | 51 | .hljs-attr { 52 | color: #f00; 53 | } 54 | 55 | .hljs-symbol, 56 | .hljs-bullet, 57 | .hljs-link { 58 | color: #00b0e8; 59 | } 60 | 61 | 62 | .hljs-emphasis { 63 | font-style: italic; 64 | } 65 | 66 | .hljs-strong { 67 | font-weight: bold; 68 | } 69 | -------------------------------------------------------------------------------- /highlight/styles/xcode.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | XCode style (c) Angel Garcia 4 | 5 | */ 6 | 7 | .hljs { 8 | display: block; 9 | overflow-x: auto; 10 | padding: 0.5em; 11 | background: #fff; 12 | color: black; 13 | } 14 | 15 | .hljs-comment, 16 | .hljs-quote { 17 | color: #006a00; 18 | } 19 | 20 | .hljs-keyword, 21 | .hljs-selector-tag, 22 | .hljs-literal { 23 | color: #aa0d91; 24 | } 25 | 26 | .hljs-name { 27 | color: #008; 28 | } 29 | 30 | .hljs-variable, 31 | .hljs-template-variable { 32 | color: #660; 33 | } 34 | 35 | .hljs-string { 36 | color: #c41a16; 37 | } 38 | 39 | .hljs-regexp, 40 | .hljs-link { 41 | color: #080; 42 | } 43 | 44 | .hljs-title, 45 | .hljs-tag, 46 | .hljs-symbol, 47 | .hljs-bullet, 48 | .hljs-number, 49 | .hljs-meta { 50 | color: #1c00cf; 51 | } 52 | 53 | .hljs-section, 54 | .hljs-class .hljs-title, 55 | .hljs-type, 56 | .hljs-attr, 57 | .hljs-built_in, 58 | .hljs-builtin-name, 59 | .hljs-params { 60 | color: #5c2699; 61 | } 62 | 63 | .hljs-attribute, 64 | .hljs-subst { 65 | color: #000; 66 | } 67 | 68 | .hljs-formula { 69 | background-color: #eee; 70 | font-style: italic; 71 | } 72 | 73 | .hljs-addition { 74 | background-color: #baeeba; 75 | } 76 | 77 | .hljs-deletion { 78 | background-color: #ffc8bd; 79 | } 80 | 81 | .hljs-selector-id, 82 | .hljs-selector-class { 83 | color: #9b703f; 84 | } 85 | 86 | .hljs-doctag, 87 | .hljs-strong { 88 | font-weight: bold; 89 | } 90 | 91 | .hljs-emphasis { 92 | font-style: italic; 93 | } 94 | -------------------------------------------------------------------------------- /highlight/styles/zenburn.css: -------------------------------------------------------------------------------- 1 | /* 2 | 3 | Zenburn style from voldmar.ru (c) Vladimir Epifanov 4 | based on dark.css by Ivan Sagalaev 5 | 6 | */ 7 | 8 | .hljs { 9 | display: block; 10 | overflow-x: auto; 11 | padding: 0.5em; 12 | background: #3f3f3f; 13 | color: #dcdcdc; 14 | } 15 | 16 | .hljs-keyword, 17 | .hljs-selector-tag, 18 | .hljs-tag { 19 | color: #e3ceab; 20 | } 21 | 22 | .hljs-template-tag { 23 | color: #dcdcdc; 24 | } 25 | 26 | .hljs-number { 27 | color: #8cd0d3; 28 | } 29 | 30 | .hljs-variable, 31 | .hljs-template-variable, 32 | .hljs-attribute { 33 | color: #efdcbc; 34 | } 35 | 36 | .hljs-literal { 37 | color: #efefaf; 38 | } 39 | 40 | .hljs-subst { 41 | color: #8f8f8f; 42 | } 43 | 44 | .hljs-title, 45 | .hljs-name, 46 | .hljs-selector-id, 47 | .hljs-selector-class, 48 | .hljs-section, 49 | .hljs-type { 50 | color: #efef8f; 51 | } 52 | 53 | .hljs-symbol, 54 | .hljs-bullet, 55 | .hljs-link { 56 | color: #dca3a3; 57 | } 58 | 59 | .hljs-deletion, 60 | .hljs-string, 61 | .hljs-built_in, 62 | .hljs-builtin-name { 63 | color: #cc9393; 64 | } 65 | 66 | .hljs-addition, 67 | .hljs-comment, 68 | .hljs-quote, 69 | .hljs-meta { 70 | color: #7f9f7f; 71 | } 72 | 73 | 74 | .hljs-emphasis { 75 | font-style: italic; 76 | } 77 | 78 | .hljs-strong { 79 | font-weight: bold; 80 | } 81 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | CSS Grid Layout 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 |

Постигаем CSS Grid Layout

17 |
Наталия Короткова
18 |
19 | 20 |
21 |

Постигаем
CSS Grid Layout

22 |

Наталия Короткова

23 |
24 | 25 |
26 |
27 |
28 |

From the very beginning of CSS, there has been a giant, 29 |
layout-shaped hole at its center.

30 |
31 |
— Eric Meyer
32 |
33 | Eric Meyer 34 |
35 | 36 |
37 |

Flexbox

38 |
    39 |
  • раскладка только в одном направлении
  • 40 |
  • необходимость создавать новые контейнеры-обёртки
  • 41 |
  • верстка подстраивается под контент, а не наоборот
  • 42 |
43 |
44 | 45 |
46 |

Огромное количество систем
построения разметки.

47 | CSS-фреймворки 48 |
49 | 50 |
51 |
52 | 55 |
56 | 60 |
61 | 62 |
63 |
 64 |         <ul>
 65 |   <li> </li>
 66 |   <li> </li>
 67 |   ...
 68 |   <li> </li>
 69 | </ul>
 70 |       
71 |
72 | 73 |
74 |

CSS Grid Layout

75 |

76 | Начат Microsoft в 2011 77 |

78 |
79 | 80 |
81 |

Что там у браузеров?

82 | Браузеры 83 |
84 | 85 |
86 | 87 | 88 | 89 | 90 | 91 | 92 | 93 | 97 | 98 | 99 | 100 | 104 | 105 | 106 | 107 | 111 | 112 | 113 | 114 | 115 | 116 |
IE10+, Edge-ms имплементация отличается
Chrome,
Canary
94 | Flag 95 | chrome://flags/#enable-experimental-web-platform-features 96 |
Opera 101 | Flag 102 | opera://flags/#enable-experimental-web-platform-features 103 |
Firefox 108 | Flag 109 | about:configlayout.css.grid.enabled 110 |
SafariSafari Technology Preview
117 |

CSS Grid Polyfill

118 |
119 | 120 |
121 |

Шаг 1

122 |

Создаем грид-контейнер

123 |
124 | 125 |
126 |
127 |         .grid-container {
128 |   display: grid;
129 | }
130 |   
131 | 140 |
141 | 142 |
143 |

Шаг 2

144 |

Рисуем виртуальную сетку

145 |
146 | 147 |
148 |
149 |           .grid-container {
150 |   display: grid;
151 |   grid-template-columns: 250px 1fr 100px;
152 |   grid-template-rows: 80px 80px 80px;
153 | }
154 | 		
155 |
156 | 157 |
158 |

See the Pen CSS Grid Layout by Nataliya Karatkova on CodePen.

159 |
160 | 161 |
162 |

See the Pen CSS Grid Layout - 2 by Nataliya Karatkova on CodePen.

163 |
164 | 165 |
166 |
167 |           .grid-container {
168 |   display: grid;
169 |   grid-template-columns: 250px 1fr 100px;
170 |   grid-template-rows: repeat(10, 80px) 85px;
171 | }
172 | 		
173 |
174 | 175 |
176 |

Fraction

177 |

Доля оставшегося пространства

178 |

See the Pen CSS Grid Layout - fraction by Nataliya Karatkova on CodePen.

179 |
180 | 181 |
182 |

Единицы измерения

183 |
    184 |
  • auto
  • 185 |
  • px, rem, em, vw и т. д.
  • 186 |
  • %
  • 187 |
  • fr
  • 188 |
  • max-content, min-content, minmax(min, max)
  • 189 |
190 |
191 | 192 |
193 |

Шаг 3

194 |

Цепляем к сетке

195 | Цепляем к сетке 196 |
197 | 198 |
199 |
200 |

Грид-линии

201 |
202 |           .grid-element {
203 |   grid-column-start: 3;
204 |   grid-column-end: 4;
205 |   grid-row-start: 2;
206 |   grid-row-end: 4;
207 | }
208 |           
209 |         
210 |
211 |
212 |

See the Pen CSS Grid Layout - Simple by Nataliya Karatkova on CodePen.

213 |
214 |
215 | 216 |
217 |
218 |

Грид-линии

219 |
220 |           .grid-element {
221 |   grid-column-start: 3;
222 |   grid-column-end: -1;
223 |   grid-row-start: 2;
224 |   grid-row-end: -1;
225 | }
226 |           
227 |         
228 |
229 |
230 |

See the Pen CSS Grid Layout - Simple2 by Nataliya Karatkova (@meuwka) on CodePen.

231 |
232 |
233 | 234 |
235 |
236 |

Грид-линии

237 |
238 |           .grid-element {
239 |   grid-column: 3 / 4;
240 |   grid-row: 2 / 4;
241 | }
242 |         
243 |
244 |
245 |

See the Pen CSS Grid Layout - Simple by Nataliya Karatkova on CodePen.

246 |
247 |
248 | 249 |
250 |
251 |

Грид-линии

252 |
253 |           .grid-element {
254 |   grid-column: 3;
255 |   grid-row: 2 / span 2;
256 | }
257 |         
258 |
259 |
260 |

See the Pen CSS Grid Layout - Simple by Nataliya Karatkova on CodePen.

261 |
262 |
263 | 264 |
265 |
266 |

Грид-область

267 |
268 |           .grid-element {
269 |   grid-area: 2 / 3 / 4 / 4;
270 | }
271 |         
272 |
273 |
274 |

See the Pen CSS Grid Layout - Simple by Nataliya Karatkova on CodePen.

275 |
276 |
277 | 278 |
279 |
280 |

Грид-область

281 |
282 |           .grid-element {
283 |   grid-area: 2 / 3 / 4 / 4;
284 | }
285 |         
286 |
287 |
288 |

289 |
290 |
291 |

    292 |
  1. grid-row-start
  2. 293 |
  3. grid-column-start
  4. 294 |
  5. grid-row-end
  6. 295 |
  7. grid-column-end
  8. 296 |
297 |

298 |
299 | Однако 300 |
301 | 302 |
303 |

Есть другой способ

304 |
305 |         .grid-element {
306 |   grid-area: any-name;
307 | }
308 |       
309 |
310 | 311 |
312 |

Шпаргалка

313 | 314 | 315 | 316 | 317 | 318 | 319 | 320 | 321 | 324 | 327 | 328 | 329 | 330 | 331 |
grid-column-startgrid-column-endgrid-row-startgrid-row-end
322 | grid-column 323 | 325 | grid-row 326 |
grid-area
332 |
333 | 334 |
335 | 336 |
337 | 338 |
339 |
340 |         <body>
341 |   <header> ... </header>
342 |   <main> ... </main>
343 |   <footer> ... </footer>
344 | </body>
345 |         
346 |       
347 |
348 | 349 |
350 |
351 |

Шaг 1 и 2

352 |
353 |     body {
354 |   display: grid;
355 |   grid-template-rows: auto
356 |                       1fr
357 |                       auto;
358 | }
359 |   
360 |
361 |
362 |

See the Pen CSS Grid Layout - Layout by Nataliya Karatkova on CodePen.

363 |
364 |
365 | 366 |
367 |

Шaг 3

368 |

Задаем шаблон областей

369 |
370 | 371 |
372 |
373 |
374 |   body {
375 |   display: grid;
376 |   grid-template-rows: auto
377 |                       1fr
378 |                       auto;
379 |   grid-template-areas: "header"
380 |                        "main"
381 |                        "footer";
382 | }
383 | 
384 | >
385 |
386 |

See the Pen CSS Grid Layout - Layout by Nataliya Karatkova on CodePen.

387 |
388 |
389 | 390 |
391 |

Шaг 4

392 |

Цепляем к сетке

393 |
394 | 395 |
396 |
397 |
398 |           header {
399 |   grid-area: header;
400 | }
401 | main {
402 |   grid-area: main;
403 | }
404 | footer {
405 |   grid-area: footer;
406 | }
407 |         
408 |
409 |
410 |

See the Pen CSS Grid Layout - Layout by Nataliya Karatkova on CodePen.

411 |
412 |
413 | 414 |
415 |

See the Pen CSS Grid Layout - Layout by Nataliya Karatkova on CodePen.

416 |
417 | 418 |
419 |
420 |     @media (min-width: 768px) {
421 |   body {
422 |     grid-template-columns: 1fr 2fr;
423 |     grid-template-rows: 1fr
424 |                         auto;
425 |     grid-template-areas: "header main"
426 |                          "footer main";
427 |   }
428 | }
429 |   
430 |
431 | 432 |
433 |

Классно, правда?

434 |
    435 |
  • интуитивно понятно
  • 436 |
  • легкая адаптация с помощью media-запросов
  • 437 |
  • порядок элементов в разметке может быть любой
  • 438 |
439 |
440 | 441 |
442 |

Грид-линии
можно именовать

443 |
444 | 445 |
446 |

Bootstrap (12 колонок)

447 | Bootstrap сетка 448 |
449 | 450 |
451 |
452 |         <div class="grid-container">
453 |   <div class="grid-element"></div>
454 |   <div class="grid-element"></div>
455 |   ...
456 |   <div class="grid-element"></div>
457 | </div>
458 |       
459 |
460 | 461 |
462 |
463 |     .grid-container {
464 |   display: grid;
465 |   grid-template-columns: repeat(12, [col] 1fr);
466 | }
467 |   
468 | Колонки 469 |
470 | 471 |
472 |
473 |         .grid-element:nth-child(2) {
474 |   grid-column: col 4;
475 | }
476 |       
477 |

See the Pen CSS Grid Layout - Named Grid Lines by Nataliya Karatkova (@meuwka) on CodePen.

478 |
479 | 480 |
481 |
482 |         .grid-element:nth-child(13) {
483 |   grid-column: span 8;
484 | }
485 |       
486 |

See the Pen CSS Grid Layout - Named Grid Lines by Nataliya Karatkova (@meuwka) on CodePen.

487 |
488 | 489 |
490 |
491 |         .grid-element:nth-child(13) {
492 |   grid-column: span 8;
493 |   grid-row: span 2;
494 | }
495 |       
496 |

See the Pen CSS Grid Layout - Named Grid Lines by Nataliya Karatkova (@meuwka) on CodePen.

497 |
498 | 499 |
500 |

Выравнивание

501 | 502 | 503 | 512 | 517 | 518 |
504 |

Грид-контейнер

505 |

506 | align-items 507 |

508 |

509 | justify-items 510 |

511 |
513 |

Грид-элемент

514 |

align-self

515 |

justify-self

516 |
519 |
520 | 521 |
522 |

Отступы

523 | 524 | 525 | 530 | 535 | 536 |
526 |

Автоматические

527 |

align-content

528 |

justify-content

529 |
531 |

Задаём вручную

532 |

grid-row-gap

533 |

grid-column-gap

534 |
537 |
538 | 539 |
540 |

Подсетки

541 |
542 |         .grid-element {
543 |   display: subgrid;
544 | }
545 |       
546 |

547 | Подсетки в Grid Layout жизненно важны 548 |

549 |
550 | 551 |
552 |

Подсетки

553 |

See the Pen CSS Grid Layout - 2 by Nataliya Karatkova on CodePen.

554 |
555 | 556 |
557 |

Экспериментируйте!

558 |
    559 |
  • обратная связь с разработчиками
  • 560 |
  • прототипы
  • 561 |
  • админки
  • 562 |
563 |
564 | 565 |
566 |

Больше примеров

567 | 572 |
573 | 574 |
575 |

Что почитать

576 | 582 |
583 | 584 |
585 |

Что посмотреть

586 | 598 |
599 | 600 |
601 |

Спасибо!

602 |

603 | Twitter: @meuwka 604 |
605 | Facebook: Nataliya Karatkova 606 |

607 | Презентация по ссылке: 608 |

bit.ly/css-grid-layout

609 | 610 |
611 | 612 |
613 | 614 | 615 | 616 | 617 | 618 | 619 | -------------------------------------------------------------------------------- /pictures/Eric-Meyer.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/Eric-Meyer.jpg -------------------------------------------------------------------------------- /pictures/Microsoft.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /pictures/bg-attach.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/bg-attach.jpg -------------------------------------------------------------------------------- /pictures/bg-browsers.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/bg-browsers.jpg -------------------------------------------------------------------------------- /pictures/bg-frameworks.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/bg-frameworks.jpg -------------------------------------------------------------------------------- /pictures/bootstrap-grid-cols.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/bootstrap-grid-cols.jpg -------------------------------------------------------------------------------- /pictures/bootstrap-grid.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/bootstrap-grid.jpg -------------------------------------------------------------------------------- /pictures/example.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/example.jpg -------------------------------------------------------------------------------- /pictures/flag.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /pictures/why.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/nataliyakarat/css-grid-layout/e454d27cddec95a902eef74ef2621a042038efcb/pictures/why.jpg -------------------------------------------------------------------------------- /shower/LICENSE.md: -------------------------------------------------------------------------------- 1 | # The MIT License 2 | 3 | Copyright © 2010–2015 Vadim Makeev, http://pepelsbey.net/ 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: 6 | 7 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. 8 | 9 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. 10 | 11 | --- 12 | 13 | # Лицензия MIT 14 | 15 | Copyright © 2010–2015 Вадим Макеев, http://pepelsbey.net/ 16 | 17 | Данная лицензия разрешает лицам, получившим копию данного программного обеспечения и сопутствующей документации (в дальнейшем именуемыми «Программное Обеспечение»), безвозмездно использовать Программное Обеспечение без ограничений, включая неограниченное право на использование, копирование, изменение, добавление, публикацию, распространение, сублицензирование и/или продажу копий Программного Обеспечения, также как и лицам, которым предоставляется данное Программное Обеспечение, при соблюдении следующих условий: 18 | 19 | Указанное выше уведомление об авторском праве и данные условия должны быть включены во все копии или значимые части данного Программного Обеспечения. 20 | 21 | ДАННОЕ ПРОГРАММНОЕ ОБЕСПЕЧЕНИЕ ПРЕДОСТАВЛЯЕТСЯ «КАК ЕСТЬ», БЕЗ КАКИХ-ЛИБО ГАРАНТИЙ, ЯВНО ВЫРАЖЕННЫХ ИЛИ ПОДРАЗУМЕВАЕМЫХ, ВКЛЮЧАЯ, НО НЕ ОГРАНИЧИВАЯСЬ ГАРАНТИЯМИ ТОВАРНОЙ ПРИГОДНОСТИ, СООТВЕТСТВИЯ ПО ЕГО КОНКРЕТНОМУ НАЗНАЧЕНИЮ И ОТСУТСТВИЯ НАРУШЕНИЙ ПРАВ. НИ В КАКОМ СЛУЧАЕ АВТОРЫ ИЛИ ПРАВООБЛАДАТЕЛИ НЕ НЕСУТ ОТВЕТСТВЕННОСТИ ПО ИСКАМ О ВОЗМЕЩЕНИИ УЩЕРБА, УБЫТКОВ ИЛИ ДРУГИХ ТРЕБОВАНИЙ ПО ДЕЙСТВУЮЩИМ КОНТРАКТАМ, ДЕЛИКТАМ ИЛИ ИНОМУ, ВОЗНИКШИМ ИЗ, ИМЕЮЩИМ ПРИЧИНОЙ ИЛИ СВЯЗАННЫМ С ПРОГРАММНЫМ ОБЕСПЕЧЕНИЕМ ИЛИ ИСПОЛЬЗОВАНИЕМ ПРОГРАММНОГО ОБЕСПЕЧЕНИЯ ИЛИ ИНЫМИ ДЕЙСТВИЯМИ С ПРОГРАММНЫМ ОБЕСПЕЧЕНИЕМ. 22 | -------------------------------------------------------------------------------- /shower/README.md: -------------------------------------------------------------------------------- 1 | # Core for Shower [![Build Status](https://travis-ci.org/shower/core.svg?branch=master)](https://travis-ci.org/shower/core) 2 | 3 | Core for the [Shower](https://github.com/shower/shower/) presentation engine. Doesn’t include themes. [See it in action](http://shwr.me/). Follow [@shower_me](https://twitter.com/shower_me) for support and updates, [file an issue](https://github.com/shower/shower/issues/new) if you have any. 4 | 5 | ## Usage 6 | 7 | Get the [Shower template](https://github.com/shower/shower/) where core is already included. Download the template [archive](http://shwr.me/shower.zip) or install the package: 8 | 9 | npm install shower 10 | 11 | You can also install core as a separate package: 12 | 13 | npm install shower-core 14 | 15 | ## Development 16 | 17 | To take part in core development please read [contributing guidelines](CONTRIBUTING.md) first and [file an issue](https://github.com/shower/shower/issues/new) before sending any pull request. 18 | 19 | --- 20 | Licensed under [MIT License](LICENSE.md). 21 | -------------------------------------------------------------------------------- /shower/screen-16x10.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Material theme for Shower HTML presentation engine 3 | * shower-material v1.0.0, https://github.com/shower/material 4 | * @copyright 2010–2016 Vadim Makeev, http://pepelsbey.net/ 5 | * @license MIT 6 | */ 7 | 8 | @charset "UTF-8"; 9 | .slide.black:after, 10 | .slide.white:after { 11 | visibility: hidden 12 | } 13 | 14 | @font-face { 15 | font-family: Roboto; 16 | src: url(../fonts/roboto-regular.woff) format("woff") 17 | } 18 | 19 | @font-face { 20 | font-weight: 700; 21 | font-family: Roboto; 22 | src: url(../fonts/roboto-bold.woff) format("woff") 23 | } 24 | 25 | @font-face { 26 | font-style: italic; 27 | font-family: Roboto; 28 | src: url(../fonts/roboto-italic.woff) format("woff") 29 | } 30 | 31 | @font-face { 32 | font-style: italic; 33 | font-weight: 700; 34 | font-family: Roboto; 35 | src: url(../fonts/roboto-bold-italic.woff) format("woff") 36 | } 37 | 38 | @font-face { 39 | font-family: Roboto Light; 40 | src: url(../fonts/roboto-light.woff) format("woff") 41 | } 42 | 43 | @font-face { 44 | font-family: Roboto Mono; 45 | src: url(../fonts/roboto-mono-regular.woff) format("woff") 46 | } 47 | 48 | *, 49 | :after, 50 | :before { 51 | box-sizing: border-box 52 | } 53 | 54 | a, 55 | abbr, 56 | acronym, 57 | address, 58 | applet, 59 | article, 60 | aside, 61 | audio, 62 | b, 63 | big, 64 | blockquote, 65 | body, 66 | canvas, 67 | caption, 68 | center, 69 | cite, 70 | code, 71 | dd, 72 | del, 73 | details, 74 | dfn, 75 | div, 76 | dl, 77 | dt, 78 | em, 79 | embed, 80 | fieldset, 81 | figcaption, 82 | figure, 83 | footer, 84 | form, 85 | h1, 86 | h2, 87 | h3, 88 | h4, 89 | h5, 90 | h6, 91 | header, 92 | hgroup, 93 | html, 94 | i, 95 | iframe, 96 | img, 97 | ins, 98 | kbd, 99 | label, 100 | legend, 101 | li, 102 | mark, 103 | menu, 104 | nav, 105 | object, 106 | ol, 107 | output, 108 | p, 109 | pre, 110 | q, 111 | ruby, 112 | s, 113 | samp, 114 | section, 115 | small, 116 | span, 117 | strike, 118 | strong, 119 | sub, 120 | summary, 121 | sup, 122 | table, 123 | tbody, 124 | td, 125 | tfoot, 126 | th, 127 | thead, 128 | time, 129 | tr, 130 | tt, 131 | u, 132 | ul, 133 | var, 134 | video { 135 | margin: 0; 136 | padding: 0; 137 | border: 0; 138 | font: inherit; 139 | vertical-align: baseline 140 | } 141 | 142 | .shower, 143 | body { 144 | line-height: 1 145 | } 146 | 147 | article, 148 | aside, 149 | details, 150 | figcaption, 151 | figure, 152 | footer, 153 | header, 154 | hgroup, 155 | main, 156 | menu, 157 | nav, 158 | section { 159 | display: block 160 | } 161 | 162 | .caption, 163 | .slide.first:after { 164 | display: none 165 | } 166 | 167 | ol, 168 | ul { 169 | list-style: none 170 | } 171 | 172 | blockquote, 173 | q { 174 | quotes: none 175 | } 176 | 177 | blockquote:after, 178 | blockquote:before, 179 | q:after, 180 | q:before { 181 | content: ''; 182 | content: none 183 | } 184 | 185 | table { 186 | border-collapse: collapse; 187 | border-spacing: 0 188 | } 189 | 190 | a { 191 | text-decoration: none 192 | } 193 | 194 | @page { 195 | margin: 0; 196 | size: 1024px 640px 197 | } 198 | 199 | .shower { 200 | color: #212121; 201 | counter-reset: slide; 202 | font-family: Roboto, sans-serif; 203 | -webkit-print-color-adjust: exact; 204 | -webkit-text-size-adjust: none; 205 | -moz-text-size-adjust: none; 206 | -ms-text-size-adjust: none 207 | } 208 | 209 | @media print { 210 | .shower { 211 | text-rendering: geometricPrecision 212 | } 213 | } 214 | 215 | .caption { 216 | font-size: 24px; 217 | margin-bottom: 1em; 218 | padding: 1.02em 0 .9em 1em; 219 | width: 100% 220 | } 221 | 222 | @media (min-width:1168px) { 223 | .caption { 224 | font-size: 48px 225 | } 226 | } 227 | 228 | @media (min-width:2336px) { 229 | .caption { 230 | font-size: 96px 231 | } 232 | } 233 | 234 | .caption h1 { 235 | padding-bottom: .28em; 236 | font: 1em/1 Roboto Light, sans-serif 237 | } 238 | 239 | .caption .author { 240 | font: .5em/1 Roboto Light, sans-serif 241 | } 242 | 243 | .slide { 244 | position: relative; 245 | z-index: 1; 246 | overflow: hidden; 247 | padding: 104px 92px 0 96px; 248 | width: 1024px; 249 | height: 640px; 250 | background: #fff; 251 | line-height: 2; 252 | font-size: 26px 253 | } 254 | 255 | /* 256 | .slide:after { 257 | position: absolute; 258 | left: 96px; 259 | bottom: 48px; 260 | color: #bdbdbd; 261 | counter-increment: slide; 262 | content: counter(slide) 263 | }*/ 264 | 265 | .slide.first { 266 | padding-left: 126px 267 | } 268 | 269 | .slide h2 { 270 | margin-bottom: 32px; 271 | font: 68px/1.5 Roboto, sans-serif 272 | } 273 | 274 | .slide h2.colored { 275 | color: #dd4743; 276 | } 277 | 278 | .slide h3 { 279 | font: 42px/1.5 Roboto, sans-serif; 280 | } 281 | 282 | .slide blockquote, 283 | .slide dfn, 284 | .slide em, 285 | .slide i { 286 | font-style: italic 287 | } 288 | 289 | .slide b, 290 | .slide strong, 291 | .slide table th { 292 | font-weight: 700 293 | } 294 | 295 | .slide p { 296 | margin-bottom: 1em 297 | } 298 | 299 | .slide a { 300 | background: -webkit-linear-gradient(bottom, currentColor .09em, transparent .09em) repeat-x; 301 | background: linear-gradient(to top, currentColor .09em, transparent .09em) repeat-x; 302 | color: #dd4743 303 | } 304 | 305 | .slide code, 306 | .slide kbd, 307 | .slide mark, 308 | .slide samp { 309 | padding: .1em .3em; 310 | background: #dededf 311 | } 312 | 313 | .slide code, 314 | .slide kbd, 315 | .slide samp { 316 | line-height: 1; 317 | font-family: Roboto Mono, monospace, monospace 318 | } 319 | 320 | .slide sub, 321 | .slide sup { 322 | position: relative; 323 | line-height: 0; 324 | font-size: 75% 325 | } 326 | 327 | .slide sub { 328 | bottom: -.25em 329 | } 330 | 331 | .slide sup { 332 | top: -.5em 333 | } 334 | 335 | .slide blockquote:before { 336 | position: absolute; 337 | margin: -.04em 0 0 -.4em; 338 | line-height: 1; 339 | font-style: normal; 340 | font-size: 7em; 341 | content: '\201D' 342 | } 343 | 344 | .slide blockquote+figcaption { 345 | margin: -1em 0 1em; 346 | font-style: italic; 347 | font-weight: 700 348 | } 349 | 350 | .slide ol, 351 | .slide ul { 352 | margin-bottom: 1em; 353 | counter-reset: list 354 | } 355 | 356 | .slide ol li, 357 | .slide ul li { 358 | page-break-inside: avoid; 359 | text-indent: -2em 360 | } 361 | 362 | .slide ol li:before, 363 | .slide ul li:before { 364 | display: inline-block; 365 | width: 2em; 366 | text-align: right 367 | } 368 | 369 | .slide ol ol, 370 | .slide ol ul, 371 | .slide ul ol, 372 | .slide ul ul { 373 | margin-bottom: 0; 374 | margin-left: 2em 375 | } 376 | 377 | .slide ul>li:before { 378 | padding-right: .5em; 379 | content: '•' 380 | } 381 | 382 | .slide ul>li:lang(ru):before { 383 | content: '—' 384 | } 385 | 386 | .slide ol>li:before { 387 | padding-right: .4em; 388 | counter-increment: list; 389 | content: counter(list) "." 390 | } 391 | 392 | .slide table { 393 | margin-left: -96px; 394 | margin-bottom: 1em; 395 | width: calc(100% + 96px + 112px) 396 | } 397 | 398 | .slide table td:first-child, 399 | .slide table th:first-child { 400 | padding-left: 96px 401 | } 402 | 403 | .slide table td:last-child, 404 | .slide table th:last-child { 405 | padding-right: 96px 406 | } 407 | 408 | .slide table th { 409 | text-align: left 410 | } 411 | 412 | .slide table tr:not(:last-of-type)>* { 413 | background: -webkit-linear-gradient(bottom, #bdbdbd .07em, transparent .07em) repeat-x; 414 | background: linear-gradient(to top, #bdbdbd .07em, transparent .07em) repeat-x 415 | } 416 | 417 | .slide table.striped tr:nth-child(even) { 418 | background: #eeefef 419 | } 420 | 421 | .slide table.striped tr>* { 422 | background-image: none 423 | } 424 | 425 | .slide .browsers th { 426 | width: 300px 427 | } 428 | 429 | .slide pre { 430 | margin-bottom: 1em; 431 | counter-reset: code; 432 | white-space: normal 433 | } 434 | 435 | .slide pre code { 436 | display: block; 437 | margin-left: -96px; 438 | padding: 0 0 0 96px; 439 | width: calc(100% + 96px + 112px); 440 | background: 0 0; 441 | line-height: 2; 442 | white-space: pre; 443 | -moz-tab-size: 4; 444 | -o-tab-size: 4; 445 | tab-size: 4 446 | } 447 | 448 | .slide pre code:not(:only-child).mark { 449 | background: #eeefef 450 | } 451 | 452 | .slide pre code:not(:only-child):before { 453 | position: absolute; 454 | margin-left: -2em; 455 | color: #bdbdbd; 456 | counter-increment: code; 457 | content: counter(code, decimal-leading-zero) "." 458 | } 459 | 460 | .slide pre mark { 461 | position: relative; 462 | z-index: -1; 463 | margin: 0 -.3em 464 | } 465 | 466 | .slide .shout, 467 | .slide footer { 468 | z-index: 1; 469 | position: absolute; 470 | left: 0 471 | } 472 | 473 | .slide pre mark.important { 474 | background: #585A5E; 475 | color: #fff 476 | } 477 | 478 | .slide pre mark.comment { 479 | margin: 0; 480 | padding: 0; 481 | background: 0 0; 482 | color: #9e9e9e 483 | } 484 | 485 | .slide footer { 486 | right: 0; 487 | bottom: -640px; 488 | display: none; 489 | padding: 2em 112px 1em 96px; 490 | background: #eeefef; 491 | -webkit-transition: bottom .3s; 492 | transition: bottom .3s 493 | } 494 | 495 | .slide:hover>footer { 496 | bottom: 0 497 | } 498 | 499 | .slide.grid { 500 | background-image: url(../images/grid.png); 501 | -ms-interpolation-mode: nearest-neighbor; 502 | image-rendering: -webkit-optimize-contrast; 503 | image-rendering: -moz-crisp-edges; 504 | image-rendering: pixelated 505 | } 506 | 507 | @media (-webkit-min-device-pixel-ratio:2), 508 | (min-resolution:2dppx) { 509 | .slide.grid { 510 | background-image: url(../images/grid@2x.png); 511 | background-size: 1024px auto 512 | } 513 | } 514 | 515 | .slide.black { 516 | background-color: #000 517 | } 518 | 519 | .slide.white { 520 | background-color: #fff 521 | } 522 | 523 | .slide .double { 524 | -webkit-columns: 2; 525 | -moz-columns: 2; 526 | columns: 2; 527 | -webkit-column-gap: 75px; 528 | -moz-column-gap: 75px; 529 | column-gap: 75px 530 | } 531 | 532 | .slide .shout { 533 | top: 50%; 534 | padding-left: 96px; 535 | width: 100%; 536 | color: #fff; 537 | line-height: 1.1; 538 | font-size: 112px; 539 | -webkit-transform: translateY(-50%); 540 | transform: translateY(-50%) 541 | } 542 | 543 | .slide .shout a { 544 | background: -webkit-linear-gradient(bottom, currentColor .06em, transparent .06em) repeat-x; 545 | background: linear-gradient(to top, currentColor .06em, transparent .06em) repeat-x; 546 | color: inherit 547 | } 548 | 549 | .slide .shout:after { 550 | position: absolute; 551 | top: -300%; 552 | right: 0; 553 | bottom: -300%; 554 | left: 0; 555 | z-index: -1; 556 | background: -webkit-linear-gradient(315deg, #585A5E 50%, #4f5155 50%) no-repeat #585A5E; 557 | background: linear-gradient(135deg, #585A5E 50%, #4f5155 50%) no-repeat #585A5E; 558 | content: '' 559 | } 560 | 561 | .slide .cover, 562 | .slide .place { 563 | top: 50%; 564 | left: 50%; 565 | position: absolute 566 | } 567 | 568 | .slide .cover { 569 | z-index: -1; 570 | -webkit-transform: translate(-50%, -50%); 571 | transform: translate(-50%, -50%); 572 | max-width: 100%; 573 | max-height: 100% 574 | } 575 | 576 | .slide .cover.w, 577 | .slide .cover.width { 578 | width: 100%; 579 | max-height: none 580 | } 581 | 582 | .slide .cover.h, 583 | .slide .cover.height { 584 | height: 100%; 585 | max-width: none 586 | } 587 | 588 | .slide .cover+figcaption { 589 | position: absolute; 590 | bottom: 20px; 591 | right: 10px; 592 | font-size: 12px; 593 | opacity: .7; 594 | -webkit-transform-origin: 0 100%; 595 | transform-origin: 0 100%; 596 | -webkit-transform: translateX(100%) rotate(-90deg); 597 | transform: translateX(100%) rotate(-90deg) 598 | } 599 | 600 | .slide .cover+figcaption.white { 601 | color: #fff 602 | } 603 | 604 | .slide .cover+figcaption a { 605 | color: currentcolor 606 | } 607 | 608 | .slide .place { 609 | -webkit-transform: translate(-50%, -50%); 610 | transform: translate(-50%, -50%) 611 | } 612 | 613 | .slide .place.b.l, 614 | .slide .place.b.r, 615 | .slide .place.bottom.left, 616 | .slide .place.bottom.right, 617 | .slide .place.t.l, 618 | .slide .place.t.r, 619 | .slide .place.top.left, 620 | .slide .place.top.right { 621 | -webkit-transform: none; 622 | transform: none 623 | } 624 | 625 | .slide .place.b, 626 | .slide .place.bottom, 627 | .slide .place.t, 628 | .slide .place.top { 629 | -webkit-transform: translate(-50%, 0); 630 | transform: translate(-50%, 0) 631 | } 632 | 633 | .slide .place.l, 634 | .slide .place.left, 635 | .slide .place.r, 636 | .slide .place.right { 637 | -webkit-transform: translate(0, -50%); 638 | transform: translate(0, -50%) 639 | } 640 | 641 | .slide .place.t, 642 | .slide .place.t.r, 643 | .slide .place.top, 644 | .slide .place.top.left, 645 | .slide .place.top.right { 646 | top: 0 647 | } 648 | 649 | .slide .place.r, 650 | .slide .place.right { 651 | right: 0; 652 | left: auto 653 | } 654 | 655 | .slide .place.b, 656 | .slide .place.b.l, 657 | .slide .place.b.r, 658 | .slide .place.bottom, 659 | .slide .place.bottom.left, 660 | .slide .place.bottom.right { 661 | top: auto; 662 | bottom: 0 663 | } 664 | 665 | .slide .place.l, 666 | .slide .place.left { 667 | left: 0 668 | } 669 | 670 | .progress { 671 | position: absolute; 672 | bottom: 0; 673 | left: 0; 674 | z-index: 1; 675 | display: none; 676 | height: 8px; 677 | background: #dd4743; 678 | -webkit-transition: width .2s linear; 679 | transition: width .2s linear; 680 | clip: rect(0 1024px 8px 0); 681 | box-shadow: 512px 0 0 512px #bdbdbd 682 | } 683 | 684 | .badge { 685 | font-size: 12px; 686 | width: 100% 687 | } 688 | 689 | @media (min-width:1168px) { 690 | .badge { 691 | font-size: 24px 692 | } 693 | } 694 | 695 | @media (min-width:2336px) { 696 | .badge { 697 | font-size: 48px 698 | } 699 | } 700 | 701 | .badge a { 702 | display: block; 703 | margin-left: 8.5em; 704 | padding: 1.1em 0 0 4.2em; 705 | width: 9em; 706 | height: 4em; 707 | background: url("data:image/svg+xml;charset=utf8,%3Csvg fill='%239e9e9e' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20.597 23.153'%3E%3Cpath d='M6.823 23.15c.45-.07.574-.398.574-.715v-2.6c-4.2.9-5.1-2-5.1-2-.7-1.7-1.7-2.2-1.7-2.2-1.4-.9.1-.9.1-.9 1.5.1 2.3 1.5 2.3 1.5 1.3 2.3 3.5 1.6 4.4 1.2.1-1 .5-1.6 1-2-3.3-.4-6.8-1.7-6.8-7.4 0-1.6.6-3 1.5-4-.2-.4-.7-1.9.1-4 0 0 1.3-.4 4.1 1.5 1.2-.3 2.5-.5 3.8-.5s2.6.2 3.8.5c2.9-1.9 4.1-1.5 4.1-1.5.8 2.1.3 3.6.1 4 1 1 1.5 2.4 1.5 4 0 5.8-3.5 7-6.8 7.4.5.5 1 1.4 1 2.8v4.1c0 .29.16.695.515.818l-8.49-.002z'/%3E%3C/svg%3E") no-repeat; 708 | color: #9e9e9e 709 | } 710 | 711 | .slide blockquote:before, 712 | .slide ol li:before, 713 | .slide ul li:before { 714 | color: #dd4743 715 | } 716 | 717 | .region { 718 | display: none 719 | } 720 | 721 | @media screen { 722 | .shower.list { 723 | width: 100%; 724 | display: -webkit-box; 725 | display: -webkit-flex; 726 | display: -ms-flexbox; 727 | display: flex; 728 | -webkit-flex-wrap: wrap; 729 | -ms-flex-wrap: wrap; 730 | flex-wrap: wrap; 731 | background: #EEE; 732 | position: absolute; 733 | clip: rect(0, auto, auto, 0) 734 | } 735 | .shower.list .caption { 736 | display: block 737 | } 738 | .shower.list .slide { 739 | -webkit-transform-origin: 0 0; 740 | transform-origin: 0 0; 741 | margin: 0 -768px -456px 24px; 742 | -webkit-transform: scale(.25); 743 | transform: scale(.25) 744 | } 745 | .shower.list .slide:hover { 746 | box-shadow: 0 0 0 12px #747476 747 | } 748 | .shower.list .slide:target { 749 | box-shadow: 0 0 0 12px #dd4743 750 | } 751 | } 752 | 753 | .title-box, 754 | .title-box-small { 755 | position: absolute; 756 | display: block 757 | } 758 | 759 | @media screen and (min-width:1168px) { 760 | .shower.list .slide { 761 | margin: 0 -512px -272px 48px; 762 | -webkit-transform: scale(.5); 763 | transform: scale(.5) 764 | } 765 | .shower.list .slide:hover { 766 | box-shadow: 0 0 0 12px #747476 767 | } 768 | .shower.list .slide:target { 769 | box-shadow: 0 0 0 12px #dd4743 770 | } 771 | } 772 | 773 | @media screen and (min-width:2336px) { 774 | .shower.list .slide { 775 | margin: 0 0 96px 96px; 776 | -webkit-transform: scale(1); 777 | transform: scale(1) 778 | } 779 | .shower.list .slide:hover { 780 | box-shadow: 0 0 0 12px #747476 781 | } 782 | .shower.list .slide:target { 783 | box-shadow: 0 0 0 12px #dd4743 784 | } 785 | } 786 | 787 | @media screen { 788 | .shower.full, 789 | .shower.full .region { 790 | position: absolute; 791 | overflow: hidden 792 | } 793 | .shower.full .progress, 794 | .shower.list .badge, 795 | .shower.list .slide footer { 796 | display: block 797 | } 798 | .shower.list .slide * { 799 | pointer-events: none 800 | } 801 | .shower.full { 802 | top: 50%; 803 | left: 50%; 804 | margin: -320px 0 0 -512px; 805 | width: 1024px; 806 | height: 640px; 807 | background: #000 808 | } 809 | .shower.full .slide { 810 | position: absolute; 811 | top: 0; 812 | left: 0; 813 | margin-left: 150%; 814 | visibility: hidden 815 | } 816 | .shower.full .slide:target { 817 | margin: 0; 818 | visibility: visible 819 | } 820 | .shower.full .slide pre code:not(:only-child).mark.next { 821 | visibility: visible; 822 | background: 0 0 823 | } 824 | .shower.full .slide pre code:not(:only-child).mark.next.active { 825 | background: #eeefef 826 | } 827 | .shower.full .slide .next { 828 | visibility: hidden 829 | } 830 | .shower.full .slide .next.active { 831 | visibility: visible 832 | } 833 | .shower.full .slide .shout:after { 834 | background-position: 1024px 0; 835 | -webkit-transition: background-position .4s ease-out; 836 | transition: background-position .4s ease-out 837 | } 838 | .shower.full .slide:target .shout:after { 839 | background-position: 0 0 840 | } 841 | .shower.full .region { 842 | clip: rect(0 0 0 0); 843 | margin: -1px; 844 | padding: 0; 845 | width: 1px; 846 | height: 1px; 847 | border: none; 848 | display: block 849 | } 850 | } 851 | 852 | .caniuse { 853 | background: #f2e8d5 854 | } 855 | 856 | .css-small { 857 | font-size: 20px 858 | } 859 | 860 | .slide .code-clean { 861 | background: 0 0 862 | } 863 | 864 | .slide-left { 865 | float: left; 866 | width: 60% 867 | } 868 | 869 | .slide-right { 870 | float: right; 871 | width: 40% 872 | } 873 | 874 | .slide code { 875 | background: #eddbb4 876 | } 877 | 878 | .slide h2 code { 879 | background: 0 0 880 | } 881 | 882 | .subtitle { 883 | padding-top: 100px; 884 | } 885 | 886 | .text-center { 887 | text-align: center 888 | } 889 | 890 | .slide .table-area { 891 | text-align: center; 892 | font-size: 20px; 893 | margin-left: 0; 894 | width: 100% 895 | } 896 | 897 | .table-area td { 898 | padding: 10px 5px!important; 899 | border: 2px solid gray; 900 | background: 0 0!important 901 | } 902 | -------------------------------------------------------------------------------- /shower/shower.min.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Core for Shower HTML presentation engine 3 | * shower-core v2.0.1, https://github.com/shower/core 4 | * @copyright 2010–2015 Vadim Makeev, http://pepelsbey.net/ 5 | * @license MIT 6 | */ 7 | !function(a){var b,c={NOT_RESOLVED:"NOT_RESOLVED",IN_RESOLVING:"IN_RESOLVING",RESOLVED:"RESOLVED"},d=function(){var l={trackCircularDependencies:!0,allowMultipleDeclarations:!0},m={},n=!1,o=[],p=function(a,d,e){e||(e=d,d=[]);var f=m[a];f||(f=m[a]={name:a,decl:b}),f.decl={name:a,prev:f.decl,fn:e,state:c.NOT_RESOLVED,deps:d,dependents:[],exports:b}},q=function(b,c,d){"string"==typeof b&&(b=[b]),n||(n=!0,k(v)),o.push({deps:b,cb:function(b,f){f?(d||e)(f):c.apply(a,b)}})},r=function(a){var b=m[a];return b?c[b.decl.state]:"NOT_DEFINED"},s=function(a){return!!m[a]},t=function(a){for(var b in a)a.hasOwnProperty(b)&&(l[b]=a[b])},u=function(){var a,b={};for(var c in m)m.hasOwnProperty(c)&&(a=m[c],(b[a.decl.state]||(b[a.decl.state]=[])).push(c));return b},v=function(){n=!1,w()},w=function(){var a,b=o,c=0;for(o=[];a=b[c++];)x(null,a.deps,[],a.cb)},x=function(a,b,c,d){var e=b.length;e||d([]);for(var g,h,i=[],j=function(a,b){if(b)return void d(null,b);if(!--e){for(var c,f=[],g=0;c=i[g++];)f.push(c.exports);d(f)}},k=0,l=e;l>k;){if(g=b[k++],"string"==typeof g){if(!m[g])return void d(null,f(g,a));h=m[g].decl}else h=g;i.push(h),y(h,c,j)}},y=function(b,d,e){if(b.state===c.RESOLVED)return void e(b.exports);if(b.state===c.IN_RESOLVING)return void(l.trackCircularDependencies&&j(b,d)?e(null,g(b,d)):b.dependents.push(e));if(b.dependents.push(e),b.prev&&!l.allowMultipleDeclarations)return void A(b,i(b));l.trackCircularDependencies&&(d=d.slice()).push(b);var f=!1,k=b.prev?b.deps.concat([b.prev]):b.deps;b.state=c.IN_RESOLVING,x(b,k,d,function(c,d){return d?void A(b,d):(c.unshift(function(a,c){return f?void e(null,h(b)):(f=!0,void(c?A(b,c):z(b,a)))}),void b.fn.apply({name:b.name,deps:b.deps,global:a},c))})},z=function(a,d){a.exports=d,a.state=c.RESOLVED;for(var e,f=0;e=a.dependents[f++];)e(d);a.dependents=b},A=function(a,b){a.state=c.NOT_RESOLVED;for(var d,e=0;d=a.dependents[e++];)d(null,b);a.dependents=[]};return{create:d,define:p,require:q,getState:r,isDefined:s,setOptions:t,getStat:u}},e=function(a){k(function(){throw a})},f=function(a,b){return Error(b?'Module "'+b.name+'": can\'t resolve dependence "'+a+'"':'Required module "'+a+"\" can't be resolved")},g=function(a,b){for(var c,d=[],e=0;c=b[e++];)d.push(c.name);return d.push(a.name),Error('Circular dependence has been detected: "'+d.join(" -> ")+'"')},h=function(a){return Error('Declaration of module "'+a.name+'" has already been provided')},i=function(a){return Error('Multiple declarations of module "'+a.name+'" have been detected')},j=function(a,b){for(var c,d=0;c=b[d++];)if(a===c)return!0;return!1},k=function(){var b=[],c=function(a){return 1===b.push(a)},d=function(){var a=b,c=0,d=b.length;for(b=[];d>c;)a[c++]()};if("object"==typeof process&&process.nextTick)return function(a){c(a)&&process.nextTick(d)};if(a.setImmediate)return function(b){c(b)&&a.setImmediate(d)};if(a.postMessage&&!a.opera){var e=!0;if(a.attachEvent){var f=function(){e=!1};a.attachEvent("onmessage",f),a.postMessage("__checkAsync","*"),a.detachEvent("onmessage",f)}if(e){var g="__modules"+ +new Date,h=function(a){a.data===g&&(a.stopPropagation&&a.stopPropagation(),d())};return a.addEventListener?a.addEventListener("message",h,!0):a.attachEvent("onmessage",h),function(b){c(b)&&a.postMessage(g,"*")}}}var i=a.document;if("onreadystatechange"in i.createElement("script")){var j=i.getElementsByTagName("head")[0],k=function(){var a=i.createElement("script");a.onreadystatechange=function(){a.parentNode.removeChild(a),a=a.onreadystatechange=null,d()},j.appendChild(a)};return function(a){c(a)&&k()}}return function(a){c(a)&&setTimeout(d,0)}}();"object"==typeof exports?module.exports=d():a.modules=d()}("undefined"!=typeof window?window:global),function(a){function b(a,b){return a.dataset?a.dataset[b]:a.getAttribute("data-"+b)}var c=["debug-mode","slides-selector","hotkeys"];a.shower={modules:modules.create(),options:a.showerOptions||{}},document.addEventListener("DOMContentLoaded",function(){a.shower.modules.require("shower.defaultOptions",function(d){var e=a.hasOwnProperty("showerOptions"),f=a.shower.options,g=f.shower_selector||d.container_selector,h=document.querySelector(g),i=b.bind(this,h),j="undefined"!=typeof f.auto_init?f.auto_init:!0;if(!h)throw new Error("Shower element with selector "+g+" not found.");("false"!==i("auto-init")||e&&j)&&(e||c.forEach(function(a){var b=i(a);null!==b&&"undefined"!=typeof b&&(f[a.replace(/-/g,"_")]=b)}),a.shower.modules.require(["shower"],function(a){a.init({container:h,options:f})}))})},!1)}(window),shower.modules.define("shower",["shower.global"],function(a,b){a(b)}),shower.modules.define("Emitter",["emitter.Event","emitter.EventGroup","util.extend"],function(a,b,c,d){function e(a){a=a||{},this._context=a.context,this._parent=a.parent,this._listeners={}}function f(a,b){return a.priority-b.priority}d(e.prototype,{on:function(a,b,c,d){if("undefined"==typeof b)throw new Error("Callback is not defined.");if(d=d||0,"string"==typeof a)this._addListener(a,b,c,d);else for(var e=0,f=a.length;f>e;e++)this._addListener(a[e],b,c,d);return this},off:function(a,b,c,d){if(d=d||0,"string"==typeof a)this._removeListener(a,b,c,d);else for(var e=0,f=a.length;f>e;e++)this._removeListener(a[e],b,c,d);return this},once:function(a,b,c,d){var e=function(f){this.off(a,e,this,d),c?b.call(c,f):b(f)};return this.on(a,e,this,d),this},emit:function(a,b){var c=b,d=this._listeners;c&&"function"==typeof c.get||(c=this.createEventObject(a,b,this._context)),c.isPropagationStopped()||(d.hasOwnProperty(a)&&this._callListeners(d[a],c),this._parent&&!c.isPropagationStopped()&&this._parent.emit(a,c))},createEventObject:function(a,c,e){var f={target:e,type:a};return new b(c?d(f,c):f)},setParent:function(a){this._parent!=a&&(this._parent=a)},getParent:function(){return this._parent},group:function(){return new c(this)},_addListener:function(a,b,c,d){var e={callback:b,context:c,priority:d};this._listeners[a]?this._listeners[a].push(e):this._listeners[a]=[e]},_removeListener:function(a,b,c,d){var e,f=this._listeners[a];if(f){for(var g=-1,h=0,i=f.length;i>h;h++)e=f[h],e.callback==b&&e.context==c&&e.priority==d&&(g=h);-1!=g&&(1==f.length?this._clearType(a):f.splice(g,1))}},_clearType:function(a){this._listeners.hasOwnProperty(a)&&delete this._listeners[a]},_callListeners:function(a,b){var c=a.length-1;for(a.sort(f);c>=0&&!b.defaultPrevented();){var d=a[c];d&&(d.context?d.callback.call(d.context,b):d.callback(b)),c--}}}),a(e)}),shower.modules.define("emitter.Event",["util.extend"],function(a,b){function c(a){this._data=a,this._preventDefault=!1,this._stopPropagation=!1}b(c.prototype,{get:function(a){return this._data[a]},preventDefault:function(){return this._preventDefault=!0,this._preventDefault},defaultPrevented:function(){return this._preventDefault},stopPropagation:function(){return this._stopPropagation=!0,this._stopPropagation},isPropagationStopped:function(){return this._stopPropagation}}),a(c)}),shower.modules.define("emitter.EventGroup",["util.extend"],function(a,b){function c(a){this.events=a,this._listeners=[]}b(c.prototype,{on:function(a,b,c){if(Array.isArray(a))for(var d=0,e=a.length;e>d;d++)this._listeners.push(a[d],b,c);else this._listeners.push(a,b,c);return this.events.on(a,b,c),this},off:function(a,b,c){if(Array.isArray(a))for(var d=0,e=a.length;e>d;d++)this._removeListener(a[d],b,c);else this._removeListener(a,b,c);return this},offAll:function(){for(var a=0,b=this._listeners.length;b>a;a+=3)this.events.off(this._listeners[a],this._listeners[a+1],this._listeners[a+2]);return this._listeners.length=0,this},_removeListener:function(a,b,c){for(var d=this._listeners.indexOf(a,0);-1!=d;)this._listeners[d+1]==b&&this._listeners[d+2]==c&&(this._listeners.splice(d,3),this.events.off(a,b,c)),d=this._listeners.indexOf(a,d)}}),a(c)}),shower.modules.define("Plugins",["Emitter","util.bind","util.extend"],function(a,b,c,d){function e(a){this.events=new b({context:this}),this._showerGlobal=a,this._showerInstances=a.getInited(),this._plugins={},this._instances=[],a.events.on("init",this._onShowerInit,this)}d(e.prototype,{destroy:function(){this._showerGlobal.events.off("init",this._onShowerInit,this),this._plugins=null},add:function(a,b){if(this._plugins.hasOwnProperty(a))throw new Error("Plugin "+a+" already exist.");return this._requireAndAdd({name:a,options:b}),this},remove:function(a){if(!this._plugins.hasOwnProperty(a))throw new Error("Plugin "+a+" not found.");return delete this._plugins[a],this.events.emit("remove",{name:a}),this},get:function(a,b){var c,d=this._plugins[a];if(d&&b)for(var e=0,f=this._instances.length;f>e;e++){var g=this._instances[e];g.plugin.name===a&&g.shower===b&&(c=g.instance)}return c},_requireAndAdd:function(a){shower.modules.require(a.name,function(b){a["class"]=b,this._plugins[a.name]=a,this._instancePlugin(a)}.bind(this))},_instancePlugin:function(a){this._showerInstances.forEach(function(b){this._instance(a,b)},this),this.events.emit("add",{name:a.name})},_instanceFor:function(a){for(var b in this._plugins)this._plugins.hasOwnProperty(b)&&this._instance(this._plugins[b],a)},_instance:function(a,b){var c=a.options||b.options.get("plugin_"+a.name);this._instances.push({shower:b,plugin:a,instance:new a["class"](b,c)})},_onShowerInit:function(a){var b=a.get("shower");this._instanceFor(b)}}),a(e)}),shower.modules.define("shower.global",["Emitter","Plugins"],function(a,b,c){var d=[],e={ready:function(a){return a&&(d.length?d.forEach(a):this.events.once("init",function(b){a(b.get("shower"))})),Boolean(d.length)},init:function(a){a=a||{},shower.modules.require(["Shower"],function(b){new b(a.container,a.options)})},getInited:function(){return d.slice()}};e.events=new b({context:e}),e.plugins=new c(e),e.events.on("notify",function(a){var b=a.get("shower");d.push(b),e.events.emit("init",a)}),a(e)}),shower.modules.define("Options",["Emitter","options.Monitor","util.Store","util.extend","util.inherit"],function(a,b,c,d,e,f){function g(a){g["super"].constructor.apply(this,arguments),this.events=new b}f(g,d,{set:function(a,b){var c=[];if("string"==typeof a)g["super"].set.call(this,a,b),c.push({name:a,value:b});else{var d=a||{};Object.keys(d).forEach(function(a){var b=d[a];g["super"].set.call(this,a,b),c.push({name:a,value:b})})}return c.length&&this.events.emit("set",{items:c}),this},unset:function(a){return g["super"].unset(this,a),this.events.emit("unset",{name:a}),this},getMonitor:function(){return new c(this)}}),a(g)}),shower.modules.define("options.Monitor",["util.extend"],function(a,b){function c(a){this._options=a,this._optionsEvents=a.events.group().on(["set","unset"],this._onOptionsChange,this),this._fieldsHanders={}}b(c.prototype,{destroy:function(){this._options=null,this._optionsEvents.offAll(),this._fieldsHanders=null},add:function(a,b,c){if(Array.prototype.isArray.call(null,a)){var d=a;for(var e in d)d.hasOwnProperty(e)&&this._addHandler(e,b,c)}else this._addHandler(a,b,c);return this},remove:function(a,b,c){if(Array.prototype.isArray.call(null,a)){var d=a;for(var e in d)d.hasOwnProperty(e)&&this._remodeHandler(e,b,c)}else this._remodeHandler(a,b,c);return this},getOptions:function(){return this._options},_onOptionsChange:function(a){var b="unset"===a.get("type")?[a.get("name")]:a.get("items");b.forEach(function(a){this._fieldsHanders.hasOwnProperty(a)&&this._fieldsHanders[a].forEach(function(b){b.callback.call(b.context,this._options.get(a))})},this)},_addHandler:function(a,b,c){var d={callback:b,context:c};this._fieldsHanders.hasOwnProperty(fieldName)?this._fieldsHanders[fieldName].push(d):this._fieldsHanders[fieldName]=[d]},_remodeHandler:function(a,b,c){if(!this._fieldsHanders.hasOwnProperty(a))throw new Error("Remove undefined handler for "+a+" field");var d=this._fieldsHanders[a],e=d.filter(function(a){return a.callback===b&&a.context===c})[0];if(!hander)throw new Error("Hanlder for "+a+" not found.");d.splice(d.indexOf(e,1))}}),a(c)}),shower.modules.define("Shower",["Emitter","Options","shower.global","shower.defaultOptions","shower.Container","shower.Player","shower.Location","shower.slidesParser","util.extend"],function(a,b,c,d,e,f,g,h,i,j){function k(a,i){i=i||{},this.events=new b({context:this}),this.options=new c({},e,i);var j=a||this.options.get("container_selector");"string"==typeof j&&(j=document.querySelector(j)),this.player=new g(this),this.container=new f(this,j),this._slides=[],this._isHotkeysOn=!0,this._liveRegion=null,this._initSlides(),this._initLiveRegion(),this.options.get("debug_mode")&&(document.body.classList.add(this.options.get("debug_mode_classname")),console.info("Debug mode on")),this.options.get("hotkeys")||this.disableHotkeys(),this.location=new h(this),d.events.emit("notify",{shower:this}),this._playerListeners=this.player.events.group().on("activate",this._onPlayerSlideActivate,this)}j(k.prototype,{destroy:function(){this.events.emit("destroy"),this.location.destroy(),this.container.destroy(),this.player.destroy(),this._slides=[]},add:function(a){if(Array.isArray.call(null,a))for(var b=0,c=a.length;c>b;b++)this._addSlide(a[b]);else this._addSlide(a);return this},remove:function(a){var b;if("number"==typeof a)b=a;else{if(-1==this._slides.indexOf(a))throw new Error("Slide not found");b=this._slides.indexOf(a)}return a=this._slides.splice(b,1)[0],this.events.emit("slideremove",{slide:a}),a.destroy(),this},get:function(a){return this._slides[a]},getSlides:function(){return this._slides.slice()},getSlidesCount:function(){return this._slides.length},getSlideIndex:function(a){return this._slides.indexOf(a)},disableHotkeys:function(){return this._isHotkeysOn=!1,this},enableHotkeys:function(){return this._isHotkeysOn=!0,this},isHotkeysEnabled:function(){return this._isHotkeysOn},getLiveRegion:function(){return this._liveRegion},updateLiveRegion:function(a){return this._liveRegion.innerHTML=a,this},_onPlayerSlideActivate:function(a){var b=a.get("slide");this.updateLiveRegion(b.getContent())},_initSlides:function(){var a=this.options.get("slides_parser")||i,b=a(this.container.getElement(),this.options.get("slides_selector"));this.add(b)},_addSlide:function(a){a.state.set("index",this._slides.length),this._slides.push(a),this.events.emit("slideadd",{slide:a})},_initLiveRegion:function(){var a=document.createElement("section");a.setAttribute("role","region"),a.setAttribute("aria-live","assertive"),a.setAttribute("aria-relevant","additions"),a.setAttribute("aria-label","Slide Content: Auto-updating"),a.className="region",document.body.appendChild(a),this._liveRegion=a}}),a(k)}),shower.modules.define("shower.Container",["Emitter","util.extend"],function(a,b,c){function d(a,c){this.events=new b({context:this,parent:a.events}),this._shower=a,this._element=c,this._isSlideMode=!1,this.init()}c(d.prototype,{init:function(){var a=document.body.classList,b=this._shower.options,c=b.get("mode_full_classname"),d=b.get("mode_list_classname");a.contains(d)||a.contains(c)||a.add(d),this._setupListeners()},destroy:function(){this._clearListeners(),this._element=null,this._shower=null,this._isSlideMode=null},getElement:function(){return this._element},enterSlideMode:function(){var a=document.body.classList,b=this._shower.options;return a.remove(b.get("mode_list_classname")),a.add(b.get("mode_full_classname")),this._applyTransform(this._getTransformScale()),this._isSlideMode=!0,this.events.emit("slidemodeenter"),this},exitSlideMode:function(){var a=document.body.classList,b=this._shower.options;return a.remove(b.get("mode_full_classname")),a.add(b.get("mode_list_classname")),this._applyTransform("none"),this._isSlideMode=!1,this.scrollToCurrentSlide(),this.events.emit("slidemodeexit"),this},isSlideMode:function(){return this._isSlideMode},scrollToCurrentSlide:function(){var a=this._shower.options.get("slide_active_classname"),b=this._element.querySelector("."+a);return b&&window.scrollTo(0,b.offsetTop),this},_setupListeners:function(){this._showerListeners=this._shower.events.group().on("slideadd",this._onSlideAdd,this).on("slideremove",this._onSlideRemove,this),window.addEventListener("resize",this._onResize.bind(this)),document.addEventListener("keydown",this._onKeyDown.bind(this))},_clearListeners:function(){this._showerListeners.offAll(),window.removeEventListener("resize",this._onResize.bind(this)),document.removeEventListener("keydown",this._onKeyDown.bind(this))},_getTransformScale:function(){var a=Math.max(document.body.clientWidth/window.innerWidth,document.body.clientHeight/window.innerHeight);return"scale("+1/a+")"},_applyTransform:function(a){["WebkitTransform","MozTransform","msTransform","OTransform","transform"].forEach(function(b){document.body.style[b]=a})},_onResize:function(){this.isSlideMode()&&this._applyTransform(this._getTransformScale())},_onSlideAdd:function(a){var b=a.get("slide");b.events.on("click",this._onSlideClick,this)},_onSlideRemove:function(a){var b=a.get("slide");b.events.off("click",this._onSlideClick,this)},_onSlideClick:function(){this._isSlideMode||this.enterSlideMode()},_onKeyDown:function(a){if(this._shower.isHotkeysEnabled())switch(a.which){case 13:a.preventDefault(),this.enterSlideMode();break;case 27:a.preventDefault(),this.exitSlideMode();break;case 116:if(a.preventDefault(),this.isSlideMode())this.exitSlideMode();else{var b=a.shiftKey?this._shower.player.getCurrentSlideIndex():0;this._shower.player.go(b),this.enterSlideMode()}break;case 80:!this.isSlideMode()&&a.altKey&&a.metaKey&&(a.preventDefault(),this.enterSlideMode())}}}),a(d)}),shower.modules.define("shower.Location",["util.SessionStore","util.extend"],function(a,b,c){function d(a){this._shower=a;var c=a.options.get("sessionstore_key")+"-shower.Location";this.state=new b(c,{isSlideMode:!1}),this._showerListeners=null,this._playerListeners=null,this._documentTitle=document.title,this._popStateProcess=null,this._setupListeners(),this._init()}c(d.prototype,{destroy:function(){this._clearListeners()},save:function(){this.state.set("isSlideMode",this._isSlideMode())},_init:function(){var a,b=this._shower,c=window.location.hash.substr(1),d=b.options.get("mode_full_classname");window.location.hash="",(this.state.get("isSlideMode")||document.body.classList.contains(d))&&b.container.enterSlideMode(),""!==c&&(a=this._getSlideById(c),b.player.go("undefined"!=typeof a.index?a.index:0))},_setupListeners:function(){var a=this._shower;this._playerListeners=a.player.events.group().on("activate",this._onSlideActivate,this),this._containerListener=a.container.events.group().on(["slidemodeenter","slidemodeexit"],this._onContainerSlideModeChange,this),window.addEventListener("popstate",this._onPopstate.bind(this))},_clearListeners:function(){window.removeEventListener("popstate",this._onPopstate.bind(this)),this._playerListeners.offAll(),this._containerListener.offAll()},_getSlideById:function(a){for(var b,c,d=this._shower.getSlides(),e=d.length-1;e>=0;e--)if(d[e].getId()===a){b=d[e],c=e;break}return{slide:b,index:c}},_onSlideActivate:function(a){window.location.hash=a.get("slide").getId(),this._setTitle()},_onContainerSlideModeChange:function(){this._setTitle(),this.save()},_isSlideMode:function(){return this._shower.container.isSlideMode()},_onPopstate:function(){var a,b=this._shower,c=window.location.hash.substr(1),d=b.player.getCurrentSlide(),e=b.player.getCurrentSlideIndex();this._isSlideMode()&&-1===e?b.player.go(0):-1===e&&""!==window.location.hash&&b.player.go(0),d&&c!==d.getId()&&(a=this._getSlideById(c),b.player.go(a.index))},_setTitle:function(){var a=document.title,b=this._isSlideMode(),c=this._shower.player.getCurrentSlide();if(b&&c){var d=c.getTitle();document.title=d?d+" — "+this._documentTitle:this._documentTitle}else this._documentTitle!==a&&(document.title=this._documentTitle)}}),a(d)}),shower.modules.define("shower.Player",["Emitter","util.extend"],function(a,b,c){function d(a){this.events=new b({context:this,parent:a.events}),this._shower=a,this._showerListeners=null,this._playerListeners=null,this._currentSlideNumber=-1,this._currentSlide=null,this.init()}c(d.prototype,{init:function(){this._showerListeners=this._shower.events.group().on("slideadd",this._onSlideAdd,this).on("slideremove",this._onSlideRemove,this).on("slidemodeenter",this._onContainerSlideModeEnter,this),this._playerListeners=this.events.group().on("prev",this._onPrev,this).on("next",this._onNext,this),document.addEventListener("keydown",this._onKeyDown.bind(this))},destroy:function(){this._showerListeners.offAll(),this._playerListeners.offAll(),document.removeEventListener("keydown",this._onKeyDown.bind(this)),this._currentSlide=null,this._currentSlideNumber=null,this._shower=null},next:function(){return this.events.emit("next"),this},prev:function(){return this.events.emit("prev"),this},first:function(){return this.go(0),this},last:function(){return this.go(this._shower.getSlidesCount()-1),this},go:function(a){"number"!=typeof a&&(a=this._shower.getSlideIndex(a));var b=this._shower.getSlidesCount(),c=this._currentSlide;return a!=this._currentSlideNumber&&b>a&&a>=0&&(c&&c.isActive()&&c.deactivate(),c=this._shower.get(a),this._currentSlide=c,this._currentSlideNumber=a,c.isActive()||c.activate(),this.events.emit("activate",{index:a,slide:c})),this},getCurrentSlide:function(){return this._currentSlide},getCurrentSlideIndex:function(){return this._currentSlideNumber},_onPrev:function(){this._changeSlide(this._currentSlideNumber-1)},_onNext:function(){this._changeSlide(this._currentSlideNumber+1)},_changeSlide:function(a){this.go(a)},_onSlideAdd:function(a){var b=a.get("slide");b.events.on("activate",this._onSlideActivate,this)},_onSlideRemove:function(a){var b=a.get("slide");b.events.off("activate",this._onSlideActivate,this)},_onSlideActivate:function(a){var b=a.get("slide"),c=this._shower.getSlideIndex(b);this.go(c)},_onKeyDown:function(a){if(this._shower.isHotkeysEnabled())switch(this.events.emit("keydown",{event:a}),a.which){case 33:case 38:case 37:case 72:case 75:if(a.altKey||a.ctrlKey||a.metaKey)return;a.preventDefault(),this.prev();break;case 34:case 40:case 39:case 76:case 74:if(a.altKey||a.ctrlKey||a.metaKey)return;a.preventDefault(),this.next();break;case 36:a.preventDefault(),this.first();break;case 35:a.preventDefault(),this.last();break;case 9:case 32:if(a.altKey||a.ctrlKey||a.metaKey)return;a.preventDefault(),a.shiftKey?this.prev():this.next()}},_onContainerSlideModeEnter:function(){this._currentSlide||this.go(0)}}),a(d)}),shower.modules.define("shower.defaultOptions",function(a,b){a({container_selector:".shower",debug_mode:!1,debug_mode_classname:"debug",hotkeys:!0,sessionstore_key:"shower",slides_selector:".shower .slide",mode_full_classname:"full",mode_list_classname:"list",slide_title_element_selector:"H2",slide_active_classname:"active",slide_visited_classname:"visited"})}),shower.modules.define("shower.slidesParser",["Slide"],function(a,b){function c(a,c){var d=a.querySelectorAll(c);return d=Array.prototype.slice.call(d),d.map(function(a,c){var d=new b(a);return a.id||(a.id=c+1),d})}a(c)}),shower.modules.define("Slide",["shower.defaultOptions","Emitter","Options","slide.Layout","slide.layoutFactory","util.Store","util.extend"],function(a,b,c,d,e,f,g,h){function i(a,b,e){this.events=new c,this.options=new d(b),this.layout=null,this.state=new g({visited:0,index:null},e),this._content=a,this._isVisited=this.state.get("visited")>0,this._isActive=!1,this.init()}h(i.prototype,{init:function(){this.layout="string"==typeof this._content?new f.createLayout({content:this._content}):new e(this._content,this.options),this.layout.setParent(this),this._setupListeners()},destroy:function(){this._clearListeners(),this._isActive=null,this.options=null,this.layout.destroy()},activate:function(){this._isActive=!0;var a=this.state.get("visited");return this.state.set("visited",++a),this.events.emit("activate",{slide:this}),this},deactivate:function(){return this._isActive=!1,this.events.emit("deactivate",{slide:this}),this},isActive:function(){return this._isActive},isVisited:function(){return this.state.get("visited")>0},getTitle:function(){return this.layout.getTitle()},setTitle:function(a){return this.layout.setTitle(a),this},getId:function(){return this.layout.getElement().id},getContent:function(){return this.layout.getContent()},_setupListeners:function(){this.layoutListeners=this.layout.events.group().on("click",this._onSlideClick,this)},_clearListeners:function(){this.layoutListeners.offAll()},_onSlideClick:function(){this.activate(),this.events.emit("click",{slide:this})}}),a(i)}),shower.modules.define("slide.Layout",["Options","shower.defaultOptions","Emitter","util.extend"],function(a,b,c,d,e){function f(a,e){this.options=new b({title_element_selector:c.slide_title_element_selector,active_classname:c.slide_active_classname,visited_classname:c.slide_visited_classname},e),this.events=new d,this._element=a,this._parent=null,this._parentElement=null,this.init()}e(f.prototype,{init:function(){var a=this._element.parentNode;a?this._parentElement=a:this.setParentElement(a)},destroy:function(){this.setParent(null)},setParent:function(a){this._parent!=a&&(this._clearListeners(),this._parent=a,this._parent&&this._setupListeners(),this.events.emit("parentchange",{parent:a}))},getParent:function(){return this._parent},setParentElement:function(a){a!=this._parentElement&&(this._parentElement=a,a.appendChild(this._element),this.events.emit("parentelementchange",{parentElement:a}))},getParentElement:function(){return this._parentElement},getElement:function(){return this._element},setTitle:function(a){var b=this.options.get("title_element_selector"),c=this._element.querySelector(b);c?c.innerHTML=a:(c=document.createElement(b),c.innerHTML=a,this._element.insertBefore(c,this._element.firstChild))},getTitle:function(){var a=this.options.get("title_element_selector"),b=this._element.querySelector(a);return b?b.textContent:null},getData:function(a){var b=this._element;return b.dataset?b.dataset[a]:b.getAttribute("data-"+a)},getContent:function(){return this._element.innerHTML},_setupListeners:function(){this._slideListeners=this._parent.events.group().on("activate",this._onSlideActivate,this).on("deactivate",this._onSlideDeactivate,this),this._element.addEventListener("click",this._onSlideClick.bind(this),!1)},_clearListeners:function(){this._slideListeners&&this._slideListeners.offAll(),this._element.removeEventListener("click",this._onSlideClick.bind(this))},_onSlideActivate:function(){this._element.classList.add(this.options.get("active_classname"))},_onSlideDeactivate:function(){var a=this._element.classList;a.remove(this.options.get("active_classname")),a.add(this.options.get("visited_classname"))},_onSlideClick:function(){this.events.emit("click")}}),a(f)}),shower.modules.define("slide.layoutFactory",["slide.Layout","util.extend"],function(a,b,c){var d={};c(d,{createLayout:function(a){a=a||{};var e=d._createElement(c({content:"",contentType:"slide"},a));return new b(e)},_createElement:function(a){var b=document.createElement("section");return b.innerHTML=a.content,b.classList.add(a.contentType),b}}),a(d)}),shower.modules.define("util.SessionStore",["util.Store","util.inherit"],function(a,b,c){function d(a,b){this._storageKey=a;var c=this._loadFromStorage()||b;d["super"].constructor.call(this,c)}c(d,b,{set:function(a,b){d["super"].set.call(this,a,b),this._saveToStorage()},unset:function(a){d["super"].unset.call(this,a),this._saveToStorage()},_saveToStorage:function(){window.sessionStorage.setItem(this._storageKey,JSON.stringify(this.getAll()))},_loadFromStorage:function(){var a=window.sessionStorage.getItem(this._storageKey);return a&&JSON.parse(a)}}),a(d)}),shower.modules.define("util.Store",["util.extend"],function(a,b){function c(a){this._data=a||{};for(var c=1,d=arguments.length;d>c;c++)b(this._data,arguments[c]||{})}b(c.prototype,{get:function(a,b){return this._data.hasOwnProperty(a)?this._data[a]:b},getAll:function(){return b({},this._data)},set:function(a,b){return this._data[a]=b,this},unset:function(a){if(!this._data.hasOwnProperty(a))throw new Error(a+" not found.");return delete this._data[a],this},destroy:function(){this._data={}}}),a(c)}),shower.modules.define("util.bind",function(a){var b="function"==typeof Function.prototype.bind?function(a,b){return a.bind(b)}:function(a,b){if(arguments.length>2){var c=Array.prototype.slice.call(arguments,2),d=Array.prototype.slice.call(arguments);return function(){return a.apply(b,[].concat(c,d))}}return function(){return a.apply(b,arguments)}};a(b)}),shower.modules.define("util.extend",function(a){function b(a){if(!a)throw new Error("util.extend: Target not found");return"undefined"==typeof Object.assign?c.apply(null,arguments):Object.assign.apply(null,arguments)}function c(a){for(var b=1,c=arguments.length;c>b;b++){var d=arguments[b];for(var e in d)d.hasOwnProperty(e)&&(a[e]=d[e])}return a}a(b)}),shower.modules.define("util.inherit",["util.extend"],function(a,b){var c=function(a,c,d){return a.prototype=Object.create(c.prototype),a.prototype.constructor=a,a["super"]=c.prototype,a["super"].constructor=c,d&&b(a.prototype,d),a.prototype};a(c)}),shower.modules.define("shower-next",["shower","Emitter","util.extend"],function(a,b,c,d){function e(a,b){b=b||{},this.events=new c({context:this}),this._shower=a,this._elementsSelector=b.selector||g,this._elements=[],this._innerComplete=0,this._setupListeners(),-1!=this._shower.player.getCurrentSlideIndex()&&this._onSlideActivate()}var f="shower-timer",g=".next";d(e.prototype,{destroy:function(){this._clearListeners(),this._elements=null,this._elementsSelector=null,this._innerComplete=null,this._shower=null},next:function(){if(!this._elements.length)throw new Error("Inner nav elements not found.");return this._innerComplete++,this._go(),this.events.emit("next"),this},prev:function(){if(!this._elements.length)throw new Error("Inner nav elements not found.");return this._innerComplete--,this._go(),this.events.emit("prev"),this},getLength:function(){return this._elements=this._getElements(),this._elements.length},getComplete:function(){return this._innerComplete},_setupListeners:function(){var a=this._shower;this._showerListeners=a.events.group().on("destroy",this.destroy,this),this._playerListeners=a.player.events.group().on("activate",this._onSlideActivate,this).on("next",this._onNext,this).on("prev",this._onPrev,this);var c=b.plugins.get(f,a);c?this._setupTimerPluginListener(c):this._pluginsListeners=b.plugins.events.group().on("add",function(a){a.get("name")===f&&(this._setupTimerPluginListener(),this._pluginsListeners.offAll())},this)},_setupTimerPluginListener:function(a){if(!a){b.plugins.get(f,this._shower)}a.events.on("next",this._onNext,this,100)},_clearListeners:function(){this._showerListeners.offAll(),this._playerListeners.offAll(),this._pluginsListeners&&this._pluginsListeners.offAll()},_getElements:function(){var a=this._shower.player.getCurrentSlide().layout,b=a.getElement();return Array.prototype.slice.call(b.querySelectorAll(this._elementsSelector))},_onNext:function(a){var b=this._elements.length,c=this._shower.container.isSlideMode();c&&b&&this._innerCompletec&&c>0&&(a.preventDefault(),this.prev())},_go:function(){for(var a=0,b=this._elements.length;b>a;a++){var c=this._elements[a];awindow.innerWidth/2?c.player.next():c.player.prev()),d||f.activate())},_onTouchMove:function(a){this._shower.container.isSlideMode()&&a.preventDefault()},_getSlideByElement:function(a){for(var b=this._shower.getSlides(),c=null,d=0,e=b.length;e>d;d++)if(a.id===b[d].getId()){c=this._shower.get(d);break}return c},_isInteractiveElement:function(a){return d.some(function(b){return b===a.tagName})}}),a(c)}),shower.modules.require(["shower"],function(a){a.plugins.add("shower-touch")}); --------------------------------------------------------------------------------