├── .gitignore ├── .htaccess ├── .vscode └── settings.json ├── INSTALL.md ├── LICENSE ├── README.md ├── dist └── css │ ├── dracula-prism-old.css │ ├── dracula-prism-old.min.css │ ├── dracula-prism.css │ └── dracula-prism.min.css ├── package-lock.json ├── package.json ├── screenshot.png ├── src ├── css │ ├── dracula-prism-old.css │ ├── dracula-prism.css │ └── unofficial.css ├── fonts │ ├── OFL.txt │ ├── convert.pe │ ├── source-code-pro-bold-italic.ttf │ ├── source-code-pro-bold.ttf │ ├── source-code-pro-italic.ttf │ ├── source-code-pro-light-italic.ttf │ ├── source-code-pro-light.ttf │ ├── source-code-pro-regular.ttf │ ├── source-sans-pro-bold-italic.ttf │ ├── source-sans-pro-bold.ttf │ ├── source-sans-pro-italic.ttf │ ├── source-sans-pro-light-italic.ttf │ ├── source-sans-pro-light.ttf │ └── source-sans-pro-regular.ttf ├── images │ └── vampiro-geek.svg └── js │ ├── bundle-for-react.js │ ├── jquery.min.js │ ├── prism.js │ └── unofficial.js └── test ├── Test – Highlighter Test.html ├── Test – React with Dracula-themed Prism.html ├── Test – Syntax Highlighting Analysis.html ├── index-with-new-prism.html ├── index-with-old-prism.html ├── public ├── favicon.ico ├── index.html ├── logo192.png ├── logo512.png ├── manifest.json └── robots.txt └── src ├── dracula-prism.css ├── htmlSnippet.jsx ├── index.jsx └── jsSnippet.jsx /.gitignore: -------------------------------------------------------------------------------- 1 | # Ignorar os ficheiros sujos macOS DS_Store 2 | .DS_Store 3 | ._.DS_Store 4 | *.DS_Store 5 | **/.DS_Store 6 | **/._.DS_Store 7 | 8 | # Ignorar os ficheiros sujos .directory do Dolphin 9 | *.directory 10 | **/.directory 11 | 12 | ## Proteger os dados para não vazarem 13 | .env.local 14 | .env.development.local 15 | .env.test.local 16 | .env.production.local 17 | 18 | # Não guardar os caches de Firebase no repositório do GitHub/GitLab 19 | **/.firebase 20 | 21 | # Não guardar a pasta compilada 22 | /build 23 | builds 24 | 25 | # Não guardar a pasta de teste 26 | /coverage 27 | 28 | # Não guardar a pasta node_modules e as suas dependências 29 | node_modules 30 | /.pnp 31 | .pnp.js 32 | 33 | # Não guardar os logs 34 | npm-debug.log* 35 | yarn-debug.log* 36 | yarn-error.log* -------------------------------------------------------------------------------- /.htaccess: -------------------------------------------------------------------------------- 1 | 2 | 3 | Header set Access-Control-Allow-Origin "*" 4 | 5 | 6 | 7 | # Webfont mime types 8 | AddType application/vnd.ms-fontobject eot 9 | AddType font/truetype ttf 10 | AddType font/opentype otf 11 | AddType application/x-font-woff woff 12 | 13 | # Images SVG 14 | AddType image/svg+xml svg 15 | AddType image/svg+xml svgz 16 | 17 | # webfonts and svg: 18 | 19 | 20 | SetOutputFilter DEFLATE 21 | 22 | -------------------------------------------------------------------------------- /.vscode/settings.json: -------------------------------------------------------------------------------- 1 | { 2 | "workbench.colorTheme": "Dracula", 3 | } -------------------------------------------------------------------------------- /INSTALL.md: -------------------------------------------------------------------------------- 1 | ### [Prism](https://prismjs.com/) 2 | 3 | #### Using directly from the UNPKG CDN 4 | 5 | ```html 6 | 7 | ``` 8 | 9 | Or the minified file: 10 | 11 | ```html 12 | 13 | ``` 14 | 15 | - More info: 16 | 17 | #### With Node or another build system 18 | 19 | You can install with the command `npm i dracula-prism` which comes ready with Prismjs installed. 20 | 21 | If you're using Node or Webpack or Rollup or Browserify, etc., simply apply: 22 | 23 | ```js 24 | require('dracula-prism'); 25 | ``` 26 | 27 | #### For React and ReactJS users 28 | 29 | You can import simply two libraries: 30 | 31 | ```js 32 | import Prism from "prism"; 33 | import "css/dracula-prism.css"; 34 | ``` 35 | 36 | You can get the [sample React code for a website](https://github.com/dracula/prism/blob/master/test/Test%20%E2%80%93%20React%20with%20Dracula-themed%20Prism.html) or the [sample JSX code](https://github.com/dracula/prism/blob/master/test/src/index.jsx). 37 | 38 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | ≤MIT License 2 | 3 | Copyright (c) 2016 Gustavo Reis 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Dracula for [Prism.js](http://prismjs.com) 2 | 3 | > A dark theme for [Prism.js](http://prismjs.com). 4 | 5 | ![Screenshot](screenshot.png) 6 | 7 | ## Install 8 | 9 | All instructions can be found [here](https://draculatheme.com/prism/). 10 | 11 | ## Team 12 | 13 | This theme is maintained by the following person(s) and a bunch of [awesome contributors](https://github.com/dracula/prism/graphs/contributors). 14 | 15 | | [![Gustavo Costa](https://avatars2.githubusercontent.com/u/2257024?v=3&s=70)](https://github.com/gusbemacbe) | 16 | | :---------------------------------------------------------------------------------------------------------: | 17 | | [Gustavo Costa](https://github.com/gusbemacbe) | 18 | 19 | ## Community 20 | 21 | - [Twitter](https://twitter.com/draculatheme) - Best for getting updates about themes and new stuff. 22 | - [GitHub](https://github.com/dracula/dracula-theme/discussions) - Best for asking questions and discussing issues. 23 | - [Discord](https://draculatheme.com/discord-invite) - Best for hanging out with the community. 24 | 25 | ## License 26 | 27 | [MIT License](./LICENSE) 28 | -------------------------------------------------------------------------------- /dist/css/dracula-prism-old.css: -------------------------------------------------------------------------------- 1 | /* PrismJS 1.14.0 2 | http://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+actionscript+ada+apacheconf+apl+applescript+c+arff+asciidoc+asm6502+aspnet+autohotkey+autoit+bash+basic+batch+bison+brainfuck+bro+cpp+csharp+arduino+coffeescript+clojure+ruby+csp+css-extras+d+dart+diff+django+docker+eiffel+elixir+elm+markup-templating+erlang+fsharp+flow+fortran+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+jolie+json+julia+keyman+kotlin+latex+less+liquid+lisp+livescript+lolcode+lua+makefile+markdown+erb+matlab+mel+mizar+monkey+n4js+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+php+php-extras+sql+powershell+processing+prolog+properties+protobuf+pug+puppet+pure+python+q+qore+r+jsx+typescript+renpy+reason+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+plsql+soy+stylus+swift+tcl+textile+twig+tsx+vbnet+velocity+verilog+vhdl+vim+visual-basic+wasm+wiki+xeora+xojo+yaml&plugins=line-numbers+toolbar+show-language */ 3 | /** 4 | * prism.js default theme for JavaScript, CSS and HTML 5 | * Based on dabblet (http://dabblet.com) 6 | * @author Lea Verou 7 | */ 8 | 9 | /* 10 | * Old Dracula Theme for Prism.JS 11 | * 12 | * @author Gustavo Costa 13 | * e-mail: gusbemacbe@gmail.com 14 | * 15 | * @contributor Jon Leopard 16 | * e-mail: jonlprd@gmail.com 17 | * 18 | * @license MIT 2016-2021 19 | */ 20 | 21 | pre::-webkit-scrollbar 22 | { 23 | width: 14px; 24 | } 25 | 26 | pre::-webkit-scrollbar-track 27 | { 28 | background-color: #6272A4; 29 | border-radius: 0px; 30 | } 31 | 32 | pre::-webkit-scrollbar-thumb 33 | { 34 | background-color: #BD93F9; 35 | border-radius: 0px; 36 | } 37 | 38 | code[class*="language-"], 39 | pre[class*="language-"] 40 | { 41 | color: #F2F2F2; 42 | background: #282936; 43 | text-shadow: none; 44 | font-family: "Source Mono", PT Mono, Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; 45 | text-align: left; 46 | white-space: pre; 47 | word-spacing: normal; 48 | word-break: normal; 49 | word-wrap: normal; 50 | line-height: 1.5; 51 | 52 | -moz-tab-size: 4; 53 | -o-tab-size: 4; 54 | tab-size: 4; 55 | 56 | -webkit-hyphens: none; 57 | -moz-hyphens: none; 58 | -ms-hyphens: none; 59 | hyphens: none; 60 | } 61 | 62 | pre[class*="language-"]::-moz-selection, 63 | pre[class*="language-"] ::-moz-selection, 64 | code[class*="language-"]::-moz-selection, 65 | code[class*="language-"] ::-moz-selection 66 | { 67 | text-shadow: none; 68 | background-color: #5A5F80; 69 | } 70 | 71 | pre[class*="language-"]::selection, 72 | pre[class*="language-"] ::selection, 73 | code[class*="language-"]::selection, 74 | code[class*="language-"] ::selection 75 | { 76 | text-shadow: none; 77 | background-color: #5A5F80; 78 | } 79 | 80 | @media print 81 | { 82 | code[class*="language-"], 83 | pre[class*="language-"] 84 | 85 | { 86 | text-shadow: none; 87 | } 88 | } 89 | 90 | /* Code blocks */ 91 | pre[class*="language-"] 92 | { 93 | background: #282936; 94 | border-radius: 0.5em; 95 | height: auto; 96 | margin: 0.5em 0; 97 | overflow: auto; 98 | } 99 | 100 | :not(pre) > code[class*="language-"], 101 | pre[class*="language-"] 102 | { 103 | background: #282936; 104 | } 105 | 106 | /* Inline code */ 107 | :not(pre) > code[class*="language-"] 108 | { 109 | border-radius: 0.3em; 110 | padding: 4px 7px; 111 | white-space: normal; 112 | } 113 | 114 | .limit-300 115 | { 116 | height: 300px !important; 117 | } 118 | 119 | .limit-400 120 | { 121 | height: 400px !important; 122 | } 123 | 124 | .limit-500 125 | { 126 | height: 500px !important; 127 | } 128 | 129 | .limit-600 130 | { 131 | height: 600px !important; 132 | } 133 | 134 | .limit-700 135 | { 136 | height: 700px !important; 137 | } 138 | 139 | .limit-800 140 | { 141 | height: 800px !important; 142 | } 143 | 144 | .token.comment 145 | { 146 | color: #6272A4; 147 | } 148 | 149 | .token.prolog 150 | { 151 | color: #CFCFC2; 152 | } 153 | 154 | .token.tag 155 | { 156 | color: #DC68AA; 157 | } 158 | 159 | .token.entity 160 | { 161 | color: #8BE9FD; 162 | } 163 | 164 | .token.atrule 165 | { 166 | color: #62EF75; 167 | } 168 | 169 | .token.url 170 | { 171 | color: #66D9EF; 172 | } 173 | 174 | .token.selector 175 | { 176 | color: #CFCFC2; 177 | } 178 | 179 | .token.string 180 | { 181 | color: #F1FA8C; 182 | } 183 | 184 | .token.property 185 | { 186 | color: #FFB86C; 187 | } 188 | 189 | .token.important 190 | { 191 | color: #FF79C6; 192 | font-weight: bold; 193 | } 194 | 195 | .token.number 196 | { 197 | color: #BD93F9; 198 | } 199 | 200 | .token.function 201 | { 202 | color: #50FA7B; 203 | } 204 | 205 | .token.class-name 206 | { 207 | color: #FFB86C; 208 | } 209 | 210 | .token.keyword 211 | { 212 | color: #FF79C6; 213 | } 214 | 215 | .token.boolean 216 | { 217 | color: #FFB86C; 218 | } 219 | 220 | .token.operator 221 | { 222 | color: #8BE9FD; 223 | } 224 | 225 | .token.char 226 | { 227 | color: #FF879D; 228 | } 229 | 230 | .token.regex 231 | { 232 | color: #50FA7B; 233 | } 234 | 235 | .token.variable 236 | { 237 | color: #50FA7B; 238 | } 239 | 240 | .token.constant 241 | { 242 | color: #FFB86C; 243 | } 244 | 245 | .token.symbol 246 | { 247 | color: #FFB86C; 248 | } 249 | 250 | .token.builtin 251 | { 252 | color: #FF79C6; 253 | } 254 | 255 | .token.attr-value 256 | { 257 | color: #7ec699; 258 | } 259 | 260 | .token.deleted 261 | { 262 | color: #E2777A; 263 | } 264 | 265 | .token.namespace 266 | { 267 | color: #E2777A; 268 | } 269 | 270 | .token.bold 271 | { 272 | font-weight: bold; 273 | } 274 | 275 | .token.italic 276 | { 277 | font-style: italic; 278 | } 279 | 280 | .token 281 | { 282 | color: #FF79C6; 283 | } 284 | 285 | .language-cpp .token.string 286 | { 287 | color: #8BE9FD; 288 | } 289 | 290 | .language-c .token.string 291 | { 292 | color: #8BE9FD; 293 | } 294 | 295 | .language-css .token.selector 296 | { 297 | color: #50FA7B; 298 | } 299 | 300 | .language-css .token.property 301 | { 302 | color: #FFB86C; 303 | } 304 | 305 | .language-java span.token.class-name 306 | { 307 | color: #8BE9FD; 308 | } 309 | 310 | .language-java .token.class-name 311 | { 312 | color: #8BE9FD; 313 | } 314 | 315 | .language-markup .token.attr-value 316 | { 317 | color: #66D9EF; 318 | } 319 | 320 | .language-markup .token.tag 321 | { 322 | color: #50FA7B; 323 | } 324 | 325 | .language-objectivec .token.property 326 | { 327 | color: #66D9EF; 328 | } 329 | 330 | .language-objectivec .token.string 331 | { 332 | color: #50FA7B; 333 | } 334 | 335 | .language-php .token.boolean 336 | { 337 | color: #8BE9FD; 338 | } 339 | 340 | .language-php .token.function 341 | { 342 | color: #FF79C6; 343 | } 344 | 345 | .language-php .token.keyword 346 | { 347 | color: #66D9EF; 348 | } 349 | 350 | .language-ruby .token.symbol 351 | { 352 | color: #8BE9FD; 353 | } 354 | 355 | .language-ruby .token.class-name 356 | { 357 | color: #CFCFC2; 358 | } 359 | 360 | pre.line-numbers 361 | { 362 | position: relative; 363 | padding-left: 3.8em; 364 | counter-reset: linenumber; 365 | } 366 | 367 | pre.line-numbers > code 368 | { 369 | position: relative; 370 | white-space: inherit; 371 | } 372 | 373 | .line-numbers .line-numbers-rows 374 | { 375 | position: absolute; 376 | pointer-events: none; 377 | top: 0; 378 | font-size: 100%; 379 | left: -3.8em; 380 | width: 3em; /* works for line-numbers below 1000 lines */ 381 | letter-spacing: -1px; 382 | border-right: 1px solid #999; 383 | 384 | -webkit-user-select: none; 385 | -moz-user-select: none; 386 | -ms-user-select: none; 387 | user-select: none; 388 | } 389 | 390 | .line-numbers-rows > span 391 | { 392 | pointer-events: none; 393 | display: block; 394 | counter-increment: linenumber; 395 | } 396 | 397 | .line-numbers-rows > span:before 398 | { 399 | content: counter(linenumber); 400 | color: #999; 401 | display: block; 402 | padding-right: 0.8em; 403 | text-align: right; 404 | } 405 | 406 | div.code-toolbar 407 | { 408 | position: relative; 409 | } 410 | 411 | div.code-toolbar > .toolbar 412 | { 413 | position: absolute; 414 | top: 0.3em; 415 | right: 0.2em; 416 | transition: opacity 0.3s ease-in-out; 417 | opacity: 0; 418 | } 419 | 420 | div.code-toolbar:hover > .toolbar 421 | { 422 | opacity: 1; 423 | } 424 | 425 | div.code-toolbar > .toolbar .toolbar-item 426 | { 427 | display: inline-block; 428 | padding-right: 20px; 429 | } 430 | 431 | div.code-toolbar > .toolbar a 432 | { 433 | cursor: pointer; 434 | } 435 | 436 | div.code-toolbar > .toolbar button 437 | { 438 | background: none; 439 | border: 0; 440 | color: inherit; 441 | font: inherit; 442 | line-height: normal; 443 | overflow: visible; 444 | padding: 0; 445 | -webkit-user-select: none; /* for button */ 446 | -moz-user-select: none; 447 | -ms-user-select: none; 448 | } 449 | 450 | div.code-toolbar > .toolbar a, 451 | div.code-toolbar > .toolbar button, 452 | div.code-toolbar > .toolbar span 453 | { 454 | color: #CCC; 455 | font-size: 0.8em; 456 | padding: 0.5em; 457 | background: #6272A4; 458 | border-radius: 0.5em; 459 | } 460 | 461 | div.code-toolbar > .toolbar a:hover, 462 | div.code-toolbar > .toolbar a:focus, 463 | div.code-toolbar > .toolbar button:hover, 464 | div.code-toolbar > .toolbar button:focus, 465 | div.code-toolbar > .toolbar span:hover, 466 | div.code-toolbar > .toolbar span:focus 467 | { 468 | color: inherit; 469 | text-decoration: none; 470 | background-color: #50FA7B; 471 | } 472 | -------------------------------------------------------------------------------- /dist/css/dracula-prism-old.min.css: -------------------------------------------------------------------------------- 1 | pre::-webkit-scrollbar{width:14px}pre::-webkit-scrollbar-track{background-color:#6272a4;border-radius:0}pre::-webkit-scrollbar-thumb{background-color:#bd93f9;border-radius:0}code[class*=language-],pre[class*=language-]{color:#f2f2f2;background:#282936;text-shadow:none;font-family:"Source Mono",PT Mono,Consolas,Monaco,"Andale Mono","Ubuntu Mono",monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}code[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,pre[class*=language-]::-moz-selection{text-shadow:none;background-color:#5a5f80}code[class*=language-] ::selection,code[class*=language-]::selection,pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background-color:#5a5f80}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}pre[class*=language-]{background:#282936;border-radius:.5em;height:auto;margin:.5em 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:#282936}:not(pre)>code[class*=language-]{border-radius:.3em;padding:4px 7px;white-space:normal}.limit-300{height:300px!important}.limit-400{height:400px!important}.limit-500{height:500px!important}.limit-600{height:600px!important}.limit-700{height:700px!important}.limit-800{height:800px!important}.token.comment{color:#6272a4}.token.prolog{color:#cfcfc2}.token.tag{color:#dc68aa}.token.entity{color:#8be9fd}.token.atrule{color:#62ef75}.token.url{color:#66d9ef}.token.selector{color:#cfcfc2}.token.string{color:#f1fa8c}.token.property{color:#ffb86c}.token.important{color:#ff79c6;font-weight:700}.token.number{color:#bd93f9}.token.function{color:#50fa7b}.token.class-name{color:#ffb86c}.token.keyword{color:#ff79c6}.token.boolean{color:#ffb86c}.token.operator{color:#8be9fd}.token.char{color:#ff879d}.token.regex{color:#50fa7b}.token.variable{color:#50fa7b}.token.constant{color:#ffb86c}.token.symbol{color:#ffb86c}.token.builtin{color:#ff79c6}.token.attr-value{color:#7ec699}.token.deleted{color:#e2777a}.token.namespace{color:#e2777a}.token.bold{font-weight:700}.token.italic{font-style:italic}.token{color:#ff79c6}.language-cpp .token.string{color:#8be9fd}.language-c .token.string{color:#8be9fd}.language-css .token.selector{color:#50fa7b}.language-css .token.property{color:#ffb86c}.language-java span.token.class-name{color:#8be9fd}.language-java .token.class-name{color:#8be9fd}.language-markup .token.attr-value{color:#66d9ef}.language-markup .token.tag{color:#50fa7b}.language-objectivec .token.property{color:#66d9ef}.language-objectivec .token.string{color:#50fa7b}.language-php .token.boolean{color:#8be9fd}.language-php .token.function{color:#ff79c6}.language-php .token.keyword{color:#66d9ef}.language-ruby .token.symbol{color:#8be9fd}.language-ruby .token.class-name{color:#cfcfc2}pre.line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre.line-numbers>code{position:relative;white-space:inherit}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{pointer-events:none;display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}div.code-toolbar{position:relative}div.code-toolbar>.toolbar{position:absolute;top:.3em;right:.2em;transition:opacity .3s ease-in-out;opacity:0}div.code-toolbar:hover>.toolbar{opacity:1}div.code-toolbar>.toolbar .toolbar-item{display:inline-block;padding-right:20px}div.code-toolbar>.toolbar a{cursor:pointer}div.code-toolbar>.toolbar button{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}div.code-toolbar>.toolbar a,div.code-toolbar>.toolbar button,div.code-toolbar>.toolbar span{color:#ccc;font-size:.8em;padding:.5em;background:#6272a4;border-radius:.5em}div.code-toolbar>.toolbar a:focus,div.code-toolbar>.toolbar a:hover,div.code-toolbar>.toolbar button:focus,div.code-toolbar>.toolbar button:hover,div.code-toolbar>.toolbar span:focus,div.code-toolbar>.toolbar span:hover{color:inherit;text-decoration:none;background-color:#50fa7b} -------------------------------------------------------------------------------- /dist/css/dracula-prism.css: -------------------------------------------------------------------------------- 1 | /* PrismJS 1.14.0 2 | http://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+actionscript+ada+apacheconf+apl+applescript+c+arff+asciidoc+asm6502+aspnet+autohotkey+autoit+bash+basic+batch+bison+brainfuck+bro+cpp+csharp+arduino+coffeescript+clojure+ruby+csp+css-extras+d+dart+diff+django+docker+eiffel+elixir+elm+markup-templating+erlang+fsharp+flow+fortran+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+jolie+json+julia+keyman+kotlin+latex+less+liquid+lisp+livescript+lolcode+lua+makefile+markdown+erb+matlab+mel+mizar+monkey+n4js+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+php+php-extras+sql+powershell+processing+prolog+properties+protobuf+pug+puppet+pure+python+q+qore+r+jsx+typescript+renpy+reason+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+plsql+soy+stylus+swift+tcl+textile+twig+tsx+vbnet+velocity+verilog+vhdl+vim+visual-basic+wasm+wiki+xeora+xojo+yaml&plugins=line-numbers+toolbar+show-language */ 3 | /** 4 | * prism.js default theme for JavaScript, CSS and HTML 5 | * Based on dabblet (http://dabblet.com) 6 | * @author Lea Verou 7 | */ 8 | 9 | /* 10 | * Dracula Theme for Prism.JS 11 | * 12 | * @author Gustavo Costa 13 | * e-mail: gusbemacbe@gmail.com 14 | * 15 | * @contributor Jon Leopard 16 | * e-mail: jonlprd@gmail.com 17 | * 18 | * @license MIT 2016-2020 19 | */ 20 | 21 | /* Scrollbars */ 22 | 23 | :root 24 | { 25 | --background: #282A36; 26 | --comment: #6272A4; 27 | --foreground: #F8F8F2; 28 | --selection: #44475A; 29 | 30 | --cyan: #8BE9FD; 31 | --green: #50FA7B; 32 | --orange: #FFB86C; 33 | --pink: #FF79C6; 34 | --purple: #BD93F9; 35 | --red: #FF5555; 36 | --yellow: #F1FA8C; 37 | 38 | /* Transparency */ 39 | 40 | /** 30% of transparency **/ 41 | --background-30: #282A3633; 42 | --comment-30: #6272A433; 43 | --foreground-30: #F8F8F233; 44 | --selection-30: #44475A33; 45 | 46 | --cyan-30: #8BE9FD33; 47 | --green-30: #50FA7B33; 48 | --orange-30: #FFB86C33; 49 | --pink-30: #FF79C633; 50 | --purple-30: #BD93F933; 51 | --red-30: #FF555533; 52 | --yellow-30: #F1FA8C33; 53 | 54 | /** 40% of transparency **/ 55 | --background-40: #282A3666; 56 | --comment-40: #6272A466; 57 | --foreground-40: #F8F8F266; 58 | --selection-40: #44475A66; 59 | 60 | --cyan-40: #8BE9FD66; 61 | --green-40: #50FA7B66; 62 | --orange-40: #FFB86C66; 63 | --pink-40: #FF79C666; 64 | --purple-40: #BD93F966; 65 | --red-40: #FF555566; 66 | --yellow-40: #F1FA8C66; 67 | } 68 | 69 | pre::-webkit-scrollbar 70 | { 71 | width: 14px; 72 | } 73 | 74 | pre::-webkit-scrollbar-track 75 | { 76 | background-color: var(--comment); 77 | border-radius: 0px; 78 | } 79 | 80 | pre::-webkit-scrollbar-thumb 81 | { 82 | background-color: var(--purple); 83 | border-radius: 0px; 84 | } 85 | 86 | /* Selection */ 87 | 88 | pre[class*="language-"]::-moz-selection, 89 | pre[class*="language-"] ::-moz-selection, 90 | code[class*="language-"]::-moz-selection, 91 | code[class*="language-"] ::-moz-selection 92 | { 93 | text-shadow: none; 94 | background-color: var(--selection); 95 | } 96 | 97 | pre[class*="language-"]::selection, 98 | pre[class*="language-"] ::selection, 99 | code[class*="language-"]::selection, 100 | code[class*="language-"] ::selection 101 | { 102 | text-shadow: none; 103 | background-color: var(--selection); 104 | } 105 | 106 | /* Line numbers */ 107 | 108 | pre.line-numbers 109 | { 110 | position: relative; 111 | padding-left: 3.8em; 112 | counter-reset: linenumber; 113 | } 114 | 115 | pre.line-numbers > code 116 | { 117 | position: relative; 118 | white-space: inherit; 119 | } 120 | 121 | .line-numbers .line-numbers-rows 122 | { 123 | position: absolute; 124 | pointer-events: none; 125 | top: 0; 126 | font-size: 100%; 127 | left: -3.8em; 128 | width: 3em; /* works for line-numbers below 1000 lines */ 129 | letter-spacing: -1px; 130 | border-right: 1px solid #999; 131 | 132 | -webkit-user-select: none; 133 | -moz-user-select: none; 134 | -ms-user-select: none; 135 | user-select: none; 136 | } 137 | 138 | .line-numbers-rows > span 139 | { 140 | pointer-events: none; 141 | display: block; 142 | counter-increment: linenumber; 143 | } 144 | 145 | .line-numbers-rows > span:before 146 | { 147 | content: counter(linenumber); 148 | color: #999; 149 | display: block; 150 | padding-right: 0.8em; 151 | text-align: right; 152 | } 153 | 154 | /* Toolbar for copying */ 155 | 156 | div.code-toolbar 157 | { 158 | position: relative; 159 | } 160 | 161 | div.code-toolbar > .toolbar 162 | { 163 | position: absolute; 164 | top: 0.3em; 165 | right: 0.2em; 166 | transition: opacity 0.3s ease-in-out; 167 | opacity: 0; 168 | } 169 | 170 | div.code-toolbar:hover > .toolbar 171 | { 172 | opacity: 1; 173 | } 174 | 175 | div.code-toolbar > .toolbar .toolbar-item 176 | { 177 | display: inline-block; 178 | padding-right: 20px; 179 | } 180 | 181 | div.code-toolbar > .toolbar a 182 | { 183 | cursor: pointer; 184 | } 185 | 186 | div.code-toolbar > .toolbar button 187 | { 188 | background: none; 189 | border: 0; 190 | color: inherit; 191 | font: inherit; 192 | line-height: normal; 193 | overflow: visible; 194 | padding: 0; 195 | -webkit-user-select: none; /* for button */ 196 | -moz-user-select: none; 197 | -ms-user-select: none; 198 | } 199 | 200 | div.code-toolbar > .toolbar a, 201 | div.code-toolbar > .toolbar button, 202 | div.code-toolbar > .toolbar span 203 | { 204 | color: var(--foreground); 205 | font-size: 0.8em; 206 | padding: 0.5em; 207 | background: var(--comment); 208 | border-radius: 0.5em; 209 | } 210 | 211 | div.code-toolbar > .toolbar a:hover, 212 | div.code-toolbar > .toolbar a:focus, 213 | div.code-toolbar > .toolbar button:hover, 214 | div.code-toolbar > .toolbar button:focus, 215 | div.code-toolbar > .toolbar span:hover, 216 | div.code-toolbar > .toolbar span:focus 217 | { 218 | color: inherit; 219 | text-decoration: none; 220 | background-color: var(--green); 221 | } 222 | 223 | /* Remove text shadow for printing */ 224 | 225 | @media print 226 | { 227 | code[class*="language-"], 228 | pre[class*="language-"] 229 | { 230 | text-shadow: none; 231 | } 232 | } 233 | 234 | code[class*="language-"], 235 | pre[class*="language-"] 236 | { 237 | color: var(--foreground); 238 | background: var(--background); 239 | text-shadow: none; 240 | font-family: PT Mono, Consolas, Monaco, "Andale Mono", "Ubuntu Mono", 241 | monospace; 242 | text-align: left; 243 | white-space: pre; 244 | word-spacing: normal; 245 | word-break: normal; 246 | word-wrap: normal; 247 | line-height: 1.5; 248 | 249 | -moz-tab-size: 4; 250 | -o-tab-size: 4; 251 | tab-size: 4; 252 | 253 | -webkit-hyphens: none; 254 | -moz-hyphens: none; 255 | -ms-hyphens: none; 256 | hyphens: none; 257 | } 258 | 259 | /* Code blocks */ 260 | 261 | pre[class*="language-"] 262 | { 263 | background: var(--background); 264 | border-radius: 0.5em; 265 | padding: 1em; 266 | margin: 0.5em 0; 267 | overflow: auto; 268 | height: auto; 269 | } 270 | 271 | :not(pre) > code[class*="language-"], 272 | pre[class*="language-"] 273 | { 274 | background: var(--background); 275 | } 276 | 277 | /* Inline code */ 278 | :not(pre) > code[class*="language-"] 279 | { 280 | padding: 4px 7px; 281 | border-radius: 0.3em; 282 | white-space: normal; 283 | } 284 | 285 | /* Code box limit */ 286 | 287 | .limit-300 288 | { 289 | height: 300px !important; 290 | } 291 | 292 | .limit-300 293 | { 294 | height: 400px !important; 295 | } 296 | 297 | .limit-500 298 | { 299 | height: 500px !important; 300 | } 301 | 302 | .limit-600 303 | { 304 | height: 600px !important; 305 | } 306 | 307 | .limit-700 308 | { 309 | height: 700px !important; 310 | } 311 | 312 | .limit-800 313 | { 314 | height: 800px !important; 315 | } 316 | 317 | .language-css 318 | { 319 | color: var(--purple); 320 | } 321 | 322 | .token 323 | { 324 | color: var(--pink); 325 | } 326 | 327 | .language-css .token 328 | { 329 | color: var(--pink); 330 | } 331 | 332 | .token.script 333 | { 334 | color: var(--foreground); 335 | } 336 | 337 | .token.bold 338 | { 339 | font-weight: bold; 340 | } 341 | 342 | .token.italic 343 | { 344 | font-style: italic; 345 | } 346 | 347 | .token.atrule, .token.attr-name, .token.attr-value 348 | { 349 | color: var(--green); 350 | } 351 | 352 | .language-css .token.atrule 353 | { 354 | color: var(--purple); 355 | } 356 | 357 | .language-html .token.attr-value, .language-markup .token.attr-value 358 | { 359 | color: var(--yellow); 360 | } 361 | 362 | .token.boolean 363 | { 364 | color: var(--purple); 365 | } 366 | 367 | .token.builtin, .token.class-name 368 | { 369 | color: var(--cyan); 370 | } 371 | 372 | .token.comment 373 | { 374 | color: var(--comment); 375 | } 376 | 377 | .token.constant 378 | { 379 | color: var(--purple); 380 | } 381 | 382 | .language-javascript .token.constant 383 | { 384 | color: var(--orange); 385 | font-style: italic; 386 | } 387 | 388 | .token.entity 389 | { 390 | color: var(--pink); 391 | } 392 | 393 | .language-css .token.entity 394 | { 395 | color: var(--green); 396 | } 397 | 398 | .language-html .token.entity.named-entity 399 | { 400 | color: var(--purple); 401 | } 402 | 403 | .language-html .token.entity:not(.named-entity) 404 | { 405 | color: var(--pink); 406 | } 407 | 408 | .language-markup .token.entity.named-entity 409 | { 410 | color: var(--purple); 411 | } 412 | 413 | .language-markup .token.entity:not(.named-entity) 414 | { 415 | color: var(--pink); 416 | } 417 | 418 | .token.function 419 | { 420 | color: var(--green); 421 | } 422 | 423 | .language-css .token.function 424 | { 425 | color: var(--cyan); 426 | } 427 | 428 | .token.important, .token.keyword 429 | { 430 | color: var(--pink); 431 | } 432 | 433 | .token.prolog 434 | { 435 | color: var(--foreground); 436 | } 437 | 438 | .token.property 439 | { 440 | color: var(--orange); 441 | } 442 | 443 | .language-css .token.property 444 | { 445 | color: var(--cyan); 446 | } 447 | 448 | .token.punctuation 449 | { 450 | color: var(--pink); 451 | } 452 | 453 | .language-css .token.punctuation 454 | { 455 | color: var(--orange); 456 | } 457 | 458 | .language-html .token.punctuation, .language-markup .token.punctuation 459 | { 460 | color: var(--foreground); 461 | } 462 | 463 | .token.selector 464 | { 465 | color: var(--pink); 466 | } 467 | 468 | .language-css .token.selector 469 | { 470 | color: var(--green); 471 | } 472 | 473 | .token.regex 474 | { 475 | color: var(--red); 476 | } 477 | 478 | .language-css .token.rule:not(.atrule) 479 | { 480 | color: var(--foreground); 481 | } 482 | 483 | .token.string 484 | { 485 | color: var(--yellow); 486 | } 487 | 488 | .token.tag 489 | { 490 | color: var(--pink); 491 | } 492 | 493 | .token.url 494 | { 495 | color: var(--cyan); 496 | } 497 | 498 | .language-css .token.url 499 | { 500 | color: var(--orange); 501 | } 502 | 503 | .token.variable 504 | { 505 | color: var(--comment); 506 | } 507 | 508 | .token.number 509 | { 510 | color: rgba(189, 147, 249, 1); 511 | } 512 | 513 | .token.operator 514 | { 515 | color: rgba(139, 233, 253, 1); 516 | } 517 | 518 | .token.char 519 | { 520 | color: rgba(255, 135, 157, 1); 521 | } 522 | 523 | .token.symbol 524 | { 525 | color: rgba(255, 184, 108, 1); 526 | } 527 | 528 | .token.deleted 529 | { 530 | color: #e2777a; 531 | } 532 | 533 | .token.namespace 534 | { 535 | color: #e2777a; 536 | } 537 | 538 | /* Line Highlighter */ 539 | 540 | .highlight-line 541 | { 542 | color: inherit; 543 | display: inline-block; 544 | text-decoration: none; 545 | 546 | border-radius: 4px; 547 | padding: 2px 10px; 548 | } 549 | 550 | .highlight-line:empty:before 551 | { 552 | content: " "; 553 | } 554 | 555 | .highlight-line:not(:last-child) 556 | { 557 | min-width: 100%; 558 | } 559 | 560 | .highlight-line .highlight-line:not(:last-child) 561 | { 562 | min-width: 0; 563 | } 564 | 565 | .highlight-line-isdir 566 | { 567 | color: var(--foreground); 568 | background-color: var(--selection-30); 569 | } 570 | 571 | .highlight-line-active 572 | { 573 | background-color: var(--comment-30); 574 | } 575 | 576 | .highlight-line-add 577 | { 578 | background-color: var(--green-30); 579 | } 580 | 581 | .highlight-line-remove 582 | { 583 | background-color: var(--red-30); 584 | } 585 | -------------------------------------------------------------------------------- /dist/css/dracula-prism.min.css: -------------------------------------------------------------------------------- 1 | :root{--background:#282A36;--comment:#6272A4;--foreground:#F8F8F2;--selection:#44475A;--cyan:#8BE9FD;--green:#50FA7B;--orange:#FFB86C;--pink:#FF79C6;--purple:#BD93F9;--red:#FF5555;--yellow:#F1FA8C;--background-30:#282A3633;--comment-30:#6272A433;--foreground-30:#F8F8F233;--selection-30:#44475A33;--cyan-30:#8BE9FD33;--green-30:#50FA7B33;--orange-30:#FFB86C33;--pink-30:#FF79C633;--purple-30:#BD93F933;--red-30:#FF555533;--yellow-30:#F1FA8C33;--background-40:#282A3666;--comment-40:#6272A466;--foreground-40:#F8F8F266;--selection-40:#44475A66;--cyan-40:#8BE9FD66;--green-40:#50FA7B66;--orange-40:#FFB86C66;--pink-40:#FF79C666;--purple-40:#BD93F966;--red-40:#FF555566;--yellow-40:#F1FA8C66}pre::-webkit-scrollbar{width:14px}pre::-webkit-scrollbar-track{background-color:var(--comment);border-radius:0}pre::-webkit-scrollbar-thumb{background-color:var(--purple);border-radius:0}code[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,pre[class*=language-]::-moz-selection{text-shadow:none;background-color:var(--selection)}code[class*=language-] ::selection,code[class*=language-]::selection,pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background-color:var(--selection)}pre.line-numbers{position:relative;padding-left:3.8em;counter-reset:linenumber}pre.line-numbers>code{position:relative;white-space:inherit}.line-numbers .line-numbers-rows{position:absolute;pointer-events:none;top:0;font-size:100%;left:-3.8em;width:3em;letter-spacing:-1px;border-right:1px solid #999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.line-numbers-rows>span{pointer-events:none;display:block;counter-increment:linenumber}.line-numbers-rows>span:before{content:counter(linenumber);color:#999;display:block;padding-right:.8em;text-align:right}div.code-toolbar{position:relative}div.code-toolbar>.toolbar{position:absolute;top:.3em;right:.2em;transition:opacity .3s ease-in-out;opacity:0}div.code-toolbar:hover>.toolbar{opacity:1}div.code-toolbar>.toolbar .toolbar-item{display:inline-block;padding-right:20px}div.code-toolbar>.toolbar a{cursor:pointer}div.code-toolbar>.toolbar button{background:0 0;border:0;color:inherit;font:inherit;line-height:normal;overflow:visible;padding:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}div.code-toolbar>.toolbar a,div.code-toolbar>.toolbar button,div.code-toolbar>.toolbar span{color:var(--foreground);font-size:.8em;padding:.5em;background:var(--comment);border-radius:.5em}div.code-toolbar>.toolbar a:focus,div.code-toolbar>.toolbar a:hover,div.code-toolbar>.toolbar button:focus,div.code-toolbar>.toolbar button:hover,div.code-toolbar>.toolbar span:focus,div.code-toolbar>.toolbar span:hover{color:inherit;text-decoration:none;background-color:var(--green)}@media print{code[class*=language-],pre[class*=language-]{text-shadow:none}}code[class*=language-],pre[class*=language-]{color:var(--foreground);background:var(--background);text-shadow:none;font-family:PT Mono,Consolas,Monaco,"Andale Mono","Ubuntu Mono",monospace;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{background:var(--background);border-radius:.5em;padding:1em;margin:.5em 0;overflow:auto;height:auto}:not(pre)>code[class*=language-],pre[class*=language-]{background:var(--background)}:not(pre)>code[class*=language-]{padding:4px 7px;border-radius:.3em;white-space:normal}.limit-300{height:300px!important}.limit-300{height:400px!important}.limit-500{height:500px!important}.limit-600{height:600px!important}.limit-700{height:700px!important}.limit-800{height:800px!important}.language-css{color:var(--purple)}.token{color:var(--pink)}.language-css .token{color:var(--pink)}.token.script{color:var(--foreground)}.token.bold{font-weight:700}.token.italic{font-style:italic}.token.atrule,.token.attr-name,.token.attr-value{color:var(--green)}.language-css .token.atrule{color:var(--purple)}.language-html .token.attr-value,.language-markup .token.attr-value{color:var(--yellow)}.token.boolean{color:var(--purple)}.token.builtin,.token.class-name{color:var(--cyan)}.token.comment{color:var(--comment)}.token.constant{color:var(--purple)}.language-javascript .token.constant{color:var(--orange);font-style:italic}.token.entity{color:var(--pink)}.language-css .token.entity{color:var(--green)}.language-html .token.entity.named-entity{color:var(--purple)}.language-html .token.entity:not(.named-entity){color:var(--pink)}.language-markup .token.entity.named-entity{color:var(--purple)}.language-markup .token.entity:not(.named-entity){color:var(--pink)}.token.function{color:var(--green)}.language-css .token.function{color:var(--cyan)}.token.important,.token.keyword{color:var(--pink)}.token.prolog{color:var(--foreground)}.token.property{color:var(--orange)}.language-css .token.property{color:var(--cyan)}.token.punctuation{color:var(--pink)}.language-css .token.punctuation{color:var(--orange)}.language-html .token.punctuation,.language-markup .token.punctuation{color:var(--foreground)}.token.selector{color:var(--pink)}.language-css .token.selector{color:var(--green)}.token.regex{color:var(--red)}.language-css .token.rule:not(.atrule){color:var(--foreground)}.token.string{color:var(--yellow)}.token.tag{color:var(--pink)}.token.url{color:var(--cyan)}.language-css .token.url{color:var(--orange)}.token.variable{color:var(--comment)}.token.number{color:rgba(189,147,249,1)}.token.operator{color:rgba(139,233,253,1)}.token.char{color:rgba(255,135,157,1)}.token.symbol{color:rgba(255,184,108,1)}.token.deleted{color:#e2777a}.token.namespace{color:#e2777a}.highlight-line{color:inherit;display:inline-block;text-decoration:none;border-radius:4px;padding:2px 10px}.highlight-line:empty:before{content:" "}.highlight-line:not(:last-child){min-width:100%}.highlight-line .highlight-line:not(:last-child){min-width:0}.highlight-line-isdir{color:var(--foreground);background-color:var(--selection-30)}.highlight-line-active{background-color:var(--comment-30)}.highlight-line-add{background-color:var(--green-30)}.highlight-line-remove{background-color:var(--red-30)} -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "dracula-prism", 3 | "version": "2.1.16", 4 | "description": "A dark theme for Prism.js", 5 | "main": "index.js", 6 | "scripts": { 7 | "start": "react-scripts start", 8 | "build": "react-scripts build", 9 | "test": "react-scripts test", 10 | "eject": "react-scripts eject", 11 | "hello": "echo 'Hello from Transilvania'" 12 | }, 13 | "repository": { 14 | "type": "git", 15 | "url": "git+https://github.com/dracula/prism.git" 16 | }, 17 | "keywords": [ 18 | "dark", 19 | "dark-theme", 20 | "dracula", 21 | "dracula-theme", 22 | "prism", 23 | "prismjs", 24 | "syntax-highlighting" 25 | ], 26 | "author": "Gustavo Costa", 27 | "license": "MIT", 28 | "bugs": { 29 | "url": "https://github.com/dracula/prism/issues" 30 | }, 31 | "homepage": "https://github.com/dracula/prism#readme", 32 | "devDependencies": { 33 | "@11ty/eleventy-plugin-syntaxhighlight": "^4.0.0", 34 | "@testing-library/jest-dom": "^5.16.2", 35 | "@testing-library/react": "^12.1.3", 36 | "@testing-library/user-event": "^13.5.0", 37 | "bootstrap": "^5.1.3", 38 | "follow-redirects": ">=1.14.9", 39 | "markdown-it": ">=12.3.2", 40 | "prismjs": "^1.27.0", 41 | "react": "^17.0.2", 42 | "react-dom": "^17.0.2", 43 | "react-scripts": "^5.0.0", 44 | "web-vitals": "^2.1.4" 45 | }, 46 | "eslintConfig": { 47 | "extends": [ 48 | "react-app", 49 | "react-app/jest" 50 | ] 51 | }, 52 | "files": [ 53 | "dist", 54 | "INSTALL.md" 55 | ], 56 | "browserslist": { 57 | "production": [ 58 | ">0.2%", 59 | "not dead", 60 | "not op_mini all" 61 | ], 62 | "development": [ 63 | "last 1 chrome version", 64 | "last 1 firefox version", 65 | "last 1 safari version" 66 | ] 67 | } 68 | } 69 | -------------------------------------------------------------------------------- /screenshot.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/screenshot.png -------------------------------------------------------------------------------- /src/css/dracula-prism-old.css: -------------------------------------------------------------------------------- 1 | /* PrismJS 1.14.0 2 | http://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+actionscript+ada+apacheconf+apl+applescript+c+arff+asciidoc+asm6502+aspnet+autohotkey+autoit+bash+basic+batch+bison+brainfuck+bro+cpp+csharp+arduino+coffeescript+clojure+ruby+csp+css-extras+d+dart+diff+django+docker+eiffel+elixir+elm+markup-templating+erlang+fsharp+flow+fortran+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+jolie+json+julia+keyman+kotlin+latex+less+liquid+lisp+livescript+lolcode+lua+makefile+markdown+erb+matlab+mel+mizar+monkey+n4js+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+php+php-extras+sql+powershell+processing+prolog+properties+protobuf+pug+puppet+pure+python+q+qore+r+jsx+typescript+renpy+reason+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+plsql+soy+stylus+swift+tcl+textile+twig+tsx+vbnet+velocity+verilog+vhdl+vim+visual-basic+wasm+wiki+xeora+xojo+yaml&plugins=line-numbers+toolbar+show-language */ 3 | /** 4 | * prism.js default theme for JavaScript, CSS and HTML 5 | * Based on dabblet (http://dabblet.com) 6 | * @author Lea Verou 7 | */ 8 | 9 | /* 10 | * Old Dracula Theme for Prism.JS 11 | * 12 | * @author Gustavo Costa 13 | * e-mail: gusbemacbe@gmail.com 14 | * 15 | * @contributor Jon Leopard 16 | * e-mail: jonlprd@gmail.com 17 | * 18 | * @license MIT 2016-2018 19 | */ 20 | 21 | pre::-webkit-scrollbar 22 | { 23 | width: 14px; 24 | } 25 | 26 | pre::-webkit-scrollbar-track 27 | { 28 | background-color: #6272A4; 29 | border-radius: 0px; 30 | } 31 | 32 | pre::-webkit-scrollbar-thumb 33 | { 34 | background-color: #BD93F9; 35 | border-radius: 0px; 36 | } 37 | 38 | code[class*="language-"], 39 | pre[class*="language-"] 40 | { 41 | color: #F2F2F2; 42 | background: #282936; 43 | text-shadow: none; 44 | font-family: "Source Mono", PT Mono, Consolas, Monaco, "Andale Mono", "Ubuntu Mono", monospace; 45 | text-align: left; 46 | white-space: pre; 47 | word-spacing: normal; 48 | word-break: normal; 49 | word-wrap: normal; 50 | line-height: 1.5; 51 | 52 | -moz-tab-size: 4; 53 | -o-tab-size: 4; 54 | tab-size: 4; 55 | 56 | -webkit-hyphens: none; 57 | -moz-hyphens: none; 58 | -ms-hyphens: none; 59 | hyphens: none; 60 | } 61 | 62 | pre[class*="language-"]::-moz-selection, 63 | pre[class*="language-"] ::-moz-selection, 64 | code[class*="language-"]::-moz-selection, 65 | code[class*="language-"] ::-moz-selection 66 | { 67 | text-shadow: none; 68 | background-color: #5A5F80; 69 | } 70 | 71 | pre[class*="language-"]::selection, 72 | pre[class*="language-"] ::selection, 73 | code[class*="language-"]::selection, 74 | code[class*="language-"] ::selection 75 | { 76 | text-shadow: none; 77 | background-color: #5A5F80; 78 | } 79 | 80 | @media print 81 | { 82 | code[class*="language-"], 83 | pre[class*="language-"] 84 | 85 | { 86 | text-shadow: none; 87 | } 88 | } 89 | 90 | /* Code blocks */ 91 | pre[class*="language-"] 92 | { 93 | background: #282936; 94 | border-radius: 0.5em; 95 | height: auto; 96 | margin: 0.5em 0; 97 | overflow: auto; 98 | } 99 | 100 | :not(pre) > code[class*="language-"], 101 | pre[class*="language-"] 102 | { 103 | background: #282936; 104 | } 105 | 106 | /* Inline code */ 107 | :not(pre) > code[class*="language-"] 108 | { 109 | border-radius: 0.3em; 110 | padding: 4px 7px; 111 | white-space: normal; 112 | } 113 | 114 | .limit-300 115 | { 116 | height: 300px !important; 117 | } 118 | 119 | .limit-400 120 | { 121 | height: 400px !important; 122 | } 123 | 124 | .limit-500 125 | { 126 | height: 500px !important; 127 | } 128 | 129 | .limit-600 130 | { 131 | height: 600px !important; 132 | } 133 | 134 | .limit-700 135 | { 136 | height: 700px !important; 137 | } 138 | 139 | .limit-800 140 | { 141 | height: 800px !important; 142 | } 143 | 144 | .token.comment 145 | { 146 | color: #6272A4; 147 | } 148 | 149 | .token.prolog 150 | { 151 | color: #CFCFC2; 152 | } 153 | 154 | .token.tag 155 | { 156 | color: #DC68AA; 157 | } 158 | 159 | .token.entity 160 | { 161 | color: #8BE9FD; 162 | } 163 | 164 | .token.atrule 165 | { 166 | color: #62EF75; 167 | } 168 | 169 | .token.url 170 | { 171 | color: #66D9EF; 172 | } 173 | 174 | .token.selector 175 | { 176 | color: #CFCFC2; 177 | } 178 | 179 | .token.string 180 | { 181 | color: #F1FA8C; 182 | } 183 | 184 | .token.property 185 | { 186 | color: #FFB86C; 187 | } 188 | 189 | .token.important 190 | { 191 | color: #FF79C6; 192 | font-weight: bold; 193 | } 194 | 195 | .token.number 196 | { 197 | color: #BD93F9; 198 | } 199 | 200 | .token.function 201 | { 202 | color: #50FA7B; 203 | } 204 | 205 | .token.class-name 206 | { 207 | color: #FFB86C; 208 | } 209 | 210 | .token.keyword 211 | { 212 | color: #FF79C6; 213 | } 214 | 215 | .token.boolean 216 | { 217 | color: #FFB86C; 218 | } 219 | 220 | .token.operator 221 | { 222 | color: #8BE9FD; 223 | } 224 | 225 | .token.char 226 | { 227 | color: #FF879D; 228 | } 229 | 230 | .token.regex 231 | { 232 | color: #50FA7B; 233 | } 234 | 235 | .token.variable 236 | { 237 | color: #50FA7B; 238 | } 239 | 240 | .token.constant 241 | { 242 | color: #FFB86C; 243 | } 244 | 245 | .token.symbol 246 | { 247 | color: #FFB86C; 248 | } 249 | 250 | .token.builtin 251 | { 252 | color: #FF79C6; 253 | } 254 | 255 | .token.attr-value 256 | { 257 | color: #7ec699; 258 | } 259 | 260 | .token.deleted 261 | { 262 | color: #E2777A; 263 | } 264 | 265 | .token.namespace 266 | { 267 | color: #E2777A; 268 | } 269 | 270 | .token.bold 271 | { 272 | font-weight: bold; 273 | } 274 | 275 | .token.italic 276 | { 277 | font-style: italic; 278 | } 279 | 280 | .token 281 | { 282 | color: #FF79C6; 283 | } 284 | 285 | .language-cpp .token.string 286 | { 287 | color: #8BE9FD; 288 | } 289 | 290 | .language-c .token.string 291 | { 292 | color: #8BE9FD; 293 | } 294 | 295 | .language-css .token.selector 296 | { 297 | color: #50FA7B; 298 | } 299 | 300 | .language-css .token.property 301 | { 302 | color: #FFB86C; 303 | } 304 | 305 | .language-java span.token.class-name 306 | { 307 | color: #8BE9FD; 308 | } 309 | 310 | .language-java .token.class-name 311 | { 312 | color: #8BE9FD; 313 | } 314 | 315 | .language-markup .token.attr-value 316 | { 317 | color: #66D9EF; 318 | } 319 | 320 | .language-markup .token.tag 321 | { 322 | color: #50FA7B; 323 | } 324 | 325 | .language-objectivec .token.property 326 | { 327 | color: #66D9EF; 328 | } 329 | 330 | .language-objectivec .token.string 331 | { 332 | color: #50FA7B; 333 | } 334 | 335 | .language-php .token.boolean 336 | { 337 | color: #8BE9FD; 338 | } 339 | 340 | .language-php .token.function 341 | { 342 | color: #FF79C6; 343 | } 344 | 345 | .language-php .token.keyword 346 | { 347 | color: #66D9EF; 348 | } 349 | 350 | .language-ruby .token.symbol 351 | { 352 | color: #8BE9FD; 353 | } 354 | 355 | .language-ruby .token.class-name 356 | { 357 | color: #CFCFC2; 358 | } 359 | 360 | pre.line-numbers 361 | { 362 | position: relative; 363 | padding-left: 3.8em; 364 | counter-reset: linenumber; 365 | } 366 | 367 | pre.line-numbers > code 368 | { 369 | position: relative; 370 | white-space: inherit; 371 | } 372 | 373 | .line-numbers .line-numbers-rows 374 | { 375 | position: absolute; 376 | pointer-events: none; 377 | top: 0; 378 | font-size: 100%; 379 | left: -3.8em; 380 | width: 3em; /* works for line-numbers below 1000 lines */ 381 | letter-spacing: -1px; 382 | border-right: 1px solid #999; 383 | 384 | -webkit-user-select: none; 385 | -moz-user-select: none; 386 | -ms-user-select: none; 387 | user-select: none; 388 | } 389 | 390 | .line-numbers-rows > span 391 | { 392 | pointer-events: none; 393 | display: block; 394 | counter-increment: linenumber; 395 | } 396 | 397 | .line-numbers-rows > span:before 398 | { 399 | content: counter(linenumber); 400 | color: #999; 401 | display: block; 402 | padding-right: 0.8em; 403 | text-align: right; 404 | } 405 | 406 | div.code-toolbar 407 | { 408 | position: relative; 409 | } 410 | 411 | div.code-toolbar > .toolbar 412 | { 413 | position: absolute; 414 | top: 0.3em; 415 | right: 0.2em; 416 | transition: opacity 0.3s ease-in-out; 417 | opacity: 0; 418 | } 419 | 420 | div.code-toolbar:hover > .toolbar 421 | { 422 | opacity: 1; 423 | } 424 | 425 | div.code-toolbar > .toolbar .toolbar-item 426 | { 427 | display: inline-block; 428 | padding-right: 20px; 429 | } 430 | 431 | div.code-toolbar > .toolbar a 432 | { 433 | cursor: pointer; 434 | } 435 | 436 | div.code-toolbar > .toolbar button 437 | { 438 | background: none; 439 | border: 0; 440 | color: inherit; 441 | font: inherit; 442 | line-height: normal; 443 | overflow: visible; 444 | padding: 0; 445 | -webkit-user-select: none; /* for button */ 446 | -moz-user-select: none; 447 | -ms-user-select: none; 448 | } 449 | 450 | div.code-toolbar > .toolbar a, 451 | div.code-toolbar > .toolbar button, 452 | div.code-toolbar > .toolbar span 453 | { 454 | color: #CCC; 455 | font-size: 0.8em; 456 | padding: 0.5em; 457 | background: #6272A4; 458 | border-radius: 0.5em; 459 | } 460 | 461 | div.code-toolbar > .toolbar a:hover, 462 | div.code-toolbar > .toolbar a:focus, 463 | div.code-toolbar > .toolbar button:hover, 464 | div.code-toolbar > .toolbar button:focus, 465 | div.code-toolbar > .toolbar span:hover, 466 | div.code-toolbar > .toolbar span:focus 467 | { 468 | color: inherit; 469 | text-decoration: none; 470 | background-color: #50FA7B; 471 | } 472 | -------------------------------------------------------------------------------- /src/css/dracula-prism.css: -------------------------------------------------------------------------------- 1 | /* PrismJS 1.14.0 2 | http://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript+abap+actionscript+ada+apacheconf+apl+applescript+c+arff+asciidoc+asm6502+aspnet+autohotkey+autoit+bash+basic+batch+bison+brainfuck+bro+cpp+csharp+arduino+coffeescript+clojure+ruby+csp+css-extras+d+dart+diff+django+docker+eiffel+elixir+elm+markup-templating+erlang+fsharp+flow+fortran+gedcom+gherkin+git+glsl+go+graphql+groovy+haml+handlebars+haskell+haxe+http+hpkp+hsts+ichigojam+icon+inform7+ini+io+j+java+jolie+json+julia+keyman+kotlin+latex+less+liquid+lisp+livescript+lolcode+lua+makefile+markdown+erb+matlab+mel+mizar+monkey+n4js+nasm+nginx+nim+nix+nsis+objectivec+ocaml+opencl+oz+parigp+parser+pascal+perl+php+php-extras+sql+powershell+processing+prolog+properties+protobuf+pug+puppet+pure+python+q+qore+r+jsx+typescript+renpy+reason+rest+rip+roboconf+crystal+rust+sas+sass+scss+scala+scheme+smalltalk+smarty+plsql+soy+stylus+swift+tcl+textile+twig+tsx+vbnet+velocity+verilog+vhdl+vim+visual-basic+wasm+wiki+xeora+xojo+yaml&plugins=line-numbers+toolbar+show-language */ 3 | /** 4 | * prism.js default theme for JavaScript, CSS and HTML 5 | * Based on dabblet (http://dabblet.com) 6 | * @author Lea Verou 7 | */ 8 | 9 | /* 10 | * Dracula Theme for Prism.JS 11 | * 12 | * @author Gustavo Costa 13 | * e-mail: gusbemacbe@gmail.com 14 | * 15 | * @contributor Jon Leopard 16 | * e-mail: jonlprd@gmail.com 17 | * 18 | * @license MIT 2016-2020 19 | */ 20 | 21 | /* Scrollbars */ 22 | 23 | :root 24 | { 25 | --background: #282A36; 26 | --comment: #6272A4; 27 | --foreground: #F8F8F2; 28 | --selection: #44475A; 29 | 30 | --cyan: #8BE9FD; 31 | --green: #50FA7B; 32 | --orange: #FFB86C; 33 | --pink: #FF79C6; 34 | --purple: #BD93F9; 35 | --red: #FF5555; 36 | --yellow: #F1FA8C; 37 | 38 | /* Transparency */ 39 | 40 | /** 30% of transparency **/ 41 | --background-30: #282A3633; 42 | --comment-30: #6272A433; 43 | --foreground-30: #F8F8F233; 44 | --selection-30: #44475A33; 45 | 46 | --cyan-30: #8BE9FD33; 47 | --green-30: #50FA7B33; 48 | --orange-30: #FFB86C33; 49 | --pink-30: #FF79C633; 50 | --purple-30: #BD93F933; 51 | --red-30: #FF555533; 52 | --yellow-30: #F1FA8C33; 53 | 54 | /** 40% of transparency **/ 55 | --background-40: #282A3666; 56 | --comment-40: #6272A466; 57 | --foreground-40: #F8F8F266; 58 | --selection-40: #44475A66; 59 | 60 | --cyan-40: #8BE9FD66; 61 | --green-40: #50FA7B66; 62 | --orange-40: #FFB86C66; 63 | --pink-40: #FF79C666; 64 | --purple-40: #BD93F966; 65 | --red-40: #FF555566; 66 | --yellow-40: #F1FA8C66; 67 | } 68 | 69 | pre::-webkit-scrollbar 70 | { 71 | width: 14px; 72 | } 73 | 74 | pre::-webkit-scrollbar-track 75 | { 76 | background-color: var(--comment); 77 | border-radius: 0px; 78 | } 79 | 80 | pre::-webkit-scrollbar-thumb 81 | { 82 | background-color: var(--purple); 83 | border-radius: 0px; 84 | } 85 | 86 | /* Selection */ 87 | 88 | pre[class*="language-"]::-moz-selection, 89 | pre[class*="language-"] ::-moz-selection, 90 | code[class*="language-"]::-moz-selection, 91 | code[class*="language-"] ::-moz-selection 92 | { 93 | text-shadow: none; 94 | background-color: var(--selection); 95 | } 96 | 97 | pre[class*="language-"]::selection, 98 | pre[class*="language-"] ::selection, 99 | code[class*="language-"]::selection, 100 | code[class*="language-"] ::selection 101 | { 102 | text-shadow: none; 103 | background-color: var(--selection); 104 | } 105 | 106 | /* Line numbers */ 107 | 108 | pre.line-numbers 109 | { 110 | position: relative; 111 | padding-left: 3.8em; 112 | counter-reset: linenumber; 113 | } 114 | 115 | pre.line-numbers > code 116 | { 117 | position: relative; 118 | white-space: inherit; 119 | } 120 | 121 | .line-numbers .line-numbers-rows 122 | { 123 | position: absolute; 124 | pointer-events: none; 125 | top: 0; 126 | font-size: 100%; 127 | left: -3.8em; 128 | width: 3em; /* works for line-numbers below 1000 lines */ 129 | letter-spacing: -1px; 130 | border-right: 1px solid #999; 131 | 132 | -webkit-user-select: none; 133 | -moz-user-select: none; 134 | -ms-user-select: none; 135 | user-select: none; 136 | } 137 | 138 | .line-numbers-rows > span 139 | { 140 | pointer-events: none; 141 | display: block; 142 | counter-increment: linenumber; 143 | } 144 | 145 | .line-numbers-rows > span:before 146 | { 147 | content: counter(linenumber); 148 | color: #999; 149 | display: block; 150 | padding-right: 0.8em; 151 | text-align: right; 152 | } 153 | 154 | /* Toolbar for copying */ 155 | 156 | div.code-toolbar 157 | { 158 | position: relative; 159 | } 160 | 161 | div.code-toolbar > .toolbar 162 | { 163 | position: absolute; 164 | top: 0.3em; 165 | right: 0.2em; 166 | transition: opacity 0.3s ease-in-out; 167 | opacity: 0; 168 | } 169 | 170 | div.code-toolbar:hover > .toolbar 171 | { 172 | opacity: 1; 173 | } 174 | 175 | div.code-toolbar > .toolbar .toolbar-item 176 | { 177 | display: inline-block; 178 | padding-right: 20px; 179 | } 180 | 181 | div.code-toolbar > .toolbar a 182 | { 183 | cursor: pointer; 184 | } 185 | 186 | div.code-toolbar > .toolbar button 187 | { 188 | background: none; 189 | border: 0; 190 | color: inherit; 191 | font: inherit; 192 | line-height: normal; 193 | overflow: visible; 194 | padding: 0; 195 | -webkit-user-select: none; /* for button */ 196 | -moz-user-select: none; 197 | -ms-user-select: none; 198 | } 199 | 200 | div.code-toolbar > .toolbar a, 201 | div.code-toolbar > .toolbar button, 202 | div.code-toolbar > .toolbar span 203 | { 204 | color: var(--foreground); 205 | font-size: 0.8em; 206 | padding: 0.5em; 207 | background: var(--comment); 208 | border-radius: 0.5em; 209 | } 210 | 211 | div.code-toolbar > .toolbar a:hover, 212 | div.code-toolbar > .toolbar a:focus, 213 | div.code-toolbar > .toolbar button:hover, 214 | div.code-toolbar > .toolbar button:focus, 215 | div.code-toolbar > .toolbar span:hover, 216 | div.code-toolbar > .toolbar span:focus 217 | { 218 | color: inherit; 219 | text-decoration: none; 220 | background-color: var(--green); 221 | } 222 | 223 | /* Remove text shadow for printing */ 224 | 225 | @media print 226 | { 227 | code[class*="language-"], 228 | pre[class*="language-"] 229 | { 230 | text-shadow: none; 231 | } 232 | } 233 | 234 | code[class*="language-"], 235 | pre[class*="language-"] 236 | { 237 | color: var(--foreground); 238 | background: var(--background); 239 | text-shadow: none; 240 | font-family: PT Mono, Consolas, Monaco, "Andale Mono", "Ubuntu Mono", 241 | monospace; 242 | text-align: left; 243 | white-space: pre; 244 | word-spacing: normal; 245 | word-break: normal; 246 | word-wrap: normal; 247 | line-height: 1.5; 248 | 249 | -moz-tab-size: 4; 250 | -o-tab-size: 4; 251 | tab-size: 4; 252 | 253 | -webkit-hyphens: none; 254 | -moz-hyphens: none; 255 | -ms-hyphens: none; 256 | hyphens: none; 257 | } 258 | 259 | /* Code blocks */ 260 | 261 | pre[class*="language-"] 262 | { 263 | background: var(--background); 264 | border-radius: 0.5em; 265 | padding: 1em; 266 | margin: 0.5em 0; 267 | overflow: auto; 268 | height: auto; 269 | } 270 | 271 | :not(pre) > code[class*="language-"], 272 | pre[class*="language-"] 273 | { 274 | background: var(--background); 275 | } 276 | 277 | /* Inline code */ 278 | :not(pre) > code[class*="language-"] 279 | { 280 | padding: 4px 7px; 281 | border-radius: 0.3em; 282 | white-space: normal; 283 | } 284 | 285 | /* Code box limit */ 286 | 287 | .limit-300 288 | { 289 | height: 300px !important; 290 | } 291 | 292 | .limit-300 293 | { 294 | height: 400px !important; 295 | } 296 | 297 | .limit-500 298 | { 299 | height: 500px !important; 300 | } 301 | 302 | .limit-600 303 | { 304 | height: 600px !important; 305 | } 306 | 307 | .limit-700 308 | { 309 | height: 700px !important; 310 | } 311 | 312 | .limit-800 313 | { 314 | height: 800px !important; 315 | } 316 | 317 | .language-css 318 | { 319 | color: var(--purple); 320 | } 321 | 322 | .token 323 | { 324 | color: var(--pink); 325 | } 326 | 327 | .language-css .token 328 | { 329 | color: var(--pink); 330 | } 331 | 332 | .token.script 333 | { 334 | color: var(--foreground); 335 | } 336 | 337 | .token.bold 338 | { 339 | font-weight: bold; 340 | } 341 | 342 | .token.italic 343 | { 344 | font-style: italic; 345 | } 346 | 347 | .token.atrule, .token.attr-name, .token.attr-value 348 | { 349 | color: var(--green); 350 | } 351 | 352 | .language-css .token.atrule 353 | { 354 | color: var(--purple); 355 | } 356 | 357 | .language-html .token.attr-value, .language-markup .token.attr-value 358 | { 359 | color: var(--yellow); 360 | } 361 | 362 | .token.boolean 363 | { 364 | color: var(--purple); 365 | } 366 | 367 | .token.builtin, .token.class-name 368 | { 369 | color: var(--cyan); 370 | } 371 | 372 | .token.comment 373 | { 374 | color: var(--comment); 375 | } 376 | 377 | .token.constant 378 | { 379 | color: var(--purple); 380 | } 381 | 382 | .language-javascript .token.constant 383 | { 384 | color: var(--orange); 385 | font-style: italic; 386 | } 387 | 388 | .token.entity 389 | { 390 | color: var(--pink); 391 | } 392 | 393 | .language-css .token.entity 394 | { 395 | color: var(--green); 396 | } 397 | 398 | .language-html .token.entity.named-entity 399 | { 400 | color: var(--purple); 401 | } 402 | 403 | .language-html .token.entity:not(.named-entity) 404 | { 405 | color: var(--pink); 406 | } 407 | 408 | .language-markup .token.entity.named-entity 409 | { 410 | color: var(--purple); 411 | } 412 | 413 | .language-markup .token.entity:not(.named-entity) 414 | { 415 | color: var(--pink); 416 | } 417 | 418 | .token.function 419 | { 420 | color: var(--green); 421 | } 422 | 423 | .language-css .token.function 424 | { 425 | color: var(--cyan); 426 | } 427 | 428 | .token.important, .token.keyword 429 | { 430 | color: var(--pink); 431 | } 432 | 433 | .token.prolog 434 | { 435 | color: var(--foreground); 436 | } 437 | 438 | .token.property 439 | { 440 | color: var(--orange); 441 | } 442 | 443 | .language-css .token.property 444 | { 445 | color: var(--cyan); 446 | } 447 | 448 | .token.punctuation 449 | { 450 | color: var(--pink); 451 | } 452 | 453 | .language-css .token.punctuation 454 | { 455 | color: var(--orange); 456 | } 457 | 458 | .language-html .token.punctuation, .language-markup .token.punctuation 459 | { 460 | color: var(--foreground); 461 | } 462 | 463 | .token.selector 464 | { 465 | color: var(--pink); 466 | } 467 | 468 | .language-css .token.selector 469 | { 470 | color: var(--green); 471 | } 472 | 473 | .token.regex 474 | { 475 | color: var(--red); 476 | } 477 | 478 | .language-css .token.rule:not(.atrule) 479 | { 480 | color: var(--foreground); 481 | } 482 | 483 | .token.string 484 | { 485 | color: var(--yellow); 486 | } 487 | 488 | .token.tag 489 | { 490 | color: var(--pink); 491 | } 492 | 493 | .token.url 494 | { 495 | color: var(--cyan); 496 | } 497 | 498 | .language-css .token.url 499 | { 500 | color: var(--orange); 501 | } 502 | 503 | .token.variable 504 | { 505 | color: var(--comment); 506 | } 507 | 508 | .token.number 509 | { 510 | color: rgba(189, 147, 249, 1); 511 | } 512 | 513 | .token.operator 514 | { 515 | color: rgba(139, 233, 253, 1); 516 | } 517 | 518 | .token.char 519 | { 520 | color: rgba(255, 135, 157, 1); 521 | } 522 | 523 | .token.symbol 524 | { 525 | color: rgba(255, 184, 108, 1); 526 | } 527 | 528 | .token.deleted 529 | { 530 | color: #e2777a; 531 | } 532 | 533 | .token.namespace 534 | { 535 | color: #e2777a; 536 | } 537 | 538 | /* Line Highlighter */ 539 | 540 | .highlight-line 541 | { 542 | color: inherit; 543 | display: inline-block; 544 | text-decoration: none; 545 | 546 | border-radius: 4px; 547 | padding: 2px 10px; 548 | } 549 | 550 | .highlight-line:empty:before 551 | { 552 | content: " "; 553 | } 554 | 555 | .highlight-line:not(:last-child) 556 | { 557 | min-width: 100%; 558 | } 559 | 560 | .highlight-line .highlight-line:not(:last-child) 561 | { 562 | min-width: 0; 563 | } 564 | 565 | .highlight-line-isdir 566 | { 567 | color: var(--foreground); 568 | background-color: var(--selection-30); 569 | } 570 | 571 | .highlight-line-active 572 | { 573 | background-color: var(--comment-30); 574 | } 575 | 576 | .highlight-line-add 577 | { 578 | background-color: var(--green-30); 579 | } 580 | 581 | .highlight-line-remove 582 | { 583 | background-color: var(--red-30); 584 | } 585 | -------------------------------------------------------------------------------- /src/css/unofficial.css: -------------------------------------------------------------------------------- 1 | @import url("https://use.typekit.net/lcd0cmo.css"); 2 | 3 | /* Source Code Pro – Monospaced font */ 4 | 5 | @font-face 6 | { 7 | font-display: swap; 8 | font-family: "Source Mono"; 9 | font-style: normal; 10 | font-weight: normal; 11 | src: url("../fonts/source-code-pro-light.ttf") format("truetype"); 12 | } 13 | 14 | @font-face 15 | { 16 | font-display: swap; 17 | font-family: "Source Mono"; 18 | font-style: normal; 19 | font-weight: bold; 20 | src: url("../fonts/source-code-pro-bold.ttf") format("truetype"); 21 | } 22 | 23 | @font-face 24 | { 25 | font-display: swap; 26 | font-family: "Source Mono"; 27 | font-style: italic; 28 | font-weight: normal; 29 | src: url("../fonts/source-code-pro-light.ttf") format("truetype"); 30 | } 31 | 32 | @font-face 33 | { 34 | font-display: swap; 35 | font-family: "Source Mono"; 36 | font-style: italic; 37 | font-weight: bold; 38 | src: url("../fonts/source-code-pro-bold.ttf") format("truetype"); 39 | } 40 | 41 | /* Source Sans Pro – Sans-serifed font */ 42 | 43 | @font-face 44 | { 45 | font-display: swap; 46 | font-family: "Source Sans"; 47 | font-style: normal; 48 | font-weight: normal; 49 | src: url("../fonts/source-sans-pro-light.ttf") format("truetype"); 50 | } 51 | 52 | @font-face 53 | { 54 | font-display: swap; 55 | font-family: "Source Sans"; 56 | font-style: normal; 57 | font-weight: bold; 58 | src: url("../fonts/source-sans-pro-bold.ttf") format("truetype"); 59 | } 60 | 61 | @font-face 62 | { 63 | font-display: swap; 64 | font-family: "Source Sans"; 65 | font-style: italic; 66 | font-weight: normal; 67 | src: url("../fonts/source-sans-pro-light.ttf") format("truetype"); 68 | } 69 | 70 | @font-face 71 | { 72 | font-display: swap; 73 | font-family: "Source Sans"; 74 | font-style: italic; 75 | font-weight: bold; 76 | src: url("../fonts/source-sans-pro-bold.ttf") format("truetype"); 77 | } 78 | 79 | :root 80 | { 81 | /* 🇧🇷 Fontes */ 82 | /* 🇬🇧 Fonts */ 83 | --abril: abril-fatface, serif; 84 | --source-mono: "Source Mono", monospace; 85 | --source-sans: "Source Sans", sans-serif; 86 | 87 | /* 🇧🇷 Tipografia */ 88 | /* 🇬🇧 Typography */ 89 | --line-height: 1.5; 90 | 91 | /* 🇧🇷 Cores */ 92 | /* 🇬🇧 Colours */ 93 | --blue: #66D9EF; 94 | --green: #50FA7B; 95 | --orange: #FFB86C; 96 | --pink: #DC68AA; 97 | --purple: #383A59; 98 | --white: #F2F2F2; 99 | } 100 | 101 | *, 102 | *::before, 103 | *::after 104 | { 105 | box-sizing: border-box; 106 | } 107 | 108 | html 109 | { 110 | font-family: var(--source-sans); 111 | line-height: 1.15 !important; 112 | -webkit-text-size-adjust: 100%; 113 | -ms-text-size-adjust: 100%; 114 | -o-text-size-adjust: 100%; 115 | text-size-adjust: 100%; 116 | } 117 | 118 | html [type="button"] 119 | { 120 | -webkit-appearance: button; 121 | } 122 | 123 | @-ms-viewport 124 | { 125 | width: device-width; 126 | } 127 | 128 | body 129 | { 130 | background: var(--purple); 131 | background: var(--background); 132 | color: var(--white); 133 | font-family: var(--source-sans); 134 | font-size: 16px; 135 | padding: 30px; 136 | } 137 | 138 | a 139 | { 140 | color: var(--blue); 141 | text-decoration: none; 142 | -webkit-text-decoration-skip: objects; 143 | } 144 | 145 | a.blue 146 | { 147 | color: var(--blue); 148 | text-decoration: none; 149 | } 150 | 151 | a:hover 152 | { 153 | color: var(--blue); 154 | text-decoration: none; 155 | } 156 | 157 | a:[title]:hover:after 158 | { 159 | content: attr(title); 160 | position: absolute; 161 | left: 0; 162 | top: 100%; 163 | white-space: nowrap; 164 | z-index: 20; 165 | } 166 | 167 | code, pre, samp 168 | { 169 | font-family: var(--sans-mono); 170 | } 171 | 172 | code 173 | { 174 | word-break: break-word; 175 | } 176 | 177 | a > code 178 | { 179 | color: inherit; 180 | } 181 | 182 | pre 183 | { 184 | display: block; 185 | } 186 | 187 | pre code 188 | { 189 | font-size: inherit; 190 | color: inherit; 191 | word-break: normal; 192 | } 193 | 194 | h1 195 | { 196 | color: var(--blue); 197 | font-size: 72px; 198 | text-align: center; 199 | } 200 | 201 | h2 202 | { 203 | font-family: var(--source-sans); 204 | font-size: 2em; 205 | font-weight: 300; 206 | margin: 1em 0 .3em; 207 | } 208 | 209 | h2.subtitle 210 | { 211 | font-family: var(--source-sans); 212 | font-size: 28px; 213 | text-align: center; 214 | } 215 | 216 | h3 217 | { 218 | color: var(--blue); 219 | font-family: var(--abril); 220 | font-size: 3em; 221 | } 222 | 223 | h4 224 | { 225 | font-size: 2em; 226 | font-weight: 300; 227 | margin: 1em 0 .3em; 228 | } 229 | 230 | img[prism] 231 | { 232 | display: block; 233 | height: auto; 234 | margin: 0 auto; 235 | text-align: center; 236 | width: 220px; 237 | } 238 | 239 | p 240 | { 241 | margin: 0 0 .5em; 242 | text-align: justify; 243 | } 244 | 245 | samp 246 | { 247 | background: var(--purple); 248 | -webkit-border-radius: 0.4em; 249 | -moz-border-radius: 0.4em; 250 | border-radius: 0.4em; 251 | border: none; 252 | color: var(--white) !important; 253 | display: inline-block; 254 | font-family: var(--sans-mono), monospace; 255 | margin: -1px 0; 256 | padding: 0 .3em; 257 | white-space: no-wrap; 258 | } 259 | 260 | .autoria 261 | { 262 | padding: 50px; 263 | text-align: center; 264 | } 265 | 266 | .title 267 | { 268 | font-family: var(--abril); 269 | margin-top: 20px; 270 | } 271 | 272 | .gh-btns 273 | { 274 | text-align: center; 275 | margin: 3em 0 3em 0; 276 | } 277 | 278 | .gh-btns iframe 279 | { 280 | border: 0px solid transparent; 281 | } 282 | 283 | .love 284 | { 285 | color: var(--pink); 286 | font-size: 1.4em; 287 | 288 | display: inline-block; 289 | position: relative; 290 | top: .2em; 291 | transform: scale(.9); 292 | animation: love .5s linear infinite alternate-reverse; 293 | } 294 | 295 | @keyframes love 296 | { 297 | to 298 | { 299 | transform: scale(1.1) 300 | } 301 | } 302 | 303 | @media screen and (min-width: 320px) 304 | { 305 | body 306 | { 307 | font-size: calc(14px + 2 * ((100vw - 320px) / 680)) !important; 308 | } 309 | } 310 | 311 | @media screen and (max-width: 600px) 312 | { 313 | img[dracula] 314 | { 315 | height: auto; 316 | max-width: 100%; 317 | width: 100%; 318 | } 319 | } 320 | 321 | @media screen and (min-width: 1000px) 322 | { 323 | body 324 | { 325 | font-size: 16px !important; 326 | } 327 | } -------------------------------------------------------------------------------- /src/fonts/OFL.txt: -------------------------------------------------------------------------------- 1 | Copyright 2010, 2012 Adobe Systems Incorporated (http://www.adobe.com/), with Reserved Font Name 'Source'. All Rights Reserved. Source is a trademark of Adobe Systems Incorporated in the United States and/or other countries. 2 | 3 | This Font Software is licensed under the SIL Open Font License, Version 1.1. 4 | This license is copied below, and is also available with a FAQ at: 5 | http://scripts.sil.org/OFL 6 | 7 | 8 | ----------------------------------------------------------- 9 | SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007 10 | ----------------------------------------------------------- 11 | 12 | PREAMBLE 13 | The goals of the Open Font License (OFL) are to stimulate worldwide 14 | development of collaborative font projects, to support the font creation 15 | efforts of academic and linguistic communities, and to provide a free and 16 | open framework in which fonts may be shared and improved in partnership 17 | with others. 18 | 19 | The OFL allows the licensed fonts to be used, studied, modified and 20 | redistributed freely as long as they are not sold by themselves. The 21 | fonts, including any derivative works, can be bundled, embedded, 22 | redistributed and/or sold with any software provided that any reserved 23 | names are not used by derivative works. The fonts and derivatives, 24 | however, cannot be released under any other type of license. The 25 | requirement for fonts to remain under this license does not apply 26 | to any document created using the fonts or their derivatives. 27 | 28 | DEFINITIONS 29 | "Font Software" refers to the set of files released by the Copyright 30 | Holder(s) under this license and clearly marked as such. This may 31 | include source files, build scripts and documentation. 32 | 33 | "Reserved Font Name" refers to any names specified as such after the 34 | copyright statement(s). 35 | 36 | "Original Version" refers to the collection of Font Software components as 37 | distributed by the Copyright Holder(s). 38 | 39 | "Modified Version" refers to any derivative made by adding to, deleting, 40 | or substituting -- in part or in whole -- any of the components of the 41 | Original Version, by changing formats or by porting the Font Software to a 42 | new environment. 43 | 44 | "Author" refers to any designer, engineer, programmer, technical 45 | writer or other person who contributed to the Font Software. 46 | 47 | PERMISSION & CONDITIONS 48 | Permission is hereby granted, free of charge, to any person obtaining 49 | a copy of the Font Software, to use, study, copy, merge, embed, modify, 50 | redistribute, and sell modified and unmodified copies of the Font 51 | Software, subject to the following conditions: 52 | 53 | 1) Neither the Font Software nor any of its individual components, 54 | in Original or Modified Versions, may be sold by itself. 55 | 56 | 2) Original or Modified Versions of the Font Software may be bundled, 57 | redistributed and/or sold with any software, provided that each copy 58 | contains the above copyright notice and this license. These can be 59 | included either as stand-alone text files, human-readable headers or 60 | in the appropriate machine-readable metadata fields within text or 61 | binary files as long as those fields can be easily viewed by the user. 62 | 63 | 3) No Modified Version of the Font Software may use the Reserved Font 64 | Name(s) unless explicit written permission is granted by the corresponding 65 | Copyright Holder. This restriction only applies to the primary font name as 66 | presented to the users. 67 | 68 | 4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font 69 | Software shall not be used to promote, endorse or advertise any 70 | Modified Version, except to acknowledge the contribution(s) of the 71 | Copyright Holder(s) and the Author(s) or with their explicit written 72 | permission. 73 | 74 | 5) The Font Software, modified or unmodified, in part or in whole, 75 | must be distributed entirely under this license, and must not be 76 | distributed under any other license. The requirement for fonts to 77 | remain under this license does not apply to any document created 78 | using the Font Software. 79 | 80 | TERMINATION 81 | This license becomes null and void if any of the above conditions are 82 | not met. 83 | 84 | DISCLAIMER 85 | THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 86 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF 87 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT 88 | OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE 89 | COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 90 | INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL 91 | DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 92 | FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM 93 | OTHER DEALINGS IN THE FONT SOFTWARE. 94 | -------------------------------------------------------------------------------- /src/fonts/convert.pe: -------------------------------------------------------------------------------- 1 | #!/usr/local/bin/fontforge 2 | i=1 3 | while ( i<$argc ) 4 | Open($argv[i]) 5 | Generate($argv[i]:r + ".woff") 6 | i = i+1 7 | endloop -------------------------------------------------------------------------------- /src/fonts/source-code-pro-bold-italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-code-pro-bold-italic.ttf -------------------------------------------------------------------------------- /src/fonts/source-code-pro-bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-code-pro-bold.ttf -------------------------------------------------------------------------------- /src/fonts/source-code-pro-italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-code-pro-italic.ttf -------------------------------------------------------------------------------- /src/fonts/source-code-pro-light-italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-code-pro-light-italic.ttf -------------------------------------------------------------------------------- /src/fonts/source-code-pro-light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-code-pro-light.ttf -------------------------------------------------------------------------------- /src/fonts/source-code-pro-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-code-pro-regular.ttf -------------------------------------------------------------------------------- /src/fonts/source-sans-pro-bold-italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-sans-pro-bold-italic.ttf -------------------------------------------------------------------------------- /src/fonts/source-sans-pro-bold.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-sans-pro-bold.ttf -------------------------------------------------------------------------------- /src/fonts/source-sans-pro-italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-sans-pro-italic.ttf -------------------------------------------------------------------------------- /src/fonts/source-sans-pro-light-italic.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-sans-pro-light-italic.ttf -------------------------------------------------------------------------------- /src/fonts/source-sans-pro-light.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-sans-pro-light.ttf -------------------------------------------------------------------------------- /src/fonts/source-sans-pro-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/src/fonts/source-sans-pro-regular.ttf -------------------------------------------------------------------------------- /src/images/vampiro-geek.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /src/js/bundle-for-react.js: -------------------------------------------------------------------------------- 1 | 'use strict'; 2 | 3 | const html = 4 | ( 5 | `

