Replace monokai with GitHub-like Rouge syntax highlighting for consistent code fence rendering

README.md

@@ -92,6 +92,39 @@ bundle exec jekyll serve --host=localhost --livereload
 ```
 
 
+## Post summaries (home page excerpts)
+
+The home page now shows a concise summary for each post without leaking large code blocks.
+
+Summary priority (no changes needed to old posts):
+
+1. If a post defines `summary:` (or `description:`) in front matter, that is used.
+2. Otherwise the first real paragraph from the post body is extracted and truncated.
+3. If no paragraph is found, it falls back to Jekyll's excerpt or stripped content.
+
+Recommended usage for new posts:
+
+```yaml
+---
+layout: post
+title: My Post
+date: 2025-08-27
+summary: A one‑sentence teaser for the home page list.
+---
+
+Intro paragraph here…
+
+<!--more-->
+
+Rest of the content…
+```
+
+Notes:
+- `summary:` gives you full control over the home-page blurb.
+- `<!--more-->` is optional; use it when you want the per‑post page to show a short intro before the rest.
+- Old posts don’t need to be edited. They’ll automatically use their first paragraph.
+
+
 
 ## SEO Improvements
 
@@ -170,6 +203,7 @@ It is a brazen two-column  theme that pairs a prominent sidebar with uncomplicat
     - [Live reload](#live-reload)
   - [Testing imgur hosted images](#testing-imgur-hosted-images)
   - [Current full site testing example:](#current-full-site-testing-example)
+  - [Post summaries (home page excerpts)](#post-summaries-home-page-excerpts)
   - [SEO Improvements](#seo-improvements)
     - [Canonical URL](#canonical-url)
     - [Robots Tag](#robots-tag)

_includes/head.html

@@ -4,13 +4,8 @@
     <meta http-equiv="content-type" content="text/html; charset=utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
     <link rel="stylesheet" href="{{ site.baseurl }}/public/css/poole.css">
-    <!--
-        replace existing syntax css for a nice dark theme
-        https://jwarby.github.io/jekyll-pygments-themes/languages/java.html
-        https: //raw.githubusercontent.com/jwarby/pygments-css/master/monokai.css
-        <link rel="stylesheet" href="{{ site.baseurl }}/public/css/syntax.css">
-    -->
-    <link rel="stylesheet" href="{{ site.baseurl }}/public/css/monokai.css">
+    <!-- GitHub-like syntax highlighting using Rouge -->
+    <link rel="stylesheet" href="{{ site.baseurl }}/public/css/github-syntax.css">
     <link rel="stylesheet" href="{{ site.baseurl }}/public/css/hyde.css">
     <link rel="stylesheet" href="{{ site.baseurl }}/public/css/custom.css">
     <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700|Abril+Fatface">

index.html

@@ -14,7 +14,34 @@ <h1 class="post-title">
 
         <span class="post-date">{{ post.date | date_to_string }}</span>
 
-        <p>{{ post.content | strip_html | truncatewords:75}}</p>
+                {%- comment -%}
+                    Summary priority:
+                    1) front matter: summary/description
+                    2) first actual paragraph from rendered content (skips headings/code)
+                    3) fallback to excerpt or stripped content
+                {%- endcomment -%}
+
+                {% if post.summary %}
+                    <p>{{ post.summary }}</p>
+                {% elsif post.description %}
+                    <p>{{ post.description }}</p>
+                {% else %}
+                    {% assign paragraphs = post.content | split: '</p>' %}
+                    {% assign found_para = false %}
+                    {% for p in paragraphs %}
+                        {% if found_para == false and p contains '<p' %}
+                            {% assign found_para = true %}
+                            <p>{{ p | append: '</p>' | strip_html | truncatewords: 75 }}</p>
+                        {% endif %}
+                    {% endfor %}
+                    {% unless found_para %}
+                        {% if post.excerpt %}
+                            <p>{{ post.excerpt | strip_html | truncatewords: 75 }}</p>
+                        {% else %}
+                            <p>{{ post.content | strip_html | truncatewords: 75 }}</p>
+                        {% endif %}
+                    {% endunless %}
+                {% endif %}
         <p><a href="{{ site.baseurl }}{{ post.url }}">Continue Reading</a></p>
 
 

public/css/github-syntax.css

@@ -0,0 +1,213 @@
+.highlight table td { padding: 5px; }
+.highlight table pre { margin: 0; }
+.highlight .cm {
+  color: #999988;
+  font-style: italic;
+}
+.highlight .cp {
+  color: #999999;
+  font-weight: bold;
+}
+.highlight .c1 {
+  color: #999988;
+  font-style: italic;
+}
+.highlight .cs {
+  color: #999999;
+  font-weight: bold;
+  font-style: italic;
+}
+.highlight .c, .highlight .ch, .highlight .cd, .highlight .cpf {
+  color: #999988;
+  font-style: italic;
+}
+.highlight .err {
+  color: #a61717;
+  background-color: #e3d2d2;
+}
+.highlight .gd {
+  color: #000000;
+  background-color: #ffdddd;
+}
+.highlight .ge {
+  color: #000000;
+  font-style: italic;
+}
+.highlight .gr {
+  color: #aa0000;
+}
+.highlight .gh {
+  color: #999999;
+}
+.highlight .gi {
+  color: #000000;
+  background-color: #ddffdd;
+}
+.highlight .go {
+  color: #888888;
+}
+.highlight .gp {
+  color: #555555;
+}
+.highlight .gs {
+  font-weight: bold;
+}
+.highlight .gu {
+  color: #aaaaaa;
+}
+.highlight .gt {
+  color: #aa0000;
+}
+.highlight .kc {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .kd {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .kn {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .kp {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .kr {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .kt {
+  color: #445588;
+  font-weight: bold;
+}
+.highlight .k, .highlight .kv {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .mf {
+  color: #009999;
+}
+.highlight .mh {
+  color: #009999;
+}
+.highlight .il {
+  color: #009999;
+}
+.highlight .mi {
+  color: #009999;
+}
+.highlight .mo {
+  color: #009999;
+}
+.highlight .m, .highlight .mb, .highlight .mx {
+  color: #009999;
+}
+.highlight .sa {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .sb {
+  color: #d14;
+}
+.highlight .sc {
+  color: #d14;
+}
+.highlight .sd {
+  color: #d14;
+}
+.highlight .s2 {
+  color: #d14;
+}
+.highlight .se {
+  color: #d14;
+}
+.highlight .sh {
+  color: #d14;
+}
+.highlight .si {
+  color: #d14;
+}
+.highlight .sx {
+  color: #d14;
+}
+.highlight .sr {
+  color: #009926;
+}
+.highlight .s1 {
+  color: #d14;
+}
+.highlight .ss {
+  color: #990073;
+}
+.highlight .s, .highlight .dl {
+  color: #d14;
+}
+.highlight .na {
+  color: #008080;
+}
+.highlight .bp {
+  color: #999999;
+}
+.highlight .nb {
+  color: #0086B3;
+}
+.highlight .nc {
+  color: #445588;
+  font-weight: bold;
+}
+.highlight .no {
+  color: #008080;
+}
+.highlight .nd {
+  color: #3c5d5d;
+  font-weight: bold;
+}
+.highlight .ni {
+  color: #800080;
+}
+.highlight .ne {
+  color: #990000;
+  font-weight: bold;
+}
+.highlight .nf, .highlight .fm {
+  color: #990000;
+  font-weight: bold;
+}
+.highlight .nl {
+  color: #990000;
+  font-weight: bold;
+}
+.highlight .nn {
+  color: #555555;
+}
+.highlight .nt {
+  color: #000080;
+}
+.highlight .vc {
+  color: #008080;
+}
+.highlight .vg {
+  color: #008080;
+}
+.highlight .vi {
+  color: #008080;
+}
+.highlight .nv, .highlight .vm {
+  color: #008080;
+}
+.highlight .ow {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .o {
+  color: #000000;
+  font-weight: bold;
+}
+.highlight .w {
+  color: #bbbbbb;
+}
+.highlight {
+  background-color: #f8f8f8;
+}