feat: use Tailwind typography and implement rose pine, WIP

pelican/themes/simple/static/css/highlight-rp-dawn.css

@@ -0,0 +1,112 @@
+/*!
+  Theme: Rose Pine
+  Origin: https://rosepinetheme.com/
+*/
+
+/*  Comment */
+.hljs-meta,
+.hljs-comment {
+    color: #9893a5;
+}
+
+/* Red */
+/*INFO: This keyword, HTML elements, Regex group symbol, CSS units, Terminal Red */
+.hljs-tag,
+.hljs-doctag,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-regexp,
+.hljs-template-tag,
+.hljs-selector-pseudo,
+.hljs-selector-attr,
+.hljs-variable.language_,
+.hljs-deletion {
+    color: #b4637a;
+}
+
+/*Orange */
+/*INFO: Number and Boolean constants, Language support constants */
+.hljs-variable,
+.hljs-template-variable,
+.hljs-number,
+.hljs-literal,
+.hljs-type,
+.hljs-params,
+.hljs-link {
+    color: #d7827e;
+}
+
+/*  Yellow */
+/* INFO:  	Function parameters, Regex character sets, Terminal Yellow */
+.hljs-built_in,
+.hljs-attribute {
+    color: #ea9d34;
+}
+/* cyan */
+/* INFO: Language support functions, CSS HTML elements */
+.hljs-selector-tag {
+    color: #286983;
+}
+
+/* light blue */
+/* INFO: Object properties, Regex quantifiers and flags, Markdown headings, Terminal Cyan, Markdown code, Import/export keywords */
+.hljs-keyword,
+.hljs-title.function_,
+.hljs-title,
+.hljs-title.class_,
+.hljs-title.class_.inherited__,
+.hljs-subst,
+.hljs-property {
+    color: #56949f;
+}
+
+/*Green*/
+/* INFO: Object literal keys, Markdown links, Terminal Green */
+.hljs-selector-tag {
+    color: #56949f;
+}
+
+/*Green(er) */
+/* INFO: Strings, CSS class names */
+.hljs-quote,
+.hljs-string,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-addition {
+    color: #286983;
+}
+
+/* INFO:  	Function names, CSS property names, Terminal Blue */
+.hljs-code,
+.hljs-formula,
+.hljs-section {
+    color: #d7827e;
+}
+
+/* Magenta */
+/*INFO: Control Keywords, Storage Types, Regex symbols and operators, HTML Attributes, Terminal Magenta */
+.hljs-name,
+.hljs-keyword,
+.hljs-operator,
+.hljs-keyword,
+.hljs-char.escape_,
+.hljs-attr {
+    color: #907aa9;
+}
+
+.hljs-punctuation {
+    color: #575279;
+}
+
+.hljs {
+    background: #faf4ed;
+    color: #575279;
+}
+
+.hljs-emphasis {
+    font-style: italic;
+}
+
+.hljs-strong {
+    font-weight: bold;
+}

pelican/themes/simple/static/css/highlight-rp-moon.css

@@ -0,0 +1,114 @@
+/*!
+  Theme: Rose Pine
+  Origin: https://rosepinetheme.com/
+*/
+
+/*  Comment */
+.hljs-meta,
+.hljs-comment {
+    color: #6e6a86;
+}
+
+/* Red */
+/*INFO: This keyword, HTML elements, Regex group symbol, CSS units, Terminal Red */
+.hljs-tag,
+.hljs-doctag,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-regexp,
+.hljs-template-tag,
+.hljs-selector-pseudo,
+.hljs-selector-attr,
+.hljs-variable.language_,
+.hljs-deletion {
+    color: #eb6f92;
+}
+
+/*Orange */
+/*INFO: Number and Boolean constants, Language support constants */
+.hljs-variable,
+.hljs-template-variable,
+.hljs-number,
+.hljs-literal,
+.hljs-type,
+.hljs-params,
+.hljs-link {
+    color: #ea9a97;
+}
+
+/*  Yellow */
+/* INFO:  	Function parameters, Regex character sets, Terminal Yellow */
+.hljs-built_in,
+.hljs-attribute {
+    color: #f6c177;
+}
+/* cyan */
+/* INFO: Language support functions, CSS HTML elements */
+.hljs-selector-tag {
+    color: #3e8fb0;
+}
+
+/* light blue */
+/* INFO: Object properties, Regex quantifiers and flags, Markdown headings, Terminal Cyan, Markdown code, Import/export keywords */
+.hljs-keyword,
+.hljs-title.function_,
+.hljs-title,
+.hljs-title.class_,
+.hljs-title.class_.inherited__,
+.hljs-subst,
+.hljs-property {
+    color: #9ccfd8;
+}
+
+/*Green*/
+/* INFO: Object literal keys, Markdown links, Terminal Green */
+.hljs-selector-tag {
+    color: #9ccfd8;
+}
+
+/*Green(er) */
+/* INFO: Strings, CSS class names */
+.hljs-quote,
+.hljs-string,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-addition {
+    color: #3e8fb0;
+}
+
+/* INFO:  	Function names, CSS property names, Terminal Blue */
+.hljs-code,
+.hljs-formula,
+.hljs-section {
+    color: #ea9a97;
+}
+
+/* Magenta */
+/*INFO: Control Keywords, Storage Types, Regex symbols and operators, HTML Attributes, Terminal Magenta */
+.hljs-name,
+.hljs-keyword,
+.hljs-operator,
+.hljs-keyword,
+.hljs-char.escape_,
+.hljs-attr {
+    color: #c4a7e7;
+}
+
+/* white*/
+/* INFO: Variables, Class names, Terminal White */
+.hljs-punctuation {
+    color: #e0def4;
+}
+
+.hljs {
+    background: #232136;
+    color: #6e6a86;
+}
+
+.hljs-emphasis {
+    font-style: italic;
+}
+
+.hljs-strong {
+    font-weight: bold;
+}

pelican/themes/simple/static/css/in.css

@@ -1,4 +1,4 @@
-@tailwind base; /* Preflight will be injected here */
+@tailwind base; /* Preflight is injected here */
 @tailwind components;
 @tailwind utilities;
 
@@ -9,19 +9,19 @@
         @apply font-sans;
     }
     a {
-        @apply text-green-600 hover:text-green-300 underline decoration-2 underline-offset-4;
+        @apply text-rp-moon-iris underline decoration-4 underline-offset-4;
     }
     h1 {
-        @apply font-sans text-7xl;
+        @apply font-sans text-7xl text-rp-moon-gold prose prose-h1:text-rp-moon-gold;
     }
     h2 {
-        @apply font-sans text-5xl mb-6 mt-4;
+        @apply font-sans text-5xl text-rp-moon-gold prose prose-h1:text-rp-moon-gold;
     }
     h3 {
-        @apply font-sans text-4xl mb-6 mt-4;
+        @apply font-sans text-4xl text-rp-moon-gold prose prose-h1:text-rp-moon-gold;
     }
     h4 {
-        @apply font-sans text-3xl mb-6 mt-4;
+        @apply font-sans text-3xl text-rp-moon-gold prose prose-h1:text-rp-moon-gold;
     }
     h5 {
         @apply font-sans text-2xl mb-6 mt-4;
@@ -29,14 +29,4 @@
     h6 {
         @apply font-sans text-xl mb-6 mt-4;
     }
-    ul {
-        @apply list-disc list-inside;
-    }
-    dd {
-        @apply pl-8;
-    }
-}
-.highlight {
-    @apply bg-gray-300 font-mono m-5 p-5;
-    /*@apply bg-gray-300 font-mono m-5 p-5 block;*/
 }