6 |

11 |

` 12 | ); 13 | 14 | const js = ( 15 | `onSubmit(e) 16 | { 17 | e.preventDefault(); 18 | const job = 19 | { 20 | title: 'Developer', 21 | company: 'Facebook' 22 | }; 23 | }` 24 | ); 25 | 26 | class HtmlExample extends React.Component 27 | { 28 | componentDidMount() 29 | { 30 | Prism.highlightAll(); 31 | } 32 | 33 | render() 34 | { 35 | return ( 36 |

37 |         
38 |           { html }
39 |         
40 |

41 | ); 42 | } 43 | } 44 | 45 | class JsExample extends React.Component 46 | { 47 | componentDidMount() 48 | { 49 | Prism.highlightAll(); 50 | } 51 | 52 | render() 53 | { 54 | return ( 55 |

56 |         
57 |           { js }
58 |         
59 |

60 | ); 61 | } 62 | } 63 | 64 | ReactDOM.render(, document.getElementById('html')); 65 | ReactDOM.render(, document.getElementById('js')); -------------------------------------------------------------------------------- /src/js/prism.js: -------------------------------------------------------------------------------- 1 | 2 | /* ********************************************** 3 | Begin prism-core.js 4 | ********************************************** */ 5 | 6 | /// 7 | 8 | var _self = (typeof window !== 'undefined') 9 | ? window // if in browser 10 | : ( 11 | (typeof WorkerGlobalScope !== 'undefined' && self instanceof WorkerGlobalScope) 12 | ? self // if in worker 13 | : {} // if in node js 14 | ); 15 | 16 | /** 17 | * Prism: Lightweight, robust, elegant syntax highlighting 18 | * 19 | * @license MIT 20 | * @author Lea Verou 21 | * @namespace 22 | * @public 23 | */ 24 | var Prism = (function (_self){ 25 | 26 | // Private helper vars 27 | var lang = /\blang(?:uage)?-([\w-]+)\b/i; 28 | var uniqueId = 0; 29 | 30 | 31 | var _ = { 32 | /** 33 | * By default, Prism will attempt to highlight all code elements (by calling {@link Prism.highlightAll}) on the 34 | * current page after the page finished loading. This might be a problem if e.g. you wanted to asynchronously load 35 | * additional languages or plugins yourself. 36 | * 37 | * By setting this value to `true`, Prism will not automatically highlight all code elements on the page. 38 | * 39 | * You obviously have to change this value before the automatic highlighting started. To do this, you can add an 40 | * empty Prism object into the global scope before loading the Prism script like this: 41 | * 42 | * ```js 43 | * window.Prism = window.Prism || {}; 44 | * Prism.manual = true; 45 | * // add a new 9 | 10 | 11 | 12 | Dracula – Test – React with Dracula-themed Prism 13 | 14 | 15 | 16 |

