add code highlighting

set correct path in uwsgi
bump babycode version
2025-10-12 23:47:14 +03:00 · 2025-10-12 22:07:12 +03:00 · 2025-08-17 21:11:19 +03:00
7 changed files with 1199 additions and 60 deletions
--- a/app/lib/babycode.py
+++ b/app/lib/babycode.py
@@ -1,8 +1,12 @@
 from .babycode_parser import Parser
 from markupsafe import Markup, escape
+from pygments import highlight
+from pygments.formatters import HtmlFormatter
+from pygments.lexers import get_lexer_by_name
+from pygments.util import ClassNotFound as PygmentsClassNotFound
 import re

-BABYCODE_VERSION = 3
+BABYCODE_VERSION = 4

 NAMED_COLORS = [
    'black', 'silver', 'gray', 'white', 'maroon', 'red',
@@ -56,9 +60,17 @@ def tag_code(children, attr, surrounding):
    if is_inline:
        return f"<code class=\"inline-code\">{children}</code>"
    else:
-        t = children.strip()
-        button = f"<button type=button class=\"copy-code\" value=\"{t}\">Copy</button>"
-        return f"<pre><span class=\"copy-code-container\">{button}</span><code>{t}</code></pre>"
+        input_code = children.strip()
+        button = f"<button type=button class=\"copy-code\" value=\"{input_code}\">Copy</button>"
+        unhighlighted = f"<pre><span class=\"copy-code-container\"><span class=\"code-language-identifier\">code block</span>{button}</span><code>{input_code}</code></pre>"
+        if not attr:
+            return unhighlighted
+        try:
+            lexer = get_lexer_by_name(attr.strip())
+            formatter = HtmlFormatter(nowrap=True)
+            return f"<pre><span class=\"copy-code-container\"><span class=\"code-language-identifier\">{lexer.name}</span>{button}</span><code>{highlight(input_code.unescape(), lexer, formatter)}</code></pre>"
+        except PygmentsClassNotFound:
+            return unhighlighted

 def tag_list(children):
    list_body = re.sub(r"  +\n", "<br>", children.strip())
--- a/app/templates/babycode.html
+++ b/app/templates/babycode.html
@@ -11,6 +11,8 @@
      <section class="babycode-guide-section">
        <h2 id="what-is-babycode">What is babycode?</h2>
        <p>You may be familiar with BBCode, a loosely related family of markup languages popular on forums. Babycode is another, simplified, dialect of those languages. It is a way of formatting text by enclosing parts of it in special tags.</p>
+        <p>A <b>tag</b> is a short name enclosed in square brackets. Tags can be opening tags, like <code class="inline-code">[b]</code> or closing tags, like <code class="inline-code">[/b]</code>. Anything inserted between matching opening and closing tags is known as the tag's content.</p>
+        <p>Some tags can provide more specific instructions using an <b>attribute</b>. An attribute is added to the opening tag with an equals sign (<code class="inline-code">=</code>). This allows you to specify details like a particular color or a link's address.</p>
      </section>
      <section class="babycode-guide-section">
        <h2 id="text-formatting-tags">Text formatting tags</h2>
@@ -135,7 +137,8 @@
        {% set code = 'func _ready() -> void:\n\tprint("hello world!")' %}
        <p>There are two kinds of code blocks recognized by babycode: inline and block. Inline code blocks do not break a paragraph. They can be added with <code class="inline-code">[code]your code here[/code]</code>. As long as there are no line breaks inside the code block, it is considered inline. If there are any, it will produce this:</p>
        {{ ('[code]%s[/code]' % code) | babycode | safe }}
-        <br>
+        <p>Optionally, you can enable syntax highlighting by specifying the language in the attribute like this: <code class="inline-code">[code=gdscript]</code></p>
+        {{ ('[code=gdscript]%s[/code]' % code) | babycode | safe}}
        <p>Inline code tags look like this: {{ '[code]Inline code[/code]' | babycode | safe }}</p>
        <p>Babycodes are not parsed inside code blocks.</p>
      </section>
--- a/data/static/css/style.css
+++ b/data/static/css/style.css
@@ -194,13 +194,356 @@ pre code {
  overflow: scroll;
  tab-size: 4;
 }
+pre code .hll {
+  background-color: #6e7681;
+}
+pre code .c {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment */ }
+pre code .err {
+  color: #F85149;
+}
+pre code { /* Error */ }
+pre code .esc {
+  color: #E6EDF3;
+}
+pre code { /* Escape */ }
+pre code .g {
+  color: #E6EDF3;
+}
+pre code { /* Generic */ }
+pre code .k {
+  color: #FF7B72;
+}
+pre code { /* Keyword */ }
+pre code .l {
+  color: #A5D6FF;
+}
+pre code { /* Literal */ }
+pre code .n {
+  color: #E6EDF3;
+}
+pre code { /* Name */ }
+pre code .o {
+  color: #FF7B72;
+  font-weight: bold;
+}
+pre code { /* Operator */ }
+pre code .x {
+  color: #E6EDF3;
+}
+pre code { /* Other */ }
+pre code .p {
+  color: #E6EDF3;
+}
+pre code { /* Punctuation */ }
+pre code .ch {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Hashbang */ }
+pre code .cm {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Multiline */ }
+pre code .cp {
+  color: #8B949E;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Comment.Preproc */ }
+pre code .cpf {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.PreprocFile */ }
+pre code .c1 {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Single */ }
+pre code .cs {
+  color: #8B949E;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Comment.Special */ }
+pre code .gd {
+  color: #FFA198;
+  background-color: #490202;
+}
+pre code { /* Generic.Deleted */ }
+pre code .ge {
+  color: #E6EDF3;
+  font-style: italic;
+}
+pre code { /* Generic.Emph */ }
+pre code .ges {
+  color: #E6EDF3;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Generic.EmphStrong */ }
+pre code .gr {
+  color: #FFA198;
+}
+pre code { /* Generic.Error */ }
+pre code .gh {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Generic.Heading */ }
+pre code .gi {
+  color: #56D364;
+  background-color: #0F5323;
+}
+pre code { /* Generic.Inserted */ }
+pre code .go {
+  color: #8B949E;
+}
+pre code { /* Generic.Output */ }
+pre code .gp {
+  color: #8B949E;
+}
+pre code { /* Generic.Prompt */ }
+pre code .gs {
+  color: #E6EDF3;
+  font-weight: bold;
+}
+pre code { /* Generic.Strong */ }
+pre code .gu {
+  color: #79C0FF;
+}
+pre code { /* Generic.Subheading */ }
+pre code .gt {
+  color: #FF7B72;
+}
+pre code { /* Generic.Traceback */ }
+pre code .g-Underline {
+  color: #E6EDF3;
+  text-decoration: underline;
+}
+pre code { /* Generic.Underline */ }
+pre code .kc {
+  color: #79C0FF;
+}
+pre code { /* Keyword.Constant */ }
+pre code .kd {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Declaration */ }
+pre code .kn {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Namespace */ }
+pre code .kp {
+  color: #79C0FF;
+}
+pre code { /* Keyword.Pseudo */ }
+pre code .kr {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Reserved */ }
+pre code .kt {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Type */ }
+pre code .ld {
+  color: #79C0FF;
+}
+pre code { /* Literal.Date */ }
+pre code .m {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number */ }
+pre code .s {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String */ }
+pre code .na {
+  color: #E6EDF3;
+}
+pre code { /* Name.Attribute */ }
+pre code .nb {
+  color: #E6EDF3;
+}
+pre code { /* Name.Builtin */ }
+pre code .nc {
+  color: #F0883E;
+  font-weight: bold;
+}
+pre code { /* Name.Class */ }
+pre code .no {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Name.Constant */ }
+pre code .nd {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Decorator */ }
+pre code .ni {
+  color: #FFA657;
+}
+pre code { /* Name.Entity */ }
+pre code .ne {
+  color: #F0883E;
+  font-weight: bold;
+}
+pre code { /* Name.Exception */ }
+pre code .nf {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Function */ }
+pre code .nl {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Name.Label */ }
+pre code .nn {
+  color: #FF7B72;
+}
+pre code { /* Name.Namespace */ }
+pre code .nx {
+  color: #E6EDF3;
+}
+pre code { /* Name.Other */ }
+pre code .py {
+  color: #79C0FF;
+}
+pre code { /* Name.Property */ }
+pre code .nt {
+  color: #7EE787;
+}
+pre code { /* Name.Tag */ }
+pre code .nv {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable */ }
+pre code .ow {
+  color: #FF7B72;
+  font-weight: bold;
+}
+pre code { /* Operator.Word */ }
+pre code .pm {
+  color: #E6EDF3;
+}
+pre code { /* Punctuation.Marker */ }
+pre code .w {
+  color: #6E7681;
+}
+pre code { /* Text.Whitespace */ }
+pre code .mb {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Bin */ }
+pre code .mf {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Float */ }
+pre code .mh {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Hex */ }
+pre code .mi {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Integer */ }
+pre code .mo {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Oct */ }
+pre code .sa {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Affix */ }
+pre code .sb {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Backtick */ }
+pre code .sc {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Char */ }
+pre code .dl {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Delimiter */ }
+pre code .sd {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Doc */ }
+pre code .s2 {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Double */ }
+pre code .se {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Escape */ }
+pre code .sh {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Heredoc */ }
+pre code .si {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Interpol */ }
+pre code .sx {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Other */ }
+pre code .sr {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Regex */ }
+pre code .s1 {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Single */ }
+pre code .ss {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Symbol */ }
+pre code .bp {
+  color: #E6EDF3;
+}
+pre code { /* Name.Builtin.Pseudo */ }
+pre code .fm {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Function.Magic */ }
+pre code .vc {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Class */ }
+pre code .vg {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Global */ }
+pre code .vi {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Instance */ }
+pre code .vm {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Magic */ }
+pre code .il {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Integer.Long */ }

 .copy-code-container {
-  position: sticky;
-  width: calc(100% - 4px);
  display: flex;
  justify-content: space-between;
-  align-items: last baseline;
+  align-items: baseline;
  font-family: "Cadman";
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
@@ -209,8 +552,8 @@ pre code {
  border-right: 2px solid black;
  border-top: 2px solid black;
 }
-.copy-code-container::before {
-  content: "code block";
+
+.code-language-identifier {
  font-style: italic;
  margin-left: 10px;
 }
@@ -384,7 +727,6 @@ button.warn.reduced, input[type=submit].warn.reduced, .linkbutton.warn.reduced {
 input[type=file]::file-selector-button {
  background-color: rgb(177, 206, 204.5);
  color: black !important;
-  margin: 10px;
 }
 input[type=file]::file-selector-button:hover {
  background-color: rgb(192.6, 215.8, 214.6);
@@ -399,6 +741,9 @@ input[type=file]::file-selector-button.reduced {
  margin: 0;
  padding: 5px;
 }
+input[type=file]::file-selector-button {
+  margin: 10px;
+}

 p {
  margin: 15px 0;
@@ -407,11 +752,6 @@ p {
 .pagebutton {
  background-color: rgb(177, 206, 204.5);
  color: black !important;
-  padding: 5px 5px;
-  margin: 0;
-  display: inline-block;
-  min-width: 20px;
-  text-align: center;
 }
 .pagebutton:hover {
  background-color: rgb(192.6, 215.8, 214.6);
@@ -426,6 +766,13 @@ p {
  margin: 0;
  padding: 5px;
 }
+.pagebutton {
+  padding: 5px 5px;
+  margin: 0;
+  display: inline-block;
+  min-width: 20px;
+  text-align: center;
+}

 .currentpage {
  border: none;
@@ -714,10 +1061,6 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus
 .tab-button {
  background-color: rgb(177, 206, 204.5);
  color: black !important;
-  border-bottom: none;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-  margin-bottom: 0;
 }
 .tab-button:hover {
  background-color: rgb(192.6, 215.8, 214.6);
@@ -732,6 +1075,12 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus
  margin: 0;
  padding: 5px;
 }
+.tab-button {
+  border-bottom: none;
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+  margin-bottom: 0;
+}
 .tab-button.active {
  background-color: #beb1ce;
  padding-top: 8px;
--- a/data/static/css/theme-otomotone.css
+++ b/data/static/css/theme-otomotone.css
@@ -194,13 +194,356 @@ pre code {
  overflow: scroll;
  tab-size: 4;
 }
+pre code .hll {
+  background-color: #6e7681;
+}
+pre code .c {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment */ }
+pre code .err {
+  color: #F85149;
+}
+pre code { /* Error */ }
+pre code .esc {
+  color: #E6EDF3;
+}
+pre code { /* Escape */ }
+pre code .g {
+  color: #E6EDF3;
+}
+pre code { /* Generic */ }
+pre code .k {
+  color: #FF7B72;
+}
+pre code { /* Keyword */ }
+pre code .l {
+  color: #A5D6FF;
+}
+pre code { /* Literal */ }
+pre code .n {
+  color: #E6EDF3;
+}
+pre code { /* Name */ }
+pre code .o {
+  color: #FF7B72;
+  font-weight: bold;
+}
+pre code { /* Operator */ }
+pre code .x {
+  color: #E6EDF3;
+}
+pre code { /* Other */ }
+pre code .p {
+  color: #E6EDF3;
+}
+pre code { /* Punctuation */ }
+pre code .ch {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Hashbang */ }
+pre code .cm {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Multiline */ }
+pre code .cp {
+  color: #8B949E;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Comment.Preproc */ }
+pre code .cpf {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.PreprocFile */ }
+pre code .c1 {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Single */ }
+pre code .cs {
+  color: #8B949E;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Comment.Special */ }
+pre code .gd {
+  color: #FFA198;
+  background-color: #490202;
+}
+pre code { /* Generic.Deleted */ }
+pre code .ge {
+  color: #E6EDF3;
+  font-style: italic;
+}
+pre code { /* Generic.Emph */ }
+pre code .ges {
+  color: #E6EDF3;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Generic.EmphStrong */ }
+pre code .gr {
+  color: #FFA198;
+}
+pre code { /* Generic.Error */ }
+pre code .gh {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Generic.Heading */ }
+pre code .gi {
+  color: #56D364;
+  background-color: #0F5323;
+}
+pre code { /* Generic.Inserted */ }
+pre code .go {
+  color: #8B949E;
+}
+pre code { /* Generic.Output */ }
+pre code .gp {
+  color: #8B949E;
+}
+pre code { /* Generic.Prompt */ }
+pre code .gs {
+  color: #E6EDF3;
+  font-weight: bold;
+}
+pre code { /* Generic.Strong */ }
+pre code .gu {
+  color: #79C0FF;
+}
+pre code { /* Generic.Subheading */ }
+pre code .gt {
+  color: #FF7B72;
+}
+pre code { /* Generic.Traceback */ }
+pre code .g-Underline {
+  color: #E6EDF3;
+  text-decoration: underline;
+}
+pre code { /* Generic.Underline */ }
+pre code .kc {
+  color: #79C0FF;
+}
+pre code { /* Keyword.Constant */ }
+pre code .kd {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Declaration */ }
+pre code .kn {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Namespace */ }
+pre code .kp {
+  color: #79C0FF;
+}
+pre code { /* Keyword.Pseudo */ }
+pre code .kr {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Reserved */ }
+pre code .kt {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Type */ }
+pre code .ld {
+  color: #79C0FF;
+}
+pre code { /* Literal.Date */ }
+pre code .m {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number */ }
+pre code .s {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String */ }
+pre code .na {
+  color: #E6EDF3;
+}
+pre code { /* Name.Attribute */ }
+pre code .nb {
+  color: #E6EDF3;
+}
+pre code { /* Name.Builtin */ }
+pre code .nc {
+  color: #F0883E;
+  font-weight: bold;
+}
+pre code { /* Name.Class */ }
+pre code .no {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Name.Constant */ }
+pre code .nd {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Decorator */ }
+pre code .ni {
+  color: #FFA657;
+}
+pre code { /* Name.Entity */ }
+pre code .ne {
+  color: #F0883E;
+  font-weight: bold;
+}
+pre code { /* Name.Exception */ }
+pre code .nf {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Function */ }
+pre code .nl {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Name.Label */ }
+pre code .nn {
+  color: #FF7B72;
+}
+pre code { /* Name.Namespace */ }
+pre code .nx {
+  color: #E6EDF3;
+}
+pre code { /* Name.Other */ }
+pre code .py {
+  color: #79C0FF;
+}
+pre code { /* Name.Property */ }
+pre code .nt {
+  color: #7EE787;
+}
+pre code { /* Name.Tag */ }
+pre code .nv {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable */ }
+pre code .ow {
+  color: #FF7B72;
+  font-weight: bold;
+}
+pre code { /* Operator.Word */ }
+pre code .pm {
+  color: #E6EDF3;
+}
+pre code { /* Punctuation.Marker */ }
+pre code .w {
+  color: #6E7681;
+}
+pre code { /* Text.Whitespace */ }
+pre code .mb {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Bin */ }
+pre code .mf {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Float */ }
+pre code .mh {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Hex */ }
+pre code .mi {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Integer */ }
+pre code .mo {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Oct */ }
+pre code .sa {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Affix */ }
+pre code .sb {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Backtick */ }
+pre code .sc {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Char */ }
+pre code .dl {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Delimiter */ }
+pre code .sd {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Doc */ }
+pre code .s2 {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Double */ }
+pre code .se {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Escape */ }
+pre code .sh {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Heredoc */ }
+pre code .si {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Interpol */ }
+pre code .sx {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Other */ }
+pre code .sr {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Regex */ }
+pre code .s1 {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Single */ }
+pre code .ss {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Symbol */ }
+pre code .bp {
+  color: #E6EDF3;
+}
+pre code { /* Name.Builtin.Pseudo */ }
+pre code .fm {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Function.Magic */ }
+pre code .vc {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Class */ }
+pre code .vg {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Global */ }
+pre code .vi {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Instance */ }
+pre code .vm {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Magic */ }
+pre code .il {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Integer.Long */ }

 .copy-code-container {
-  position: sticky;
-  width: calc(100% - 4px);
  display: flex;
  justify-content: space-between;
-  align-items: last baseline;
+  align-items: baseline;
  font-family: "Cadman";
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
@@ -209,8 +552,8 @@ pre code {
  border-right: 2px solid black;
  border-top: 2px solid black;
 }
-.copy-code-container::before {
-  content: "code block";
+
+.code-language-identifier {
  font-style: italic;
  margin-left: 10px;
 }
@@ -384,7 +727,6 @@ button.warn.reduced, input[type=submit].warn.reduced, .linkbutton.warn.reduced {
 input[type=file]::file-selector-button {
  background-color: #3c283c;
  color: #e6e6e6 !important;
-  margin: 10px;
 }
 input[type=file]::file-selector-button:hover {
  background-color: rgb(109.2, 72.8, 109.2);
@@ -399,6 +741,9 @@ input[type=file]::file-selector-button.reduced {
  margin: 0;
  padding: 5px;
 }
+input[type=file]::file-selector-button {
+  margin: 10px;
+}

 p {
  margin: 15px 0;
@@ -407,11 +752,6 @@ p {
 .pagebutton {
  background-color: #3c283c;
  color: #e6e6e6 !important;
-  padding: 5px 5px;
-  margin: 0;
-  display: inline-block;
-  min-width: 20px;
-  text-align: center;
 }
 .pagebutton:hover {
  background-color: rgb(109.2, 72.8, 109.2);
@@ -426,6 +766,13 @@ p {
  margin: 0;
  padding: 5px;
 }
+.pagebutton {
+  padding: 5px 5px;
+  margin: 0;
+  display: inline-block;
+  min-width: 20px;
+  text-align: center;
+}

 .currentpage {
  border: none;
@@ -714,10 +1061,6 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus
 .tab-button {
  background-color: #3c283c;
  color: #e6e6e6 !important;
-  border-bottom: none;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-  margin-bottom: 0;
 }
 .tab-button:hover {
  background-color: rgb(109.2, 72.8, 109.2);
@@ -732,6 +1075,12 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus
  margin: 0;
  padding: 5px;
 }
+.tab-button {
+  border-bottom: none;
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+  margin-bottom: 0;
+}
 .tab-button.active {
  background-color: #8a5584;
  padding-top: 8px;
--- a/data/static/css/theme-peachy.css
+++ b/data/static/css/theme-peachy.css
@@ -194,13 +194,356 @@ pre code {
  overflow: scroll;
  tab-size: 4;
 }
+pre code .hll {
+  background-color: #6e7681;
+}
+pre code .c {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment */ }
+pre code .err {
+  color: #F85149;
+}
+pre code { /* Error */ }
+pre code .esc {
+  color: #E6EDF3;
+}
+pre code { /* Escape */ }
+pre code .g {
+  color: #E6EDF3;
+}
+pre code { /* Generic */ }
+pre code .k {
+  color: #FF7B72;
+}
+pre code { /* Keyword */ }
+pre code .l {
+  color: #A5D6FF;
+}
+pre code { /* Literal */ }
+pre code .n {
+  color: #E6EDF3;
+}
+pre code { /* Name */ }
+pre code .o {
+  color: #FF7B72;
+  font-weight: bold;
+}
+pre code { /* Operator */ }
+pre code .x {
+  color: #E6EDF3;
+}
+pre code { /* Other */ }
+pre code .p {
+  color: #E6EDF3;
+}
+pre code { /* Punctuation */ }
+pre code .ch {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Hashbang */ }
+pre code .cm {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Multiline */ }
+pre code .cp {
+  color: #8B949E;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Comment.Preproc */ }
+pre code .cpf {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.PreprocFile */ }
+pre code .c1 {
+  color: #8B949E;
+  font-style: italic;
+}
+pre code { /* Comment.Single */ }
+pre code .cs {
+  color: #8B949E;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Comment.Special */ }
+pre code .gd {
+  color: #FFA198;
+  background-color: #490202;
+}
+pre code { /* Generic.Deleted */ }
+pre code .ge {
+  color: #E6EDF3;
+  font-style: italic;
+}
+pre code { /* Generic.Emph */ }
+pre code .ges {
+  color: #E6EDF3;
+  font-weight: bold;
+  font-style: italic;
+}
+pre code { /* Generic.EmphStrong */ }
+pre code .gr {
+  color: #FFA198;
+}
+pre code { /* Generic.Error */ }
+pre code .gh {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Generic.Heading */ }
+pre code .gi {
+  color: #56D364;
+  background-color: #0F5323;
+}
+pre code { /* Generic.Inserted */ }
+pre code .go {
+  color: #8B949E;
+}
+pre code { /* Generic.Output */ }
+pre code .gp {
+  color: #8B949E;
+}
+pre code { /* Generic.Prompt */ }
+pre code .gs {
+  color: #E6EDF3;
+  font-weight: bold;
+}
+pre code { /* Generic.Strong */ }
+pre code .gu {
+  color: #79C0FF;
+}
+pre code { /* Generic.Subheading */ }
+pre code .gt {
+  color: #FF7B72;
+}
+pre code { /* Generic.Traceback */ }
+pre code .g-Underline {
+  color: #E6EDF3;
+  text-decoration: underline;
+}
+pre code { /* Generic.Underline */ }
+pre code .kc {
+  color: #79C0FF;
+}
+pre code { /* Keyword.Constant */ }
+pre code .kd {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Declaration */ }
+pre code .kn {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Namespace */ }
+pre code .kp {
+  color: #79C0FF;
+}
+pre code { /* Keyword.Pseudo */ }
+pre code .kr {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Reserved */ }
+pre code .kt {
+  color: #FF7B72;
+}
+pre code { /* Keyword.Type */ }
+pre code .ld {
+  color: #79C0FF;
+}
+pre code { /* Literal.Date */ }
+pre code .m {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number */ }
+pre code .s {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String */ }
+pre code .na {
+  color: #E6EDF3;
+}
+pre code { /* Name.Attribute */ }
+pre code .nb {
+  color: #E6EDF3;
+}
+pre code { /* Name.Builtin */ }
+pre code .nc {
+  color: #F0883E;
+  font-weight: bold;
+}
+pre code { /* Name.Class */ }
+pre code .no {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Name.Constant */ }
+pre code .nd {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Decorator */ }
+pre code .ni {
+  color: #FFA657;
+}
+pre code { /* Name.Entity */ }
+pre code .ne {
+  color: #F0883E;
+  font-weight: bold;
+}
+pre code { /* Name.Exception */ }
+pre code .nf {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Function */ }
+pre code .nl {
+  color: #79C0FF;
+  font-weight: bold;
+}
+pre code { /* Name.Label */ }
+pre code .nn {
+  color: #FF7B72;
+}
+pre code { /* Name.Namespace */ }
+pre code .nx {
+  color: #E6EDF3;
+}
+pre code { /* Name.Other */ }
+pre code .py {
+  color: #79C0FF;
+}
+pre code { /* Name.Property */ }
+pre code .nt {
+  color: #7EE787;
+}
+pre code { /* Name.Tag */ }
+pre code .nv {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable */ }
+pre code .ow {
+  color: #FF7B72;
+  font-weight: bold;
+}
+pre code { /* Operator.Word */ }
+pre code .pm {
+  color: #E6EDF3;
+}
+pre code { /* Punctuation.Marker */ }
+pre code .w {
+  color: #6E7681;
+}
+pre code { /* Text.Whitespace */ }
+pre code .mb {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Bin */ }
+pre code .mf {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Float */ }
+pre code .mh {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Hex */ }
+pre code .mi {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Integer */ }
+pre code .mo {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Oct */ }
+pre code .sa {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Affix */ }
+pre code .sb {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Backtick */ }
+pre code .sc {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Char */ }
+pre code .dl {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Delimiter */ }
+pre code .sd {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Doc */ }
+pre code .s2 {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Double */ }
+pre code .se {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Escape */ }
+pre code .sh {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Heredoc */ }
+pre code .si {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Interpol */ }
+pre code .sx {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Other */ }
+pre code .sr {
+  color: #79C0FF;
+}
+pre code { /* Literal.String.Regex */ }
+pre code .s1 {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Single */ }
+pre code .ss {
+  color: #A5D6FF;
+}
+pre code { /* Literal.String.Symbol */ }
+pre code .bp {
+  color: #E6EDF3;
+}
+pre code { /* Name.Builtin.Pseudo */ }
+pre code .fm {
+  color: #D2A8FF;
+  font-weight: bold;
+}
+pre code { /* Name.Function.Magic */ }
+pre code .vc {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Class */ }
+pre code .vg {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Global */ }
+pre code .vi {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Instance */ }
+pre code .vm {
+  color: #79C0FF;
+}
+pre code { /* Name.Variable.Magic */ }
+pre code .il {
+  color: #A5D6FF;
+}
+pre code { /* Literal.Number.Integer.Long */ }

 .copy-code-container {
-  position: sticky;
-  width: calc(100% - 4px);
  display: flex;
  justify-content: space-between;
-  align-items: last baseline;
+  align-items: baseline;
  font-family: "Cadman";
  border-top-right-radius: 16px;
  border-top-left-radius: 16px;
@@ -209,8 +552,8 @@ pre code {
  border-right: 2px solid black;
  border-top: 2px solid black;
 }
-.copy-code-container::before {
-  content: "code block";
+
+.code-language-identifier {
  font-style: italic;
  margin-left: 6px;
 }
@@ -384,7 +727,6 @@ button.warn.reduced, input[type=submit].warn.reduced, .linkbutton.warn.reduced {
 input[type=file]::file-selector-button {
  background-color: #f27a5a;
  color: black !important;
-  margin: 6px;
 }
 input[type=file]::file-selector-button:hover {
  background-color: rgb(244.6, 148.6, 123);
@@ -399,6 +741,9 @@ input[type=file]::file-selector-button.reduced {
  margin: 0;
  padding: 6px;
 }
+input[type=file]::file-selector-button {
+  margin: 6px;
+}

 p {
  margin: 8px 0;
@@ -407,11 +752,6 @@ p {
 .pagebutton {
  background-color: #f27a5a;
  color: black !important;
-  padding: 3px 3px;
-  margin: 0;
-  display: inline-block;
-  min-width: 36px;
-  text-align: center;
 }
 .pagebutton:hover {
  background-color: rgb(244.6, 148.6, 123);
@@ -426,6 +766,13 @@ p {
  margin: 0;
  padding: 6px;
 }
+.pagebutton {
+  padding: 3px 3px;
+  margin: 0;
+  display: inline-block;
+  min-width: 36px;
+  text-align: center;
+}

 .currentpage {
  border: none;
@@ -714,10 +1061,6 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus
 .tab-button {
  background-color: #f27a5a;
  color: black !important;
-  border-bottom: none;
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-  margin-bottom: 0;
 }
 .tab-button:hover {
  background-color: rgb(244.6, 148.6, 123);
@@ -732,6 +1075,12 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus
  margin: 0;
  padding: 6px;
 }
+.tab-button {
+  border-bottom: none;
+  border-bottom-left-radius: 0;
+  border-bottom-right-radius: 0;
+  margin-bottom: 0;
+}
 .tab-button.active {
  background-color: #b54444;
  padding-top: 8px;
--- a/sass/_default.scss
+++ b/sass/_default.scss
@@ -333,17 +333,95 @@ pre code {
  padding: $BIG_PADDING;
  overflow: scroll;
  tab-size: 4;
+
+  .hll { background-color: #6e7681 }
+  .c { color: #8B949E; font-style: italic } /* Comment */
+  .err { color: #F85149 } /* Error */
+  .esc { color: #E6EDF3 } /* Escape */
+  .g { color: #E6EDF3 } /* Generic */
+  .k { color: #FF7B72 } /* Keyword */
+  .l { color: #A5D6FF } /* Literal */
+  .n { color: #E6EDF3 } /* Name */
+  .o { color: #FF7B72; font-weight: bold } /* Operator */
+  .x { color: #E6EDF3 } /* Other */
+  .p { color: #E6EDF3 } /* Punctuation */
+  .ch { color: #8B949E; font-style: italic } /* Comment.Hashbang */
+  .cm { color: #8B949E; font-style: italic } /* Comment.Multiline */
+  .cp { color: #8B949E; font-weight: bold; font-style: italic } /* Comment.Preproc */
+  .cpf { color: #8B949E; font-style: italic } /* Comment.PreprocFile */
+  .c1 { color: #8B949E; font-style: italic } /* Comment.Single */
+  .cs { color: #8B949E; font-weight: bold; font-style: italic } /* Comment.Special */
+  .gd { color: #FFA198; background-color: #490202 } /* Generic.Deleted */
+  .ge { color: #E6EDF3; font-style: italic } /* Generic.Emph */
+  .ges { color: #E6EDF3; font-weight: bold; font-style: italic } /* Generic.EmphStrong */
+  .gr { color: #FFA198 } /* Generic.Error */
+  .gh { color: #79C0FF; font-weight: bold } /* Generic.Heading */
+  .gi { color: #56D364; background-color: #0F5323 } /* Generic.Inserted */
+  .go { color: #8B949E } /* Generic.Output */
+  .gp { color: #8B949E } /* Generic.Prompt */
+  .gs { color: #E6EDF3; font-weight: bold } /* Generic.Strong */
+  .gu { color: #79C0FF } /* Generic.Subheading */
+  .gt { color: #FF7B72 } /* Generic.Traceback */
+  .g-Underline { color: #E6EDF3; text-decoration: underline } /* Generic.Underline */
+  .kc { color: #79C0FF } /* Keyword.Constant */
+  .kd { color: #FF7B72 } /* Keyword.Declaration */
+  .kn { color: #FF7B72 } /* Keyword.Namespace */
+  .kp { color: #79C0FF } /* Keyword.Pseudo */
+  .kr { color: #FF7B72 } /* Keyword.Reserved */
+  .kt { color: #FF7B72 } /* Keyword.Type */
+  .ld { color: #79C0FF } /* Literal.Date */
+  .m { color: #A5D6FF } /* Literal.Number */
+  .s { color: #A5D6FF } /* Literal.String */
+  .na { color: #E6EDF3 } /* Name.Attribute */
+  .nb { color: #E6EDF3 } /* Name.Builtin */
+  .nc { color: #F0883E; font-weight: bold } /* Name.Class */
+  .no { color: #79C0FF; font-weight: bold } /* Name.Constant */
+  .nd { color: #D2A8FF; font-weight: bold } /* Name.Decorator */
+  .ni { color: #FFA657 } /* Name.Entity */
+  .ne { color: #F0883E; font-weight: bold } /* Name.Exception */
+  .nf { color: #D2A8FF; font-weight: bold } /* Name.Function */
+  .nl { color: #79C0FF; font-weight: bold } /* Name.Label */
+  .nn { color: #FF7B72 } /* Name.Namespace */
+  .nx { color: #E6EDF3 } /* Name.Other */
+  .py { color: #79C0FF } /* Name.Property */
+  .nt { color: #7EE787 } /* Name.Tag */
+  .nv { color: #79C0FF } /* Name.Variable */
+  .ow { color: #FF7B72; font-weight: bold } /* Operator.Word */
+  .pm { color: #E6EDF3 } /* Punctuation.Marker */
+  .w { color: #6E7681 } /* Text.Whitespace */
+  .mb { color: #A5D6FF } /* Literal.Number.Bin */
+  .mf { color: #A5D6FF } /* Literal.Number.Float */
+  .mh { color: #A5D6FF } /* Literal.Number.Hex */
+  .mi { color: #A5D6FF } /* Literal.Number.Integer */
+  .mo { color: #A5D6FF } /* Literal.Number.Oct */
+  .sa { color: #79C0FF } /* Literal.String.Affix */
+  .sb { color: #A5D6FF } /* Literal.String.Backtick */
+  .sc { color: #A5D6FF } /* Literal.String.Char */
+  .dl { color: #79C0FF } /* Literal.String.Delimiter */
+  .sd { color: #A5D6FF } /* Literal.String.Doc */
+  .s2 { color: #A5D6FF } /* Literal.String.Double */
+  .se { color: #79C0FF } /* Literal.String.Escape */
+  .sh { color: #79C0FF } /* Literal.String.Heredoc */
+  .si { color: #A5D6FF } /* Literal.String.Interpol */
+  .sx { color: #A5D6FF } /* Literal.String.Other */
+  .sr { color: #79C0FF } /* Literal.String.Regex */
+  .s1 { color: #A5D6FF } /* Literal.String.Single */
+  .ss { color: #A5D6FF } /* Literal.String.Symbol */
+  .bp { color: #E6EDF3 } /* Name.Builtin.Pseudo */
+  .fm { color: #D2A8FF; font-weight: bold } /* Name.Function.Magic */
+  .vc { color: #79C0FF } /* Name.Variable.Class */
+  .vg { color: #79C0FF } /* Name.Variable.Global */
+  .vi { color: #79C0FF } /* Name.Variable.Instance */
+  .vm { color: #79C0FF } /* Name.Variable.Magic */
+  .il { color: #A5D6FF } /* Literal.Number.Integer.Long */
 }

 $copy_code_header_background: $ACCENT_COLOR !default;
 $copy_code_border: 2px solid black !default;
 .copy-code-container {
-  position: sticky;
-  // width: 100%;
-  width: calc(100% - 4px);
  display: flex;
  justify-content: space-between;
-  align-items: last baseline;
+  align-items: baseline;
  font-family: "Cadman";
  border-top-right-radius: $code_border_radius;
  border-top-left-radius: $code_border_radius;
@@ -351,13 +429,12 @@ $copy_code_border: 2px solid black !default;
  border-left: $copy_code_border;
  border-right: $copy_code_border;
  border-top: $copy_code_border;
+}

-  &::before {
-    content: "code block";
+.code-language-identifier {
  font-style: italic;
  margin-left: $MEDIUM_PADDING;
 }
-}

 .copy-code {
  margin-right: $MEDIUM_PADDING;
--- a/uwsgi.ini
+++ b/uwsgi.ini
@@ -8,7 +8,7 @@ chmod-socket = 666
 plugins = python3

 virtualenv = /opt/venv
-pythonpath = /opt/venv/lib/python3.11/site-packages
+pythonpath = /opt/venv/lib/python3.13/site-packages

 uid = www-data
 gid = www-data
Author	SHA1	Message	Date
Lera Elvoé	661d1ee1b1	add code highlighting	2025-10-12 23:47:14 +03:00
Lera Elvoé	98188c1c69	set correct path in uwsgi	2025-10-12 22:07:12 +03:00
Lera Elvoé	64cfbbc057	bump babycode version	2025-08-17 21:11:19 +03:00