feat: redesign, docs rewrite, update for v0.11

- lang docs were split into language tour, reference, & quick reference - lots of new information including features added in upcoming version - improved branding - new font, slogan, and landing page design - updated favicon and svgs - CSS adjustments for more consistent styles - improved regex syntax highlighting - added useful links on docs landing page
pomsky-lang · Nov 9, 2023 · ceba4f8 · ceba4f8
1 parent 5cae201
commit ceba4f8
Show file tree

Hide file tree

Showing 95 changed files with 4,915 additions and 2,990 deletions.
diff --git a/assets/js/highlight.js b/assets/js/highlight.js
@@ -3,10 +3,12 @@ import hljs from 'highlight.js/lib/core'
 import rust from 'highlight.js/lib/languages/rust'
 import javascript from 'highlight.js/lib/languages/javascript'
 import ini from 'highlight.js/lib/languages/ini'
+import json from 'highlight.js/lib/languages/json'
 
 hljs.registerLanguage('rust', rust)
 hljs.registerLanguage('javascript', javascript)
 hljs.registerLanguage('toml', ini)
+hljs.registerLanguage('json', json)
 
 hljs.registerLanguage('pomsky', function (hljs) {
   return {
@@ -85,15 +87,15 @@ hljs.registerLanguage('pomsky', function (hljs) {
       },
       {
         className: 'literal',
-        begin: /[%^$]/,
+        begin: /[%^$<>]+/,
       },
       {
         className: 'title',
         begin: /\b[\p{Alpha}_][\p{Alpha}\d_]*\b|\./,
       },
       {
         className: 'keyword',
-        begin: /[+*?{}!<>-]+/,
+        begin: /[+*?{}!-]+/,
       },
       {
         className: 'punctuation',
@@ -129,26 +131,50 @@ hljs.registerLanguage('regexp', function () {
     begin: /\\[pP]\w/,
   }
   const P_BRACED = {
-    className: 'literalx',
+    className: 'punctuation',
     begin: /\\[pP]\{/,
     end: /\}/,
     contains: [
       {
-        className: 'titlex',
+        className: 'title',
         begin: /[\w\-&.]+/,
       },
     ],
   }
   const LITERAL = {
-    className: 'literalx',
+    className: 'literal',
     begin: /\\x\w\w|\\u\w\w\w\w|\\[xu]\{[\w.]+\}/,
   }
+  const CHAR_RANGE = {
+    begin: [/[^\\\]]/, /-/, /[^\\\]]/],
+    beginScope: {
+      1: 'string',
+      2: 'keyword',
+      3: 'string',
+    },
+  }
   const SPECIAL_ESCAPE = {
-    className: 'literalx',
+    className: 'punctuation',
     begin: /\\[.?+*^|\-(){}[\]\\]/,
   }
+  const GK_ESCAPE = {
+    begin: [/\\[gk]</, /.*?/, />/],
+    beginScope: {
+      1: 'punctuation',
+      2: 'keyword',
+      3: 'punctuation',
+    },
+  }
+  const WORD_BOUNDARY = {
+    className: 'literal',
+    begin: /\\[bB]/,
+  }
+  const BACKREF_NUMBER = {
+    className: 'keyword',
+    begin: /\\[0-9]+/,
+  }
   const CHAR_ESCAPE = {
-    className: 'titlex',
+    className: 'title',
     begin: /\\./,
   }
 
@@ -159,24 +185,58 @@ hljs.registerLanguage('regexp', function () {
       {
         // modes, e.g. '(?s)'
         className: 'keyword',
-        begin: /\(\?\w\)/,
+        begin: /\(\?\w+\)/,
+      },
+      {
+        // capturing group start
+        begin: [/\(\?P?</, /\w+/, />/],
+        beginScope: {
+          1: 'punctuation',
+          2: 'keyword',
+          3: 'punctuation',
+        },
+      },
+      {
+        // negative lookaround start
+        begin: [/\(/, /\?<?/, /!/],
+        beginScope: {
+          1: 'punctuation',
+          2: 'literal',
+          3: 'keyword',
+        },
+      },
+      {
+        // positive lookaround start
+        begin: [/\(/, /\?<?=/],
+        beginScope: {
+          1: 'punctuation',
+          2: 'literal',
+        },
       },
       {
         // special group start
         className: 'punctuation',
-        begin: /\((\?:|\?<\w+>|\?=|\?!|\?<=|\?<!)/,
+        begin: /\(\?([:>]|[a-z-]+:)/,
+      },
+      {
+        className: 'comment',
+        begin: /\(\?#.*?\)/,
       },
       {
         className: 'punctuation',
         begin: /[|()]/,
       },
       {
-        className: 'literalx',
+        className: 'literal',
         begin: /[\^$]/,
       },
       {
         className: 'keyword',
-        begin: /[+*?.]+/,
+        begin: /[+*?]+/,
+      },
+      {
+        className: 'title',
+        begin: /\./,
       },
       {
         className: 'keyword',
@@ -197,16 +257,26 @@ hljs.registerLanguage('regexp', function () {
       P_SINGLE,
       LITERAL,
       SPECIAL_ESCAPE,
+      GK_ESCAPE,
+      WORD_BOUNDARY,
+      BACKREF_NUMBER,
       CHAR_ESCAPE,
       {
-        className: 'punctuation',
-        begin: /\[\^?/,
+        begin: [/\[/, /\^?/],
+        beginScope: {
+          1: 'punctuation',
+          2: 'keyword',
+        },
         end: /\]/,
         contains: [
           P_BRACED,
           P_SINGLE,
           LITERAL,
+          CHAR_RANGE,
           SPECIAL_ESCAPE,
+          GK_ESCAPE,
+          WORD_BOUNDARY,
+          BACKREF_NUMBER,
           CHAR_ESCAPE,
           {
             // make sure the above isn't triggered after a nested '['

diff --git a/assets/scss/common/_advantages.scss b/assets/scss/common/_advantages.scss
@@ -1,39 +1,45 @@
-.advantages-row {
+.advantages {
+  gap: 1.25rem;
+  margin: 0 0 2rem 0;
+
+  p {
+    margin-bottom: 1.25rem;
+  }
+
   > div {
-    margin: 2.5rem 0 0 0;
+    border: 2px solid #77777722;
+    border-radius: 1rem;
 
     > :not(img) {
-      margin-left: 130px;
+      margin-left: 65px;
     }
 
     img {
-      width: 96px;
+      width: 48px;
       height: auto;
       float: left;
-      margin-right: 34px;
+      margin-right: 17px;
     }
   }
 
-  h2 {
-    margin-top: 0;
+  h2,
+  img {
+    margin-top: 1.25rem;
   }
 
   @media (min-width: 992px) {
     margin-bottom: 3rem;
 
     > div {
-      margin: 1rem 0 0 0;
-      text-align: center;
-
       > :not(img) {
         margin-left: 0;
       }
 
       img {
-        width: 144px;
+        width: 72px;
         float: none;
         margin-right: 0;
-        margin-top: 1rem;
+        margin-top: 1.25rem;
       }
     }