React with Dracula-themed Prism

17 |

Analysing React and Primjs, using the Dracula theme

18 |

19 |

20 | 21 | 86 | 87 | -------------------------------------------------------------------------------- /test/Test – Syntax Highlighting Analysis.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Dracula — A dark theme for Prism.js and 50+ apps 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 |

Synthax Highlight Test

17 |

Analysing new synthax colours

18 | 19 |

20 |   
21 |   *{} * {} p {}
22 | 
23 |   ul,
24 |   ol {}
25 | 
26 |   p { color: red; }
27 | 
28 |   p {
29 |       color: red !important;
30 |       line-height: normal!important;
31 |       font-size: 16px;
32 |   }
33 | 
34 |   p { position: absolute !important}
35 | 
36 |   @media screen and (min-width: 100px) {}
37 | 
38 |   @main-color: red;
39 | 
40 |   .foo 
41 |   {
42 |     background: @main-color;
43 |   }
44 | 
45 |   /* Simple comment here */
46 | 
47 |   .exemplo
48 |   {
49 |     font-family: "Bahnschrift SemiCondensed", sans serif;
50 |   }
51 | 
52 |   #exemplo
53 |   {
54 |     content: 'foo';
55 |     content: "foo";
56 |     content: url(foo.png);
57 |     content: url('foo.png');
58 |     content: url("foo.png");
59 |   }
60 |   
61 |

