prism-scss.js 2.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. Prism.languages.scss = Prism.languages.extend('css', {
  2. 'comment': {
  3. pattern: /(^|[^\\])(?:\/\*[\s\S]*?\*\/|\/\/.*)/,
  4. lookbehind: true
  5. },
  6. 'atrule': {
  7. pattern: /@[\w-](?:\([^()]+\)|[^()\s]|\s+(?!\s))*?(?=\s+[{;])/,
  8. inside: {
  9. 'rule': /@[\w-]+/
  10. // See rest below
  11. }
  12. },
  13. // url, compassified
  14. 'url': /(?:[-a-z]+-)?url(?=\()/i,
  15. // CSS selector regex is not appropriate for Sass
  16. // since there can be lot more things (var, @ directive, nesting..)
  17. // a selector must start at the end of a property or after a brace (end of other rules or nesting)
  18. // it can contain some characters that aren't used for defining rules or end of selector, & (parent selector), or interpolated variable
  19. // the end of a selector is found when there is no rules in it ( {} or {\s}) or if there is a property (because an interpolated var
  20. // can "pass" as a selector- e.g: proper#{$erty})
  21. // this one was hard to do, so please be careful if you edit this one :)
  22. 'selector': {
  23. // Initial look-ahead is used to prevent matching of blank selectors
  24. pattern: /(?=\S)[^@;{}()]?(?:[^@;{}()\s]|\s+(?!\s)|#\{\$[-\w]+\})+(?=\s*\{(?:\}|\s|[^}][^:{}]*[:{][^}]))/,
  25. inside: {
  26. 'parent': {
  27. pattern: /&/,
  28. alias: 'important'
  29. },
  30. 'placeholder': /%[-\w]+/,
  31. 'variable': /\$[-\w]+|#\{\$[-\w]+\}/
  32. }
  33. },
  34. 'property': {
  35. pattern: /(?:[-\w]|\$[-\w]|#\{\$[-\w]+\})+(?=\s*:)/,
  36. inside: {
  37. 'variable': /\$[-\w]+|#\{\$[-\w]+\}/
  38. }
  39. }
  40. });
  41. Prism.languages.insertBefore('scss', 'atrule', {
  42. 'keyword': [
  43. /@(?:content|debug|each|else(?: if)?|extend|for|forward|function|if|import|include|mixin|return|use|warn|while)\b/i,
  44. {
  45. pattern: /( )(?:from|through)(?= )/,
  46. lookbehind: true
  47. }
  48. ]
  49. });
  50. Prism.languages.insertBefore('scss', 'important', {
  51. // var and interpolated vars
  52. 'variable': /\$[-\w]+|#\{\$[-\w]+\}/
  53. });
  54. Prism.languages.insertBefore('scss', 'function', {
  55. 'module-modifier': {
  56. pattern: /\b(?:as|hide|show|with)\b/i,
  57. alias: 'keyword'
  58. },
  59. 'placeholder': {
  60. pattern: /%[-\w]+/,
  61. alias: 'selector'
  62. },
  63. 'statement': {
  64. pattern: /\B!(?:default|optional)\b/i,
  65. alias: 'keyword'
  66. },
  67. 'boolean': /\b(?:false|true)\b/,
  68. 'null': {
  69. pattern: /\bnull\b/,
  70. alias: 'keyword'
  71. },
  72. 'operator': {
  73. pattern: /(\s)(?:[-+*\/%]|[=!]=|<=?|>=?|and|not|or)(?=\s)/,
  74. lookbehind: true
  75. }
  76. });
  77. Prism.languages.scss['atrule'].inside.rest = Prism.languages.scss;