diff --git a/app/static/css/pygments.css b/app/static/css/pygments-default.css similarity index 99% rename from app/static/css/pygments.css rename to app/static/css/pygments-default.css index 4531226..fe93c6e 100644 --- a/app/static/css/pygments.css +++ b/app/static/css/pygments-default.css @@ -1,6 +1,5 @@ pre { line-height: 125%; } td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; } -td.linenos { padding: 0 5px; } span.linenos { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 5px; } td.linenos .special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; } span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: 5px; padding-right: 5px; } diff --git a/app/static/css/pygments-material.css b/app/static/css/pygments-material.css new file mode 100644 index 0000000..f9a62a3 --- /dev/null +++ b/app/static/css/pygments-material.css @@ -0,0 +1,82 @@ +pre { line-height: 125%; } +td.linenos .normal { color: #37474F; background-color: #263238; padding-left: 5px; padding-right: 5px; } +span.linenos { color: #37474F; background-color: #263238; padding-left: 5px; padding-right: 5px; } +td.linenos .special { color: #607A86; background-color: #263238; padding-left: 5px; padding-right: 5px; } +span.linenos.special { color: #607A86; background-color: #263238; padding-left: 5px; padding-right: 5px; } +.codehilite .hll { background-color: #2C3B41 } +.codehilite { background: #263238; color: #EEFFFF } +.codehilite .c { color: #546E7A; font-style: italic } /* Comment */ +.codehilite .err { color: #FF5370 } /* Error */ +.codehilite .esc { color: #89DDFF } /* Escape */ +.codehilite .g { color: #EEFFFF } /* Generic */ +.codehilite .k { color: #BB80B3 } /* Keyword */ +.codehilite .l { color: #C3E88D } /* Literal */ +.codehilite .n { color: #EEFFFF } /* Name */ +.codehilite .o { color: #89DDFF } /* Operator */ +.codehilite .p { color: #89DDFF } /* Punctuation */ +.codehilite .ch { color: #546E7A; font-style: italic } /* Comment.Hashbang */ +.codehilite .cm { color: #546E7A; font-style: italic } /* Comment.Multiline */ +.codehilite .cp { color: #546E7A; font-style: italic } /* Comment.Preproc */ +.codehilite .cpf { color: #546E7A; font-style: italic } /* Comment.PreprocFile */ +.codehilite .c1 { color: #546E7A; font-style: italic } /* Comment.Single */ +.codehilite .cs { color: #546E7A; font-style: italic } /* Comment.Special */ +.codehilite .gd { color: #FF5370 } /* Generic.Deleted */ +.codehilite .ge { color: #89DDFF } /* Generic.Emph */ +.codehilite .gr { color: #FF5370 } /* Generic.Error */ +.codehilite .gh { color: #C3E88D } /* Generic.Heading */ +.codehilite .gi { color: #C3E88D } /* Generic.Inserted */ +.codehilite .go { color: #546E7A } /* Generic.Output */ +.codehilite .gp { color: #FFCB6B } /* Generic.Prompt */ +.codehilite .gs { color: #FF5370 } /* Generic.Strong */ +.codehilite .gu { color: #89DDFF } /* Generic.Subheading */ +.codehilite .gt { color: #FF5370 } /* Generic.Traceback */ +.codehilite .kc { color: #89DDFF } /* Keyword.Constant */ +.codehilite .kd { color: #BB80B3 } /* Keyword.Declaration */ +.codehilite .kn { color: #89DDFF; font-style: italic } /* Keyword.Namespace */ +.codehilite .kp { color: #89DDFF } /* Keyword.Pseudo */ +.codehilite .kr { color: #BB80B3 } /* Keyword.Reserved */ +.codehilite .kt { color: #BB80B3 } /* Keyword.Type */ +.codehilite .ld { color: #C3E88D } /* Literal.Date */ +.codehilite .m { color: #F78C6C } /* Literal.Number */ +.codehilite .s { color: #C3E88D } /* Literal.String */ +.codehilite .na { color: #BB80B3 } /* Name.Attribute */ +.codehilite .nb { color: #82AAFF } /* Name.Builtin */ +.codehilite .nc { color: #FFCB6B } /* Name.Class */ +.codehilite .no { color: #EEFFFF } /* Name.Constant */ +.codehilite .nd { color: #82AAFF } /* Name.Decorator */ +.codehilite .ni { color: #89DDFF } /* Name.Entity */ +.codehilite .ne { color: #FFCB6B } /* Name.Exception */ +.codehilite .nf { color: #82AAFF } /* Name.Function */ +.codehilite .nl { color: #82AAFF } /* Name.Label */ +.codehilite .nn { color: #FFCB6B } /* Name.Namespace */ +.codehilite .nx { color: #EEFFFF } /* Name.Other */ +.codehilite .py { color: #FFCB6B } /* Name.Property */ +.codehilite .nt { color: #FF5370 } /* Name.Tag */ +.codehilite .nv { color: #89DDFF } /* Name.Variable */ +.codehilite .ow { color: #89DDFF; font-style: italic } /* Operator.Word */ +.codehilite .w { color: #EEFFFF } /* Text.Whitespace */ +.codehilite .mb { color: #F78C6C } /* Literal.Number.Bin */ +.codehilite .mf { color: #F78C6C } /* Literal.Number.Float */ +.codehilite .mh { color: #F78C6C } /* Literal.Number.Hex */ +.codehilite .mi { color: #F78C6C } /* Literal.Number.Integer */ +.codehilite .mo { color: #F78C6C } /* Literal.Number.Oct */ +.codehilite .sa { color: #BB80B3 } /* Literal.String.Affix */ +.codehilite .sb { color: #C3E88D } /* Literal.String.Backtick */ +.codehilite .sc { color: #C3E88D } /* Literal.String.Char */ +.codehilite .dl { color: #EEFFFF } /* Literal.String.Delimiter */ +.codehilite .sd { color: #546E7A; font-style: italic } /* Literal.String.Doc */ +.codehilite .s2 { color: #C3E88D } /* Literal.String.Double */ +.codehilite .se { color: #EEFFFF } /* Literal.String.Escape */ +.codehilite .sh { color: #C3E88D } /* Literal.String.Heredoc */ +.codehilite .si { color: #89DDFF } /* Literal.String.Interpol */ +.codehilite .sx { color: #C3E88D } /* Literal.String.Other */ +.codehilite .sr { color: #89DDFF } /* Literal.String.Regex */ +.codehilite .s1 { color: #C3E88D } /* Literal.String.Single */ +.codehilite .ss { color: #89DDFF } /* Literal.String.Symbol */ +.codehilite .bp { color: #89DDFF } /* Name.Builtin.Pseudo */ +.codehilite .fm { color: #82AAFF } /* Name.Function.Magic */ +.codehilite .vc { color: #89DDFF } /* Name.Variable.Class */ +.codehilite .vg { color: #89DDFF } /* Name.Variable.Global */ +.codehilite .vi { color: #89DDFF } /* Name.Variable.Instance */ +.codehilite .vm { color: #82AAFF } /* Name.Variable.Magic */ +.codehilite .il { color: #F78C6C } /* Literal.Number.Integer.Long */ diff --git a/app/static/css/table.css b/app/static/css/table.css index 931c9a0..e570976 100644 --- a/app/static/css/table.css +++ b/app/static/css/table.css @@ -17,10 +17,29 @@ table th { border-width: 1px 0; padding: 2px 6px; } -table td { +table:not(.codehilitetable) td { padding: 4px 6px; } +/* Code fragments */ + +table.codehilitetable { + background: var(--background); + border: none; + width: 100%; +} +table.codehilitetable tr { + background: unset; +} +table.codehilitetable td { + padding: 0; +} +table.codehilitetable td.code, +table.codehilitetable pre { + margin: 0; + width: 100%; +} + /* Forum and sub-forum listings */ table.forumlist { diff --git a/app/static/css/themes/FK_dark_theme.css b/app/static/css/themes/FK_dark_theme.css index f81b669..de4393d 100644 --- a/app/static/css/themes/FK_dark_theme.css +++ b/app/static/css/themes/FK_dark_theme.css @@ -117,6 +117,9 @@ table tr:nth-child(even) { table tr:nth-child(odd) { --background: #1d2326; } +table.codehilitetable { + --background: #263238; +} div.editor-toolbar, div.CodeMirror { --border: #404040; diff --git a/app/utils/render.py b/app/utils/render.py index 4e0f16d..a8d0994 100644 --- a/app/utils/render.py +++ b/app/utils/render.py @@ -19,7 +19,6 @@ def render(*args, styles=[], scripts=[], **kwargs): 'css/responsive.css', 'css/simplemde.min.css', 'css/simplemde-override.css', - 'css/pygments.css', ] scripts_ = [ 'scripts/trigger_menu.js', @@ -34,6 +33,14 @@ def render(*args, styles=[], scripts=[], **kwargs): theme = theme if theme else 'default_theme' styles_ = [f'css/themes/{theme}.css'] + styles_ + # Corresponding Pygments styles (might want to abstract later) + code = { + 'default_theme': 'default', + 'FK_dark_theme': 'material', + } + code = code.get(theme, 'default') + styles_.append(f'css/pygments-{code}.css') + for s in styles: if s[0] == '-': styles_.remove(s[1:])