62 | 63 | 64 | 65 | 79 | 80 | -------------------------------------------------------------------------------- /test/index-with-new-prism.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Dracula — A dark theme for Prism.js and 50+ apps 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | Dracula-like Logo of Prism

18 | 19 |

20 | Dracula 21 |

22 | 23 | 24 |

A dark theme for Prism.js and 50+ apps

25 |

New Dracula Theme

26 | 27 |

28 | 29 | 30 |

31 | 32 |

 33 |   
 34 |     #include <iostream>
 35 | 
 36 |     int main()
 37 |     {
 38 |       std::cout << "Hello, I'm a dark theme for Prism.js!" << std::endl;
 39 |       return 0;
 40 |     }
 41 |   
 42 |

43 | 44 |

Prism.js

45 |

Install

46 | 47 |

 48 |   
 49 |     $ cd 'path/to/your_website_project'
 50 |   
 51 |

52 | 53 |

Download with...

54 | 55 |

 56 |   
 57 |     $ git clone https://github.com/dracula/prism.git
 58 |   
 59 |

60 | 61 |

or...

62 | 63 |

 64 |   
 65 |     svn export https://github.com/dracula/prism/trunk/css/dracula-prism.css 'css/'
 66 |     svn export https://github.com/dracula/prism/trunk/js/prism.js 'javascript/'
 67 |   
 68 |

