fix: correct full order of pages, syntax highlighting and css improve…

…ments

.gitignore

@@ -3,3 +3,6 @@ public
 dist
 resources
 .hugo_build.lock
+
+# GIMP files
+*.xcf

assets/js/highlight.js

@@ -11,26 +11,28 @@ hljs.registerLanguage('toml', ini)
 hljs.registerLanguage('json', json)
 
 hljs.registerLanguage('pomsky', function (hljs) {
+  const STRING = {
+    className: 'string',
+    variants: [
+      {
+        begin: /"/,
+        contains: [
+          { begin: /\\[\\"]/, className: 'keyword' },
+          { begin: /\\./, className: 'illegal' },
+        ],
+        end: /"/,
+      },
+      { begin: /'/, end: /'/ },
+    ],
+  }
+
   return {
     name: 'pomsky',
     aliases: ['pomsky'],
     unicodeRegex: true,
     contains: [
       hljs.HASH_COMMENT_MODE,
-      {
-        className: 'string',
-        variants: [
-          {
-            begin: /"/,
-            contains: [
-              { begin: /\\[\\"]/, className: 'keyword' },
-              { begin: /\\./, className: 'illegal' },
-            ],
-            end: /"/,
-          },
-          { begin: /'/, end: /'/ },
-        ],
-      },
+      STRING,
       {
         scope: 'codepoint',
         className: 'literal',
@@ -57,6 +59,41 @@ hljs.registerLanguage('pomsky', function (hljs) {
           },
         ],
       },
+      {
+        scope: 'test',
+        begin: [/\btest/, /\s*/, /\{/],
+        beginScope: {
+          1: 'keyword',
+          3: 'punctuation',
+        },
+        end: /\}/,
+        endScope: 'punctuation',
+        contains: [
+          hljs.HASH_COMMENT_MODE,
+          STRING,
+          {
+            className: 'keyword',
+            begin: /\b(match|reject|as|in)\b/,
+          },
+          {
+            className: 'punctuation',
+            begin: /\{/,
+            end: /\}/,
+            contains: [
+              hljs.HASH_COMMENT_MODE,
+              STRING,
+              {
+                className: 'title',
+                begin: /\b[a-zA-Z]\w*\b/,
+              },
+              {
+                className: 'number',
+                begin: /\d+/,
+              },
+            ],
+          },
+        ],
+      },
       {
         className: 'keyword',
         beginKeywords:

assets/scss/common/_advantages.scss

@@ -7,9 +7,18 @@
   }
 
   > div {
+    flex: 1 1 30%;
     border: 2px solid #77777722;
     border-radius: 1rem;
 
+    @media (max-width: 1400px) {
+      flex: 1 1 45%;
+    }
+
+    @media (max-width: 992px) {
+      flex: 1 1 90%;
+    }
+
     > :not(img) {
       margin-left: 65px;
     }

assets/scss/common/_custom.scss

@@ -1,6 +1,9 @@
 /** Custom styles */
 
 :root {
+  font-size: 1.1rem;
+  line-height: 1.6;
+  --bs-body-line-height: 1.6;
   --bs-font-sans-serif: Inter, Roboto, -apple-system, blinkmacsystemfont, 'Segoe UI',
     'Helvetica Neue', 'Arial', 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
     'Segoe UI Symbol', 'Noto Color Emoji';
@@ -14,8 +17,8 @@
   --theme-duller: #db4900;
   --theme-dim: #7a2400;
   --theme-fg: white;
-  --link-color: #005986;
-  --link-color-focus: #006ca3;
+  --link-color: #006ba1;
+  --link-color-focus: #007ebd;
 }
 
 [data-dark-mode] {
@@ -29,6 +32,10 @@
   --link-color-focus: #60c4f6;
 }
 
+.container-xxl {
+  max-width: 1500px;
+}
+
 body .alert-primary,
 [data-dark-mode] body .alert-primary {
   background-color: #ff5500;
@@ -44,23 +51,6 @@ body .alert-primary,
   }
 }
 
-/*
-this fixes the large hover area of headings, but breaks the links in the right column
-
-.docs-content > h2[id],
-.docs-content > [id].h2,
-.docs-content > h3[id],
-.docs-content > [id].h3,
-.docs-content > h4[id],
-.docs-content > [id].h4 {
-  scroll-margin-top: 100px;
-
-  &::before {
-    display: none;
-  }
-}
-*/
-
 #landing-design {
   display: flex;
   margin: 7rem 0;
@@ -111,15 +101,15 @@ this fixes the large hover area of headings, but breaks the links in the right c
   }
 }
 
-:root:not([data-dark-mode]) {
+:root {
   .form-control,
   .comment-form input[type='text'],
   .comment-form input[type='email'],
   .comment-form input[type='url'],
   .comment-form textarea,
   .search-form .search-field {
     &.is-search:focus {
-      border-color: var(--theme-color);
+      border-color: #ff5500 !important;
       box-shadow: 0 0 0 0.25rem #bc622a40;
     }
   }
@@ -346,7 +336,17 @@ body .btn-toggle-nav a.active,
 body .offcanvas .nav-link.active,
 body .offcanvas .banner .nav a.active,
 .banner .nav body .offcanvas a.active {
-  color: var(--theme-duller);
+  color: var(--theme-duller) !important;
+}
+
+body .offcanvas .nav-link:hover,
+body .offcanvas .banner .nav a:hover,
+body .offcanvas .nav-link:focus,
+body .offcanvas .banner .nav a:focus,
+body .navbar .btn-link:hover,
+body .btn-toggle-nav a:hover,
+body .btn-toggle-nav a:focus {
+  color: var(--theme-duller) !important;
 }
 
 [data-dark-mode] body {
@@ -445,3 +445,74 @@ footer {
     font-size: 1.4rem;
   }
 }
+
+article h2[id],
+article [id].h2,
+article h3[id],
+article [id].h3,
+article h4[id],
+article [id].h4 {
+  scroll-margin-top: 100px;
+}
+
+.blog-width {
+  width: 90%;
+  max-width: 850px;
+  line-height: 1.67;
+
+  @media (max-width: 600px) {
+    width: 100%;
+  }
+
+  > h2[id]::before,
+  > [id].h2::before,
+  > h3[id]::before,
+  > [id].h3::before,
+  > h4[id]::before,
+  > [id].h4::before {
+    display: block;
+    height: 5rem;
+    margin-top: -5rem;
+    content: '';
+  }
+}
+
+.big-list {
+  font-size: 120%;
+  margin: 3.5rem 0.5rem;
+
+  li {
+    list-style-type: square;
+  }
+
+  code {
+    font-size: 95%;
+  }
+
+  a[href] {
+    font-weight: 500;
+    color: var(--theme-color);
+    position: relative;
+
+    &::after {
+      content: '';
+      border-bottom: 2px solid var(--theme-color);
+      position: absolute;
+      left: 0;
+      top: 0;
+      width: 0%;
+      height: 100%;
+      padding-top: 2px;
+      box-sizing: content-box;
+      transition: width 0.2s 0.05s;
+    }
+
+    &:hover {
+      text-decoration: none;
+
+      &::after {
+        width: 100%;
+      }
+    }
+  }
+}

content/blog/pomsky-0-8/index.md

@@ -36,13 +36,17 @@ All sponsors will receive monthly updates on what I am working on, as I want to
 
 This release focuses on stability, but also brings a few new features:
 
-> - Inline regexes landed, allowing you to use regex features not yet supported by Pomsky
->
-> - Pomsky now supports the dot, matching any code point
->
-> - An optimization pass that tries to make the generated regex smaller
->
-> - Many bugs were fixed
+<div class="big-list">
+
+- [Inline regexes](#inline-regexes) landed, allowing you to use regex features not yet supported by Pomsky
+
+- Pomsky now supports the [dot](#the-dot), matching any code point
+
+- An [optimization pass](#optimizations) that tries to make the generated regex smaller
+
+- Many bugs were fixed
+
+</div>
 
 ## Inline regexes