add commutative diagram plugin

_plugins/cd.rb

@@ -0,0 +1,58 @@
+# Made by me :)
+# Feel free to use if you give credit
+
+require "base64"
+
+module Jekyll
+  module Tags
+    class CDTag < Liquid::Block
+
+      def initialize(tag_name, markup, tokens)
+        super
+        arr = markup.split("s:")
+        if arr[1] != nil
+          @scale = arr[1].to_i
+        else
+          @scale = 60
+        end
+        @caption = arr[0].strip
+      end
+
+      def render(context)
+        site = context.registers[:site]
+
+        converter = site.find_converter_instance(::Jekyll::Converters::Markdown)
+        caption = converter.convert(@caption).gsub(/<\/?p[^>]*>/, '').chomp
+
+        code = super(context)
+
+        latex = <<EOF
+\\documentclass[tikz]{standalone}
+\\usepackage{tikz-cd}
+\\begin{document}
+\\begin{tikzcd}#{code}\\end{tikzcd}
+\\end{document}
+EOF
+
+        Dir.mktmpdir do |dir|
+          File.write("#{dir}/cd.tex", latex)
+          raise "pdflatex" unless system("pdflatex -output-directory #{dir} #{dir}/cd.tex")
+          raise "inkscape" unless system("inkscape -l --export-filename=#{dir}/cd.svg #{dir}/cd.pdf")
+          raise "scour" unless system("scour -i #{dir}/cd.svg -o #{dir}/optimized_cd.svg --enable-viewboxing --enable-id-stripping --enable-comment-stripping --shorten-ids --indent=none")
+          svg = File.read("#{dir}/optimized_cd.svg")
+          return <<EOF
+<figure class="cdfig">
+  <img class="cd" style="width: #{@scale}%;" src="data:image/svg+xml;base64#{Base64.encode64(svg)}" alt="A commutative diagram"/>
+  <figcaption>#{@caption}</figcaption>
+</figure>
+EOF
+        end
+
+        "<details><summary>#{caption}</summary>#{body}</details>"
+      end
+
+    end
+  end
+end
+
+Liquid::Template.register_tag('cd', Jekyll::Tags::CDTag)

assets/css/main.scss

@@ -187,6 +187,19 @@ table {
   border-collapse: collapse;
 }
 
+.cd {
+  display: block;
+  margin-left: auto;
+  margin-right: auto;
+  margin-bottom: 1em;
+  filter: invert(1);
+}
+
+.cdfig {
+  margin-top: 2em;
+  margin-bottom: 2em;
+}
+
 // https://github.com/daveyarwood/gruvbox-pygments/tree/master
 .highlight .hll { background-color: #ffffcc }
 .highlight  { background: #282828; color: #ebdbb2; background-color: #282828 }

deps.nix

@@ -124,4 +124,4 @@ with pkgs; let
       rouge
     ]);
 in
-[ nodejs ] ++ rubyEnv.gems
+[ nodejs inkscape scour ] ++ rubyEnv.gems