69 | 70 |

Link your project to these two files and to Google Webfonts' PT Mono. Do not forget to add 71 | .htaccess in order to allow the WOFF fonts. jQuery isn't 72 | required.

73 | 74 |

 75 |   
 76 |     <!-- Paste this in head -->
 77 |     <link href="https://fonts.googleapis.com/css?family=PT+Mono&subset=cyrillic,cyrillic-ext,latin-ext" rel="stylesheet"> 
 78 |     <link rel="stylesheet" href="css/dracula-prism.css">
 79 | 
 80 |     <!-- Paste this at the end of the file -->
 81 |     <script src="js/prism.js"></script>
 82 |     <script type="text/javascript">
 83 |       Prism.plugins.NormalizeWhitespace.setDefaults(
 84 |         {
 85 |           'remove-trailing': true,
 86 |           'remove-indent': true,
 87 |           'left-trim': true,
 88 |           'right-trim': true,
 89 |           // 'break-lines': 10,
 90 |           // 'indent': 2,
 91 |           // 'remove-initial-line-feed': false,
 92 |           // 'tabs-to-spaces': 4,
 93 |           // 'spaces-to-tabs': 4
 94 |         });
 95 |     </script>
 96 |   
 97 |

98 | 99 |

Using the theme

100 | 101 |

