Respect toc attribute in metadata

src/misc/markdown.rs

@@ -154,7 +154,7 @@ pub fn get_options<'a>() -> ComrakOptions<'a> {
     // options.render.broken_link_callback = ...;
 
     // Renderer
-    options.render.hardbreaks = false; // could be true? change by metadata could be good for compatibility
+    options.render.hardbreaks = true;
     options.render.github_pre_lang = false;
     options.render.full_info_string = true;
     options.render.width = 0; // 0 mean disabled?
@@ -289,7 +289,7 @@ pub fn read_md(
 ) -> File {
     let arena = Arena::new();
 
-    let opt = options.map_or_else(get_options, |specific_opt| specific_opt);
+    let mut opt = options.map_or_else(get_options, |specific_opt| specific_opt);
     let root = parse_document(&arena, raw_text, &opt);
 
     // Find metadata
@@ -298,6 +298,11 @@ pub fn read_md(
     let mermaid_name = "mermaid";
     hljs_replace(root, mermaid_name);
 
+    if let TypeFileMetadata::Blog = metadata_type {
+        // Change by metadata could be good for compatibility
+        opt.render.hardbreaks = true;
+    }
+
     // Convert to HTML
     let mut html = vec![];
     format_html(root, &opt, &mut html).unwrap();

static/css/blog/post.css

@@ -1,21 +1,13 @@
+@import "../markdown.css";
+
 @media (prefers-color-scheme: light) {
   :root {
-    --code-font-color: #333333;
-    --code-bg-color: #eeeeee;
-    --quote-border-color: #9852fa;
-    --quote-bg-color: #d8d6d6;
-    --separator-color: #cccccc;
     --tag-bg-color: #d2e0f0;
   }
 }
 
 @media (prefers-color-scheme: dark) {
   :root {
-    --code-font-color: #eeeeee;
-    --code-bg-color: #333333;
-    --quote-border-color: #bd93f9;
-    --quote-bg-color: #273341;
-    --separator-color: #414558;
     --tag-bg-color: #242e38;
   }
 }
@@ -24,11 +16,6 @@
   --max-width: 750px;
 }
 
-/* Page */
-html {
-  scroll-behavior: smooth;
-}
-
 body {
   max-width: var(--max-width);
   margin: auto;
@@ -70,49 +57,8 @@ main {
   max-width: 100%;
 }
 
-/* Anchors */
-:is(h1, h2, h3, h4, h5, h6):hover a.anchor::before {
-  visibility: visible;
-}
-
-a.anchor::before {
-  content: "#";
-  visibility: hidden;
-  padding-right: 0.1em;
-}
-
-a.anchor {
-  text-decoration: none;
-  vertical-align: baseline;
-}
-
-/* Links in headers */
-:is(h1, h2, h3, h4, h5, h6) a {
-  font-size: inherit;
-}
-
-/* Separators */
-hr {
-  border: 0;
-  height: 1px;
-  background: var(--separator-color);
-}
-
-/* Quotes */
-blockquote {
-  margin: 1em 0;
-  padding: 0.1em 10px;
-  border-left: 6px solid;
-  border-color: var(--quote-border-color);
-  background: var(--quote-bg-color);
-  border-top-right-radius: 5px;
-  border-bottom-right-radius: 5px;
-}
-
 /* Images */
 img {
-  display: block;
-  margin: auto;
   max-width: var(--max-width);
 }
 
@@ -122,115 +68,6 @@ code {
   font-family: monospace;
 }
 
-/* Little snippet of code (not blocks) */
-kbd,
-code:not(.hljs):not(:has(svg)) {
-  background: var(--code-bg-color);
-  border-radius: 3px;
-  color: var(--code-font-color);
-  box-shadow: 0 1px 1px black;
-  font-size: calc(var(--font-size) * 0.8);
-  padding: 2px 4px;
-  vertical-align: 1.5px;
-}
-
-/* Code blocks */
-.hljs {
-  border-radius: 5px;
-}
-
-.hljs::-webkit-scrollbar {
-  width: 7px;
-  height: 9px;
-  background: var(--background);
-}
-
-.hljs::-webkit-scrollbar-thumb {
-  background-color: var(--font-color);
-  border-radius: 10px;
-}
-
-/* Marge for numbers */
-.hljs-ln-n {
-  margin-right: 0.4em;
-}
-
-/* Numbers in codeblocks */
-.hljs-ln-numbers {
-  text-align: right;
-  color: var(--font-color);
-}
-
-/* Fix scroll in codeblocks with line numbering */
-table.hljs-ln {
-  overflow: hidden;
-}
-
-/* Background for copy code button */
-.hljs-copy-button {
-  background-color: var(--background) !important;
-}
-
-/* Light theme for the copy code button */
-@media (prefers-color-scheme: light) {
-  .hljs-copy-button {
-    background-color: var(--font-color) !important;
-    filter: invert(100%);
-  }
-}
-
-/* Hide last line in codeblocks if empty */
-.hljs-ln
-  > tbody
-  > tr:last-child:has(td:last-child > span::-moz-only-whitespace) {
-  visibility: collapse;
-}
-
-/* Temporary fix for layout.css.has-selector.enabled available only on
- * Firefox under certain circumstances */
-.hljs-ln > tbody > tr:last-child {
-  visibility: collapse;
-}
-
-/* Reference to footnotes */
-.footnote-ref a {
-  text-decoration: underline dotted;
-  font-size: calc(var(--font-size) * 0.8);
-}
-
-/* Footnote */
-section.footnotes * {
-  font-size: calc(var(--font-size) * 0.8);
-}
-
-/* When multiple ref */
-a.footnote-backref sup {
-  font-size: calc(var(--font-size) * 0.6);
-}
-a.footnote-backref sup::before {
-  content: "(";
-}
-a.footnote-backref sup::after {
-  content: ")";
-}
-
-/* Footnotes links */
-a.footnote-backref {
-  font-family: "Segoe UI", "Segoe UI Symbol", system-ui;
-  text-decoration: underline dotted;
-}
-
-/* Footnotes block separation from article */
-section.footnotes {
-  margin: 3px;
-  border-top: 2px dotted var(--separator-color);
-}
-
-/* Mermaid diagrams */
-pre:has(code.language-mermaid) {
-  text-align: center;
-}
-
 /* Table of content */
 nav#toc {
   position: fixed;
@@ -246,36 +83,3 @@ nav#toc {
     visibility: hidden;
   }
 }
-
-@media print {
-  /* Better colors for paper */
-  blockquote {
-    border-color: black;
-    background: var(--background);
-  }
-
-  .hljs {
-    background: var(--background);
-  }
-
-  /* Force line numbering to be on top */
-  td.hljs-ln-line {
-    vertical-align: top;
-  }
-
-  /* Break code */
-  code.hljs {
-    white-space: break-spaces;
-    hyphens: none;
-  }
-
-  /* Hide arrows of backref */
-  a.footnote-backref {
-    visibility: hidden;
-  }
-
-  /* No underline for footnotes */
-  .footnote-ref > a {
-    text-decoration: none;
-  }
-}

static/css/cours.css

@@ -1,3 +1,13 @@
+@import "markdown.css";
+
+:root {
+  --max-width: 900px;
+}
+
+main {
+  max-width: var(--max-width);
+}
+
 /* Filetree */
 aside {
   float: left;
@@ -48,6 +58,4 @@ aside li.directory {
 
 main img {
   max-width: 100%;
-  display: block;
-  margin: auto;
 }

static/css/markdown.css

@@ -0,0 +1,248 @@
+@media (prefers-color-scheme: light) {
+  :root {
+    --code-font-color: #333333;
+    --code-bg-color: #eeeeee;
+    --quote-border-color: #9852fa;
+    --quote-bg-color: #d8d6d6;
+    --separator-color: #cccccc;
+    --tag-bg-color: #d2e0f0;
+  }
+}
+
+@media (prefers-color-scheme: dark) {
+  :root {
+    --code-font-color: #eeeeee;
+    --code-bg-color: #333333;
+    --quote-border-color: #bd93f9;
+    --quote-bg-color: #273341;
+    --separator-color: #414558;
+    --tag-bg-color: #242e38;
+  }
+}
+
+/* Page */
+html {
+  scroll-behavior: smooth;
+}
+
+/* Anchors */
+main :is(h1, h2, h3, h4, h5, h6):hover a.anchor::before {
+  visibility: visible;
+}
+
+main a.anchor::before {
+  content: "#";
+  visibility: hidden;
+  padding-right: 0.1em;
+}
+
+main a.anchor {
+  text-decoration: none;
+  vertical-align: baseline;
+}
+
+/* Links in headers */
+:is(h1, h2, h3, h4, h5, h6) a {
+  font-size: inherit;
+}
+
+/* Images */
+main img {
+  display: block;
+  margin: auto;
+}
+
+/* Separators */
+hr {
+  border: 0;
+  height: 1px;
+  background: var(--separator-color);
+}
+
+/* Quotes */
+blockquote {
+  margin: 1em 0;
+  padding: 0.1em 10px;
+  border-left: 6px solid;
+  border-color: var(--quote-border-color);
+  background: var(--quote-bg-color);
+  border-top-right-radius: 5px;
+  border-bottom-right-radius: 5px;
+}
+
+/* Little snippet of code (not blocks) */
+kbd,
+code:not(.hljs):not(:has(svg)) {
+  background: var(--code-bg-color);
+  border-radius: 3px;
+  color: var(--code-font-color);
+  box-shadow: 0 1px 1px black;
+  font-size: calc(var(--font-size) * 0.8);
+  padding: 2px 4px;
+  vertical-align: 1.5px;
+}
+
+/* Code blocks */
+.hljs {
+  border-radius: 5px;
+}
+
+.hljs::-webkit-scrollbar {
+  width: 7px;
+  height: 9px;
+  background: var(--background);
+}
+
+.hljs::-webkit-scrollbar-thumb {
+  background-color: var(--font-color);
+  border-radius: 10px;
+}
+
+/* Marge for numbers */
+.hljs-ln-n {
+  margin-right: 0.4em;
+}
+
+/* Numbers in codeblocks */
+.hljs-ln-numbers {
+  text-align: right;
+  color: var(--font-color);
+}
+
+/* Fix scroll in codeblocks with line numbering */
+table.hljs-ln {
+  overflow: hidden;
+}
+
+/* Background for copy code button */
+.hljs-copy-button {
+  background-color: var(--background) !important;
+}
+
+/* Light theme for the copy code button */
+@media (prefers-color-scheme: light) {
+  .hljs-copy-button {
+    background-color: var(--font-color) !important;
+    filter: invert(100%);
+  }
+}
+
+/* Hide last line in codeblocks if empty */
+.hljs-ln
+  > tbody
+  > tr:last-child:has(td:last-child > span::-moz-only-whitespace) {
+  visibility: collapse;
+}
+
+/* Temporary fix for layout.css.has-selector.enabled available only on
+ * Firefox under certain circumstances */
+.hljs-ln > tbody > tr:last-child {
+  visibility: collapse;
+}
+
+/* Reference to footnotes */
+.footnote-ref a {
+  text-decoration: underline dotted;
+  font-size: calc(var(--font-size) * 0.8);
+}
+
+/* Footnote */
+section.footnotes * {
+  font-size: calc(var(--font-size) * 0.8);
+}
+
+/* When multiple ref */
+a.footnote-backref sup {
+  font-size: calc(var(--font-size) * 0.6);
+}
+a.footnote-backref sup::before {
+  content: "(";
+}
+a.footnote-backref sup::after {
+  content: ")";
+}
+
+/* Footnotes links */
+a.footnote-backref {
+  font-family: "Segoe UI", "Segoe UI Symbol", system-ui;
+  text-decoration: underline dotted;
+}
+
+/* Footnotes block separation from content */
+section.footnotes {
+  margin: 3px;
+  border-top: 2px dotted var(--separator-color);
+}
+
+/* Mermaid diagrams */
+pre:has(code.language-mermaid) {
+  text-align: center;
+}
+
+/* Tables */
+table:not(.hljs-ln) {
+  border-collapse: collapse;
+  margin-inline: auto;
+}
+
+table:not(.hljs-ln) th,
+table:not(.hljs-ln) td {
+  padding: 5px;
+  border: 1px solid var(--separator-color);
+}
+
+table:not(.hljs-ln)th {
+  border-bottom: 2px solid var(--separator-color);
+}
+
+/* No borders on the outer edges of the table */
+table:not(.hljs-ln) tr:last-child td {
+  border-bottom: 0;
+}
+
+table:not(.hljs-ln) tr:first-child th {
+  border-top: 0;
+}
+
+table:not(.hljs-ln) tr td:first-child,
+table:not(.hljs-ln) tr th:first-child {
+  border-left: 0;
+}
+
+table:not(.hljs-ln) tr td:last-child,
+table:not(.hljs-ln) tr th:last-child {
+  border-right: 0;
+}
+
+@media print {
+  /* Better colors for paper */
+  blockquote {
+    border-color: black;
+    background: var(--background);
+  }
+
+  .hljs {
+    background: var(--background);
+  }
+
+  /* Force line numbering to be on top */
+  td.hljs-ln-line {
+    vertical-align: top;
+  }
+
+  /* Break code */
+  code.hljs {
+    white-space: break-spaces;
+    hyphens: none;
+  }
+
+  /* Hide arrows of backref */
+  a.footnote-backref {
+    visibility: hidden;
+  }
+
+  /* No underline for footnotes */
+  .footnote-ref > a {
+    text-decoration: none;
+  }
+}

static/js/cours.js

@@ -80,11 +80,16 @@ const deepestNodeOpened = (path, options) => {
   }
 };
 
-const svgDarkTheme = () => {
+const Mode = {
+  Light: 1,
+  Dark: 2,
+};
+
+const svgChangeTheme = (mode) => {
   for (const item of document.getElementsByTagName("img")) {
     if (!item.src.startsWith("data:image/svg+xml;base64,")) {
       // Exclude image who aren't SVG and base64 encoded
-      break;
+      continue;
     }
 
     /** Convert to grayscale */
@@ -129,9 +134,19 @@ const svgDarkTheme = () => {
     const totalGrayscale = grayscaleValues.reduce((acc, val) => acc + val, 0);
     const averageGrayscale = totalGrayscale / grayscaleValues.length;
 
-    if (averageGrayscale < 128) {
+    const treshold = 128;
+
+    if (averageGrayscale < treshold && mode === Mode.Dark) {
       item.style = "filter: invert(1);";
+      continue;
     }
+
+    if (averageGrayscale > treshold && mode === Mode.Light) {
+      item.style = "filter: invert(1);";
+      continue;
+    }
+
+    item.style = "";
   }
 };
 
@@ -160,8 +175,16 @@ window.addEventListener("load", () => {
     uncollapse(last_openeded);
   }
 
-  // Fix SVG images in dark mode
+  // Fix SVG images
-  if (window.matchMedia("(prefers-color-scheme: dark)").matches) {
+  svgChangeTheme(
-    svgDarkTheme();
+    window.matchMedia("(prefers-color-scheme: dark)").matches
-  }
+      ? Mode.Dark
+      : Mode.Light
+  );
 });
+
+window
+  .matchMedia("(prefers-color-scheme: dark)")
+  .addEventListener("change", (event) =>
+    svgChangeTheme(event.matches ? Mode.Dark : Mode.Light)
+  );

static/js/libs/katex.js

@@ -2,17 +2,17 @@ window.addEventListener("load", () => {
   const macros = {};
   for (const item of new Map(
     Object.entries({
+      B: "mathbb{B}",
       N: "mathbb{N}",
       R: "mathbb{R}",
       Z: "mathbb{Z}",
-      B: "mathbb{B}",
       O: "Theta",
+      Tau: "mathrm{T}",
+      u: "mu",
       ra: "rightarrow",
       la: "leftarrow",
       RA: "Rightarrow",
       LA: "Leftarrow",
-      u: "mu",
-      Tau: "mathrm{T}",
       lb: "llbracket",
       rb: "rrbracket",
     })