Add a snippet to your website like this and replace language-xxx by one of the supported languages.

102 | 103 |

104 |   
105 |     <pre>
106 |       <code class="language-xxx line-numbers">
107 |         your snippet
108 |       </code>
109 |     </pre>
110 |   
111 |

112 | 113 |

If you want to limit the pre height to 300, 400, ..., 800px, you can add <pre class="limit-xxx"> ... </pre>:

114 | 115 |

116 |   
117 |     <pre class="limit-300">
118 |       <code class="language-xxx line-numbers">
119 |         your snippet
120 |       </code>
121 |     </pre>
122 |   
123 |

124 | 125 |

Note that the customised scrollbar works only in the webkit-based browsers. If you want 126 | your scrollbars to be the same in all browsers, you can use:

127 | 128 |

137 | 138 |

Demo

139 | 140 |

CSS, HTML and Javascript Mixed

141 | 142 |

143 |   
144 |     <!DOCTYPE html>
145 |     <html lang="en">
146 |     <head>
147 |       <meta charset="utf-8" />
148 |       <title>I can haz embedded CSS and JS
149 |       <style>
150 |         @media print {
151 |           p { color: red !important; }
152 |         }
153 |       </style>
154 |     </head>
155 |     <body>
156 |       <h1>I can haz embedded CSS and JS
157 |       <script>
158 |       if (true) {
159 |         console.log('foo');
160 |       }
161 |       </script>
162 | 
163 |     </body>
164 |     </html>
165 |   
166 |

167 | 168 |

C-Like

169 | 170 |

171 |   
172 |     // Single line comment
173 |     /* Multi-line
174 |     comment */
175 | 
176 |     "foo \"bar\" baz";
177 |     'foo \'bar\' baz';
178 | 
179 |     123
180 |     123.456
181 |     -123.456
182 |     1e-23
183 |     123.456E789
184 |     0xaf
185 |     0xAF
186 | 
187 |     foo();
188 |     Bar();
189 |     _456();
190 | 
191 |     "foo /* bar */ baz"; "foo // bar";
192 |   
193 |

194 | 195 |

C++ Language

196 | 197 |

198 |   
199 |     /*
200 |     David Cary 2010-09-14
201 |     quick demo for wikibooks
202 |     public domain
203 |     */
204 | 
205 |     #include <iostream>
206 |     #include <vector>
207 |     using namespace std;
208 | 
209 |     vector<int> pick_vector_with_biggest_fifth_element(
210 |         vector<int> left,
211 |         vector<int> right
212 |     ){
213 |         if( (left[5]) < (right[5]) ){
214 |             return( right );
215 |         };
216 |         // else
217 |         return( left );
218 |     }
219 | 
220 |     int vector_demo(void){
221 |         cout << "vector demo" << endl;
222 |         vector<int> left(7);
223 |         vector<int> right(7);
224 | 
225 |         left[5] = 7;
226 |         right[5] = 8;
227 |         cout << left[5] << endl;
228 |         cout << right[5] << endl;
229 |         vector<int> biggest(
230 |             pick_vector_with_biggest_fifth_element( left, right )
231 |         );
232 |         cout << biggest[5] << endl;
233 | 
234 |         return 0;
235 |     }
236 | 
237 |     int main(void){
238 |         vector_demo();
239 |     }
240 |   
241 |

242 | 243 |

Go

244 | 245 |

246 |   
247 |     package main
248 | 
249 |     import "fmt"
250 | 
251 |     func main() 
252 |     {
253 |         ch := make(chan float64)
254 |         ch <- 1.0e10    // magic number
255 |         x, ok := <- ch
256 |         defer fmt.Println(`exitting now\`)
257 |         go println(len("hello world!"))
258 |         return
259 |     }
260 |   
261 |

262 | 263 |

Java

264 | 265 |

266 |   
267 |     import java.util.Scanner;
268 | 
269 |     public class Life {
270 | 
271 |         @Override @Bind("One")
272 |         public void show(boolean[][] grid){
273 |             String s = "";
274 |             for(boolean[] row : grid){
275 |                 for(boolean val : row)
276 |                     if(val)
277 |                         s += "*";
278 |                     else
279 |                         s += ".";
280 |                 s += "\n";
281 |             }
282 |             System.out.println(s);
283 |         }
284 | 
285 |         public static boolean[][] gen(){
286 |             boolean[][] grid = new boolean[10][10];
287 |             for(int r = 0; r < 10; r++)
288 |                 for(int c = 0; c < 10; c++)
289 |                     if( Math.random() > 0.7 )
290 |                         grid[r][c] = true;
291 |             return grid;
292 |         }
293 | 
294 |         public static void main(String[] args){
295 |             boolean[][] world = gen();
296 |             show(world);
297 |             System.out.println();
298 |             world = nextGen(world);
299 |             show(world);
300 |             Scanner s = new Scanner(System.in);
301 |             while(s.nextLine().length() == 0){
302 |                 System.out.println();
303 |                 world = nextGen(world);
304 |                 show(world);
305 | 
306 |             }
307 |         }
308 | 
309 |       // [...]
310 |     }
311 |   
312 |

313 | 314 |

JavaScript

315 | 316 |

317 |   
318 |     // Variable assignment
319 |     var foo = "bar", baz = 5;
320 | 
321 |     // Operators
322 |     (1 + 2 * 3)/4 >= 3 && 4 < 5 || 6 > 7
323 | 
324 |     // Indented code
325 |     if (true) {
326 |         while (true) {
327 |           doSomething();
328 |         }
329 |       }
330 | 
331 |     // Regex with slashes
332 |     var foo = /([^/])\/(\\?.|\[.+?])+?\/[gim]{0,3}/g;
333 | 
334 |     Strings with slashes
335 |     env.content + ''
336 |     var foo = "/" + "/";
337 |     var foo = "http://prismjs.com"; // Strings are strings and comments are comments ;)
338 |   
339 |

340 | 341 |

PHP

342 | 343 |

344 |   
345 |     // ***** Comments ***** //
346 | 
347 |     // Single line comment
348 |     /* Multi-line
349 |     comment */
350 |     # Shell-like comment
351 | 
352 |     // ***** Strings ***** //
353 | 
354 |     'foo \'bar\' baz'
355 |     "foo \"bar\" baz"
356 |     "a string # containing an hash"
357 | 
358 |     // ***** Variables ***** //
359 | 
360 |     $some_var = 5;
361 |     $otherVar = "Some text";
362 |     $null = null;
363 |     $false = false;
364 | 
365 |     // ***** Functions ***** //
366 | 
367 |     $json = json_encode($my_object);
368 |     $array1 = array("a" => "green", "red", "blue", "red");
369 |     $array2 = array("b" => "green", "yellow", "red");
370 |     $result = array_diff($array1, $array2);
371 | 
372 |     // ***** Constants ***** //
373 | 
374 |     define('MAXSIZE', 42);
375 |     echo MAXSIZE;
376 |     json_decode($json, false, 512, JSON_BIGINT_AS_STRING)
377 | 
378 |     // *****
379 |     PHP 5.3+ support ***** //
380 | 
381 |     namespace my\name;
382 |     $c = new \my\name\MyClass;
383 |     $arr = [1,2,3];
384 |     trait ezcReflectionReturnInfo {
385 |         function getReturnType() { /*1*/ }
386 |         function getReturnDescription() { /*2*/ }
387 |     }
388 |     function gen_one_to_three() {
389 |         for ($i = 1; $i <= 3; $i++) {
390 |             // Note that $i is preserved between yields.
391 |             yield $i;
392 |         }
393 |     }
394 | 
395 |     // ***** PHP embedded in HTML ***** //
396 | 
397 |     <div class="">
398 |     
403 |     </div>
404 |   
405 |

406 | 407 |

Python

408 | 409 |

410 |   
411 |     def median(pool):
412 |     '''Statistical median to demonstrate doctest.
413 |     >>> median([2, 9, 9, 7, 9, 2, 4, 5, 8])
414 |     7
415 |     '''
416 |     copy = sorted(pool)
417 |     size = len(copy)
418 |     if size % 2 == 1:
419 |         return copy[(size - 1) / 2]
420 |     else:
421 |         return (copy[size/2 - 1] + copy[size/2]) / 2
422 |     if __name__ == '__main__':
423 |         import doctest
424 |         doctest.testmod()
425 |   
426 |

427 | 428 |

Ruby

429 | 430 |

431 |   
432 |     #### Single-line comments ####
433 |     # This is a comment
434 | 
435 |     #### Strings ####
436 |     "foo \"bar\" baz"
437 |     'foo \'bar\' baz'
438 | 
439 |     #### Regular expressions ####
440 |     /foo?[ ]*bar/
441 | 
442 |     #### Variables ####
443 |     $foo = 5;
444 |     class InstTest
445 |       def set_foo(n)
446 |         @foo = n
447 |       end
448 |       def set_bar(n)
449 |         @bar = n
450 |       end
451 |     end
452 | 
453 |     #### Symbols ####
454 |     mystring = :steveT;
455 | 
456 |     #### String Interpolation ####
457 |     "foo #{'bar'+my_variable}"
458 |   
459 |

460 | 461 |

SQL

462 | 463 |

464 |   
465 |     ### Comments ###
466 |     # Single line comment
467 |     -- Single line comment
468 |     // Single line comment
469 |     /* Multi-line
470 |     comment */
471 | 
472 |     ### Strings ###
473 |     "foo \"bar\" baz"
474 |     'foo \'bar\' baz'
475 |     "Multi-line strings
476 |     are supported"
477 |     'Multi-line strings
478 |     are supported'
479 | 
480 |     ### Variables ###
481 |     SET @variable = 1;
482 |     SET @$_ = 2;
483 |     SET @"quoted-variable" = 3;
484 |     SET @'quoted-variable' = 3;
485 |     SET @`quoted-variable` = 3;
486 | 
487 |     ### Operators ###
488 |     SELECT 1 && 1;
489 |     SELECT 1 OR NULL;
490 |     SELECT 5 & 2*3;
491 |     SELECT 2 BETWEEN 1 AND 3;
492 | 
493 |     ### Functions and keywords ###
494 |     SELECT COUNT(*) AS cpt, MAX(t.pos) AS max_pos
495 |     FROM `my_table`
496 |     LEFT JOIN `other_table` AS t
497 |     WHERE `somecol` IS NOT NULL
498 |     ORDER BY t.other_col DESC
499 |   
500 |

501 | 502 |

Swift

503 | 504 |

505 |   
506 |     import Foundation
507 | 
508 |     @objc class Person: Entity 
509 |     {
510 |       var name: String!
511 |       var age:  Int!
512 | 
513 |       init(name: String, age: Int) 
514 |       {
515 |         /* /* ... */ */
516 |       }
517 | 
518 |       // Return a descriptive string for this person
519 |       func description(offset: Int = 0) -> String {
520 |         return "\(name) is \(age + offset) years old"
521 |       }
522 |     }
523 |   
524 |

525 | 526 |

Contributors

527 | 528 |

This theme wouldn't exist without these people. Wanna help too? Check the 529 | repository on GitHub.

530 | 531 |

Credits

532 | 533 |

This theme was built with 534 | Prism Theme builder, 535 | developed by Sandras Hklyaeva.

536 | 537 |

It uses a new font called PT Mono from Google Fonts, an elegant monoscaped serif font, 538 | which looks like Dracula's serif font – Abril Text. It also won a new scrollbar style and 539 | is optimised for mobile and bigger monitors.

540 | 541 |

Made with ♥ in Brazil by Gustavo Costa
under MIT license 542 | 543 | 544 | 545 | 559 | 560 | -------------------------------------------------------------------------------- /test/index-with-old-prism.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Dracula — A dark theme for Prism.js and 50+ apps 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | Dracula-like Logo of Prism 18 | 19 |

20 | Dracula 21 |

22 | 23 | 24 |

A dark theme for Prism.js and 50+ apps

25 |

Old Dracula Theme

26 | 27 |

28 | 29 | 30 |

31 | 32 |

 33 |   
 34 |     #include <iostream>
 35 | 
 36 |     int main()
 37 |     {
 38 |       std::cout << "Hello, I'm a dark theme for Prism.js!" << std::endl;
 39 |       return 0;
 40 |     }
 41 |   
 42 |

43 | 44 |

Prism.js

45 |

Install

46 | 47 |

 48 |   
 49 |     $ cd 'path/to/your_website_project'
 50 |   
 51 |

52 | 53 |

Download with...

54 | 55 |

 56 |   
 57 |     $ git clone https://github.com/dracula/prism.git
 58 |   
 59 |

60 | 61 |

or...

62 | 63 |

 64 |   
 65 |     svn export https://github.com/dracula/prism/trunk/css/dracula-prism.css 'css/'
 66 |     svn export https://github.com/dracula/prism/trunk/js/prism.js 'javascript/'
 67 |   
 68 |

69 | 70 |

Link your project to these two files and to Google Webfonts' PT Mono. Do not forget to add 71 | .htaccess in order to allow the WOFF fonts. jQuery isn't 72 | required.

73 | 74 |

 75 |   
 76 |     <!-- Paste this in head -->
 77 |     <link href="https://fonts.googleapis.com/css?family=PT+Mono&subset=cyrillic,cyrillic-ext,latin-ext" rel="stylesheet"> 
 78 |     <link rel="stylesheet" href="css/dracula-prism.css">
 79 | 
 80 |     <!-- Paste this at the end of the file -->
 81 |     <script src="js/prism.js"></script>
 82 |     <script type="text/javascript">
 83 |       Prism.plugins.NormalizeWhitespace.setDefaults(
 84 |         {
 85 |           'remove-trailing': true,
 86 |           'remove-indent': true,
 87 |           'left-trim': true,
 88 |           'right-trim': true,
 89 |           // 'break-lines': 10,
 90 |           // 'indent': 2,
 91 |           // 'remove-initial-line-feed': false,
 92 |           // 'tabs-to-spaces': 4,
 93 |           // 'spaces-to-tabs': 4
 94 |         });
 95 |     </script>
 96 |   
 97 |

98 | 99 |

Using the theme

100 | 101 |

Add a snippet to your website like this and replace language-xxx by one of the supported languages.

102 | 103 |

104 |   
105 |     <pre>
106 |       <code class="language-xxx line-numbers">
107 |         your snippet
108 |       </code>
109 |     </pre>
110 |   
111 |

112 | 113 |

If you want to limit the pre height to 300, 400, ..., 800px, you can add <pre class="limit-xxx"> ... </pre>:

114 | 115 |

116 |   
117 |     <pre class="limit-300">
118 |       <code class="language-xxx line-numbers">
119 |         your snippet
120 |       </code>
121 |     </pre>
122 |   
123 |

124 | 125 |

Note that the customised scrollbar works only in the webkit-based browsers. If you want 126 | your scrollbars to be the same in all browsers, you can use:

127 | 128 |

137 | 138 |

Demo

139 | 140 |

CSS, HTML and Javascript Mixed

141 | 142 |

143 |   
144 |     <!DOCTYPE html>
145 |     <html lang="en">
146 |     <head>
147 |       <meta charset="utf-8" />
148 |       <title>I can haz embedded CSS and JS
149 |       <style>
150 |         @media print {
151 |           p { color: red !important; }
152 |         }
153 |       </style>
154 |     </head>
155 |     <body>
156 |       <h1>I can haz embedded CSS and JS
157 |       <script>
158 |       if (true) {
159 |         console.log('foo');
160 |       }
161 |       </script>
162 | 
163 |     </body>
164 |     </html>
165 |   
166 |

167 | 168 |

C-Like

169 | 170 |

171 |   
172 |     // Single line comment
173 |     /* Multi-line
174 |     comment */
175 | 
176 |     "foo \"bar\" baz";
177 |     'foo \'bar\' baz';
178 | 
179 |     123
180 |     123.456
181 |     -123.456
182 |     1e-23
183 |     123.456E789
184 |     0xaf
185 |     0xAF
186 | 
187 |     foo();
188 |     Bar();
189 |     _456();
190 | 
191 |     "foo /* bar */ baz"; "foo // bar";
192 |   
193 |

194 | 195 |

C++ Language

196 | 197 |

198 |   
199 |     /*
200 |     David Cary 2010-09-14
201 |     quick demo for wikibooks
202 |     public domain
203 |     */
204 | 
205 |     #include <iostream>
206 |     #include <vector>
207 |     using namespace std;
208 | 
209 |     vector<int> pick_vector_with_biggest_fifth_element(
210 |         vector<int> left,
211 |         vector<int> right
212 |     ){
213 |         if( (left[5]) < (right[5]) ){
214 |             return( right );
215 |         };
216 |         // else
217 |         return( left );
218 |     }
219 | 
220 |     int vector_demo(void){
221 |         cout << "vector demo" << endl;
222 |         vector<int> left(7);
223 |         vector<int> right(7);
224 | 
225 |         left[5] = 7;
226 |         right[5] = 8;
227 |         cout << left[5] << endl;
228 |         cout << right[5] << endl;
229 |         vector<int> biggest(
230 |             pick_vector_with_biggest_fifth_element( left, right )
231 |         );
232 |         cout << biggest[5] << endl;
233 | 
234 |         return 0;
235 |     }
236 | 
237 |     int main(void){
238 |         vector_demo();
239 |     }
240 |   
241 |

242 | 243 |

Go

244 | 245 |

246 |   
247 |     package main
248 | 
249 |     import "fmt"
250 | 
251 |     func main() 
252 |     {
253 |         ch := make(chan float64)
254 |         ch <- 1.0e10    // magic number
255 |         x, ok := <- ch
256 |         defer fmt.Println(`exitting now\`)
257 |         go println(len("hello world!"))
258 |         return
259 |     }
260 |   
261 |

262 | 263 |

Java

264 | 265 |

266 |   
267 |     import java.util.Scanner;
268 | 
269 |     public class Life {
270 | 
271 |         @Override @Bind("One")
272 |         public void show(boolean[][] grid){
273 |             String s = "";
274 |             for(boolean[] row : grid){
275 |                 for(boolean val : row)
276 |                     if(val)
277 |                         s += "*";
278 |                     else
279 |                         s += ".";
280 |                 s += "\n";
281 |             }
282 |             System.out.println(s);
283 |         }
284 | 
285 |         public static boolean[][] gen(){
286 |             boolean[][] grid = new boolean[10][10];
287 |             for(int r = 0; r < 10; r++)
288 |                 for(int c = 0; c < 10; c++)
289 |                     if( Math.random() > 0.7 )
290 |                         grid[r][c] = true;
291 |             return grid;
292 |         }
293 | 
294 |         public static void main(String[] args){
295 |             boolean[][] world = gen();
296 |             show(world);
297 |             System.out.println();
298 |             world = nextGen(world);
299 |             show(world);
300 |             Scanner s = new Scanner(System.in);
301 |             while(s.nextLine().length() == 0){
302 |                 System.out.println();
303 |                 world = nextGen(world);
304 |                 show(world);
305 | 
306 |             }
307 |         }
308 | 
309 |       // [...]
310 |     }
311 |   
312 |

313 | 314 |

JavaScript

315 | 316 |

317 |   
318 |     // Variable assignment
319 |     var foo = "bar", baz = 5;
320 | 
321 |     // Operators
322 |     (1 + 2 * 3)/4 >= 3 && 4 < 5 || 6 > 7
323 | 
324 |     // Indented code
325 |     if (true) {
326 |         while (true) {
327 |           doSomething();
328 |         }
329 |       }
330 | 
331 |     // Regex with slashes
332 |     var foo = /([^/])\/(\\?.|\[.+?])+?\/[gim]{0,3}/g;
333 | 
334 |     Strings with slashes
335 |     env.content + ''
336 |     var foo = "/" + "/";
337 |     var foo = "http://prismjs.com"; // Strings are strings and comments are comments ;)
338 |   
339 |

340 | 341 |

PHP

342 | 343 |

344 |   
345 |     // ***** Comments ***** //
346 | 
347 |     // Single line comment
348 |     /* Multi-line
349 |     comment */
350 |     # Shell-like comment
351 | 
352 |     // ***** Strings ***** //
353 | 
354 |     'foo \'bar\' baz'
355 |     "foo \"bar\" baz"
356 |     "a string # containing an hash"
357 | 
358 |     // ***** Variables ***** //
359 | 
360 |     $some_var = 5;
361 |     $otherVar = "Some text";
362 |     $null = null;
363 |     $false = false;
364 | 
365 |     // ***** Functions ***** //
366 | 
367 |     $json = json_encode($my_object);
368 |     $array1 = array("a" => "green", "red", "blue", "red");
369 |     $array2 = array("b" => "green", "yellow", "red");
370 |     $result = array_diff($array1, $array2);
371 | 
372 |     // ***** Constants ***** //
373 | 
374 |     define('MAXSIZE', 42);
375 |     echo MAXSIZE;
376 |     json_decode($json, false, 512, JSON_BIGINT_AS_STRING)
377 | 
378 |     // *****
379 |     PHP 5.3+ support ***** //
380 | 
381 |     namespace my\name;
382 |     $c = new \my\name\MyClass;
383 |     $arr = [1,2,3];
384 |     trait ezcReflectionReturnInfo {
385 |         function getReturnType() { /*1*/ }
386 |         function getReturnDescription() { /*2*/ }
387 |     }
388 |     function gen_one_to_three() {
389 |         for ($i = 1; $i <= 3; $i++) {
390 |             // Note that $i is preserved between yields.
391 |             yield $i;
392 |         }
393 |     }
394 | 
395 |     // ***** PHP embedded in HTML ***** //
396 | 
397 |     <div class="">
398 |     
403 |     </div>
404 |   
405 |

406 | 407 |

Python

408 | 409 |

410 |   
411 |     def median(pool):
412 |     '''Statistical median to demonstrate doctest.
413 |     >>> median([2, 9, 9, 7, 9, 2, 4, 5, 8])
414 |     7
415 |     '''
416 |     copy = sorted(pool)
417 |     size = len(copy)
418 |     if size % 2 == 1:
419 |         return copy[(size - 1) / 2]
420 |     else:
421 |         return (copy[size/2 - 1] + copy[size/2]) / 2
422 |     if __name__ == '__main__':
423 |         import doctest
424 |         doctest.testmod()
425 |   
426 |

427 | 428 |

Ruby

429 | 430 |

431 |   
432 |     #### Single-line comments ####
433 |     # This is a comment
434 | 
435 |     #### Strings ####
436 |     "foo \"bar\" baz"
437 |     'foo \'bar\' baz'
438 | 
439 |     #### Regular expressions ####
440 |     /foo?[ ]*bar/
441 | 
442 |     #### Variables ####
443 |     $foo = 5;
444 |     class InstTest
445 |       def set_foo(n)
446 |         @foo = n
447 |       end
448 |       def set_bar(n)
449 |         @bar = n
450 |       end
451 |     end
452 | 
453 |     #### Symbols ####
454 |     mystring = :steveT;
455 | 
456 |     #### String Interpolation ####
457 |     "foo #{'bar'+my_variable}"
458 |   
459 |

460 | 461 |

SQL

462 | 463 |

464 |   
465 |     ### Comments ###
466 |     # Single line comment
467 |     -- Single line comment
468 |     // Single line comment
469 |     /* Multi-line
470 |     comment */
471 | 
472 |     ### Strings ###
473 |     "foo \"bar\" baz"
474 |     'foo \'bar\' baz'
475 |     "Multi-line strings
476 |     are supported"
477 |     'Multi-line strings
478 |     are supported'
479 | 
480 |     ### Variables ###
481 |     SET @variable = 1;
482 |     SET @$_ = 2;
483 |     SET @"quoted-variable" = 3;
484 |     SET @'quoted-variable' = 3;
485 |     SET @`quoted-variable` = 3;
486 | 
487 |     ### Operators ###
488 |     SELECT 1 && 1;
489 |     SELECT 1 OR NULL;
490 |     SELECT 5 & 2*3;
491 |     SELECT 2 BETWEEN 1 AND 3;
492 | 
493 |     ### Functions and keywords ###
494 |     SELECT COUNT(*) AS cpt, MAX(t.pos) AS max_pos
495 |     FROM `my_table`
496 |     LEFT JOIN `other_table` AS t
497 |     WHERE `somecol` IS NOT NULL
498 |     ORDER BY t.other_col DESC
499 |   
500 |

501 | 502 |

Swift

503 | 504 |

505 |   
506 |     import Foundation
507 | 
508 |     @objc class Person: Entity 
509 |     {
510 |       var name: String!
511 |       var age:  Int!
512 | 
513 |       init(name: String, age: Int) 
514 |       {
515 |         /* /* ... */ */
516 |       }
517 | 
518 |       // Return a descriptive string for this person
519 |       func description(offset: Int = 0) -> String {
520 |         return "\(name) is \(age + offset) years old"
521 |       }
522 |     }
523 |   
524 |

525 | 526 |

Contributors

527 | 528 |

This theme wouldn't exist without these people. Wanna help too? Check the 529 | repository on GitHub.

530 | 531 |

Credits

532 | 533 |

This theme was built with 534 | Prism Theme builder, 535 | developed by Sandras Hklyaeva.

536 | 537 |

540 | 541 |

Made with ♥ in Brazil by 542 | Gustavo Costa 543 |
under MIT license 544 | 545 | 546 | 547 | 561 | 562 | -------------------------------------------------------------------------------- /test/public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/test/public/favicon.ico -------------------------------------------------------------------------------- /test/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 12 | 13 | 17 | 18 | 27 | React App 28 | 29 | 30 | 31 |

32 |

33 | 43 | 44 | 45 | -------------------------------------------------------------------------------- /test/public/logo192.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/test/public/logo192.png -------------------------------------------------------------------------------- /test/public/logo512.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/dracula/prism/7d0d648ebc24737f86c3fe7c29537a604738eb55/test/public/logo512.png -------------------------------------------------------------------------------- /test/public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | }, 10 | { 11 | "src": "logo192.png", 12 | "type": "image/png", 13 | "sizes": "192x192" 14 | }, 15 | { 16 | "src": "logo512.png", 17 | "type": "image/png", 18 | "sizes": "512x512" 19 | } 20 | ], 21 | "start_url": ".", 22 | "display": "standalone", 23 | "theme_color": "#000000", 24 | "background_color": "#ffffff" 25 | } 26 | -------------------------------------------------------------------------------- /test/public/robots.txt: -------------------------------------------------------------------------------- 1 | # https://www.robotstxt.org/robotstxt.html 2 | User-agent: * 3 | Disallow: 4 | -------------------------------------------------------------------------------- /test/src/dracula-prism.css: -------------------------------------------------------------------------------- 1 | ../../src/css/dracula-prism.css -------------------------------------------------------------------------------- /test/src/htmlSnippet.jsx: -------------------------------------------------------------------------------- 1 | const html = 2 | ( 3 | `

4 |

9 |

` 10 | ); 11 | 12 | export { html }; -------------------------------------------------------------------------------- /test/src/index.jsx: -------------------------------------------------------------------------------- 1 | import React, { Component } from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import Prism from "prismjs"; 4 | import "./dracula-prism.css"; 5 | 6 | import { html } from "./htmlSnippet"; 7 | import { js } from "./jsSnippet"; 8 | 9 | class HtmlExample extends React.Component 10 | { 11 | componentDidMount() 12 | { 13 | Prism.highlightAll(); 14 | } 15 | 16 | render() 17 | { 18 | return ( 19 |

20 |         
21 |           { html }
22 |         
23 |

24 | ); 25 | } 26 | } 27 | 28 | class JsExample extends React.Component 29 | { 30 | componentDidMount() 31 | { 32 | Prism.highlightAll(); 33 | } 34 | 35 | render() 36 | { 37 | return ( 38 |

39 |         
40 |           { js }
41 |         
42 |

43 | ); 44 | } 45 | } 46 | 47 | ReactDOM.render(, document.getElementById('html')); 48 | ReactDOM.render(, document.getElementById('js')); -------------------------------------------------------------------------------- /test/src/jsSnippet.jsx: -------------------------------------------------------------------------------- 1 | const js = ( 2 | `onSubmit(e) 3 | { 4 | e.preventDefault(); 5 | const job = 6 | { 7 | title: 'Developer', 8 | company: 'Facebook' 9 | }; 10 | }` 11 | ); 12 | 13 | export { js }; --------------------------------------------------------------------------------