From f774259f2c775d211c667ac3ffae6cd4832449ac Mon Sep 17 00:00:00 2001 From: Shreya Date: Tue, 25 Oct 2022 23:46:27 +0530 Subject: [PATCH 1/6] Add command to auto-generate CSS files from pygmets styles specified in settings --- codethesaurus/settings.py | 2 + web/management/commands/generate_css_files.py | 43 +++++++++++ web/static/css/pygments_colorful.css | 3 +- web/static/css/pygments_default.css | 73 +++++++++++++++++++ web/static/css/pygments_rrt.css | 42 +++++++++++ web/static/css/pygments_sas.css | 64 ++++++++++++++++ web/static/css/pygments_xcode.css | 67 +++++++++++++++++ 7 files changed, 292 insertions(+), 2 deletions(-) create mode 100644 web/management/commands/generate_css_files.py create mode 100644 web/static/css/pygments_default.css create mode 100644 web/static/css/pygments_rrt.css create mode 100644 web/static/css/pygments_sas.css create mode 100644 web/static/css/pygments_xcode.css diff --git a/codethesaurus/settings.py b/codethesaurus/settings.py index ab498e543..3799b8454 100644 --- a/codethesaurus/settings.py +++ b/codethesaurus/settings.py @@ -149,3 +149,5 @@ # Configure Django App for Heroku. django_on_heroku.settings(locals(), test_runner=False, databases=False, staticfiles=True, logging=True) + +PYGMENTS_STYLES = ['colorful', 'default', 'sas', 'xcode', 'rrt'] diff --git a/web/management/commands/generate_css_files.py b/web/management/commands/generate_css_files.py new file mode 100644 index 000000000..2a12036d3 --- /dev/null +++ b/web/management/commands/generate_css_files.py @@ -0,0 +1,43 @@ +import os +from django.core.management.base import BaseCommand +from django.conf import settings + +from pygments.formatters.html import HtmlFormatter + +class Command(BaseCommand): + help = 'Generate static CSS files from pygments styles' + + def handle(self, *args, **options): + for style in settings.PYGMENTS_STYLES: + self.generate_file(style) + + def generate_file(self, style): + css = HtmlFormatter.get_style_defs(HtmlFormatter(style=style)) + + # we need to prepend the `syntax` class before every class selector in the stylesheet to make sure that the styles get applied + # only to our code snippet and not any other DOM element that happens to have the same class name. + modified_css = [] + for line in css.split("\n"): + if line[0] == '.': + line = '.syntax ' + line + modified_css.append(line) + + language_dir_path = os.path.join( + 'web', + 'static', + 'css' + ) + + css_file_path = os.path.join( + language_dir_path, + f'pygments_{style}.css' + ) + + # remove existing stylesheet so that it can be replaced with newer style versions or fixes + if os.path.exists(css_file_path): + self.stdout.write(f'Removing stylesheet: {css_file_path} for style: {style}') + os.remove(css_file_path) + + with open(css_file_path, 'w') as file: + file.write('\n'.join(modified_css)) + self.stdout.write(f'Created css stylesheet: {css_file_path}') \ No newline at end of file diff --git a/web/static/css/pygments_colorful.css b/web/static/css/pygments_colorful.css index 0dc8471eb..9eb1dcd86 100644 --- a/web/static/css/pygments_colorful.css +++ b/web/static/css/pygments_colorful.css @@ -4,7 +4,6 @@ span.linenos { color: inherit; background-color: transparent; padding-left: 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; } .syntax .hll { background-color: #ffffcc } -.syntax { background: #ffffff; } .syntax .c { color: #888888 } /* Comment */ .syntax .err { color: #FF0000; background-color: #FFAAAA } /* Error */ .syntax .k { color: #008800; font-weight: bold } /* Keyword */ @@ -71,4 +70,4 @@ span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: .syntax .vg { color: #dd7700; font-weight: bold } /* Name.Variable.Global */ .syntax .vi { color: #3333BB } /* Name.Variable.Instance */ .syntax .vm { color: #996633 } /* Name.Variable.Magic */ -.syntax .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */ +.syntax .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */ \ No newline at end of file diff --git a/web/static/css/pygments_default.css b/web/static/css/pygments_default.css new file mode 100644 index 000000000..d5368fc21 --- /dev/null +++ b/web/static/css/pygments_default.css @@ -0,0 +1,73 @@ +pre { line-height: 125%; } +td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 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; } +.syntax .hll { background-color: #ffffcc } +.syntax .c { color: #408080; font-style: italic } /* Comment */ +.syntax .err { border: 1px solid #FF0000 } /* Error */ +.syntax .k { color: #008000; font-weight: bold } /* Keyword */ +.syntax .o { color: #666666 } /* Operator */ +.syntax .ch { color: #408080; font-style: italic } /* Comment.Hashbang */ +.syntax .cm { color: #408080; font-style: italic } /* Comment.Multiline */ +.syntax .cp { color: #BC7A00 } /* Comment.Preproc */ +.syntax .cpf { color: #408080; font-style: italic } /* Comment.PreprocFile */ +.syntax .c1 { color: #408080; font-style: italic } /* Comment.Single */ +.syntax .cs { color: #408080; font-style: italic } /* Comment.Special */ +.syntax .gd { color: #A00000 } /* Generic.Deleted */ +.syntax .ge { font-style: italic } /* Generic.Emph */ +.syntax .gr { color: #FF0000 } /* Generic.Error */ +.syntax .gh { color: #000080; font-weight: bold } /* Generic.Heading */ +.syntax .gi { color: #00A000 } /* Generic.Inserted */ +.syntax .go { color: #888888 } /* Generic.Output */ +.syntax .gp { color: #000080; font-weight: bold } /* Generic.Prompt */ +.syntax .gs { font-weight: bold } /* Generic.Strong */ +.syntax .gu { color: #800080; font-weight: bold } /* Generic.Subheading */ +.syntax .gt { color: #0044DD } /* Generic.Traceback */ +.syntax .kc { color: #008000; font-weight: bold } /* Keyword.Constant */ +.syntax .kd { color: #008000; font-weight: bold } /* Keyword.Declaration */ +.syntax .kn { color: #008000; font-weight: bold } /* Keyword.Namespace */ +.syntax .kp { color: #008000 } /* Keyword.Pseudo */ +.syntax .kr { color: #008000; font-weight: bold } /* Keyword.Reserved */ +.syntax .kt { color: #B00040 } /* Keyword.Type */ +.syntax .m { color: #666666 } /* Literal.Number */ +.syntax .s { color: #BA2121 } /* Literal.String */ +.syntax .na { color: #7D9029 } /* Name.Attribute */ +.syntax .nb { color: #008000 } /* Name.Builtin */ +.syntax .nc { color: #0000FF; font-weight: bold } /* Name.Class */ +.syntax .no { color: #880000 } /* Name.Constant */ +.syntax .nd { color: #AA22FF } /* Name.Decorator */ +.syntax .ni { color: #999999; font-weight: bold } /* Name.Entity */ +.syntax .ne { color: #D2413A; font-weight: bold } /* Name.Exception */ +.syntax .nf { color: #0000FF } /* Name.Function */ +.syntax .nl { color: #A0A000 } /* Name.Label */ +.syntax .nn { color: #0000FF; font-weight: bold } /* Name.Namespace */ +.syntax .nt { color: #008000; font-weight: bold } /* Name.Tag */ +.syntax .nv { color: #19177C } /* Name.Variable */ +.syntax .ow { color: #AA22FF; font-weight: bold } /* Operator.Word */ +.syntax .w { color: #bbbbbb } /* Text.Whitespace */ +.syntax .mb { color: #666666 } /* Literal.Number.Bin */ +.syntax .mf { color: #666666 } /* Literal.Number.Float */ +.syntax .mh { color: #666666 } /* Literal.Number.Hex */ +.syntax .mi { color: #666666 } /* Literal.Number.Integer */ +.syntax .mo { color: #666666 } /* Literal.Number.Oct */ +.syntax .sa { color: #BA2121 } /* Literal.String.Affix */ +.syntax .sb { color: #BA2121 } /* Literal.String.Backtick */ +.syntax .sc { color: #BA2121 } /* Literal.String.Char */ +.syntax .dl { color: #BA2121 } /* Literal.String.Delimiter */ +.syntax .sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */ +.syntax .s2 { color: #BA2121 } /* Literal.String.Double */ +.syntax .se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */ +.syntax .sh { color: #BA2121 } /* Literal.String.Heredoc */ +.syntax .si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */ +.syntax .sx { color: #008000 } /* Literal.String.Other */ +.syntax .sr { color: #BB6688 } /* Literal.String.Regex */ +.syntax .s1 { color: #BA2121 } /* Literal.String.Single */ +.syntax .ss { color: #19177C } /* Literal.String.Symbol */ +.syntax .bp { color: #008000 } /* Name.Builtin.Pseudo */ +.syntax .fm { color: #0000FF } /* Name.Function.Magic */ +.syntax .vc { color: #19177C } /* Name.Variable.Class */ +.syntax .vg { color: #19177C } /* Name.Variable.Global */ +.syntax .vi { color: #19177C } /* Name.Variable.Instance */ +.syntax .vm { color: #19177C } /* Name.Variable.Magic */ +.syntax .il { color: #666666 } /* Literal.Number.Integer.Long */ \ No newline at end of file diff --git a/web/static/css/pygments_rrt.css b/web/static/css/pygments_rrt.css new file mode 100644 index 000000000..4f47a3ff8 --- /dev/null +++ b/web/static/css/pygments_rrt.css @@ -0,0 +1,42 @@ +pre { line-height: 125%; } +td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 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; } +.syntax .hll { background-color: #0000ff } +.syntax .c { color: #00ff00 } /* Comment */ +.syntax .k { color: #ff0000 } /* Keyword */ +.syntax .ch { color: #00ff00 } /* Comment.Hashbang */ +.syntax .cm { color: #00ff00 } /* Comment.Multiline */ +.syntax .cp { color: #e5e5e5 } /* Comment.Preproc */ +.syntax .cpf { color: #00ff00 } /* Comment.PreprocFile */ +.syntax .c1 { color: #00ff00 } /* Comment.Single */ +.syntax .cs { color: #00ff00 } /* Comment.Special */ +.syntax .kc { color: #ff0000 } /* Keyword.Constant */ +.syntax .kd { color: #ff0000 } /* Keyword.Declaration */ +.syntax .kn { color: #ff0000 } /* Keyword.Namespace */ +.syntax .kp { color: #ff0000 } /* Keyword.Pseudo */ +.syntax .kr { color: #ff0000 } /* Keyword.Reserved */ +.syntax .kt { color: #ee82ee } /* Keyword.Type */ +.syntax .s { color: #87ceeb } /* Literal.String */ +.syntax .no { color: #7fffd4 } /* Name.Constant */ +.syntax .nf { color: #ffff00 } /* Name.Function */ +.syntax .nv { color: #eedd82 } /* Name.Variable */ +.syntax .sa { color: #87ceeb } /* Literal.String.Affix */ +.syntax .sb { color: #87ceeb } /* Literal.String.Backtick */ +.syntax .sc { color: #87ceeb } /* Literal.String.Char */ +.syntax .dl { color: #87ceeb } /* Literal.String.Delimiter */ +.syntax .sd { color: #87ceeb } /* Literal.String.Doc */ +.syntax .s2 { color: #87ceeb } /* Literal.String.Double */ +.syntax .se { color: #87ceeb } /* Literal.String.Escape */ +.syntax .sh { color: #87ceeb } /* Literal.String.Heredoc */ +.syntax .si { color: #87ceeb } /* Literal.String.Interpol */ +.syntax .sx { color: #87ceeb } /* Literal.String.Other */ +.syntax .sr { color: #87ceeb } /* Literal.String.Regex */ +.syntax .s1 { color: #87ceeb } /* Literal.String.Single */ +.syntax .ss { color: #87ceeb } /* Literal.String.Symbol */ +.syntax .fm { color: #ffff00 } /* Name.Function.Magic */ +.syntax .vc { color: #eedd82 } /* Name.Variable.Class */ +.syntax .vg { color: #eedd82 } /* Name.Variable.Global */ +.syntax .vi { color: #eedd82 } /* Name.Variable.Instance */ +.syntax .vm { color: #eedd82 } /* Name.Variable.Magic */ \ No newline at end of file diff --git a/web/static/css/pygments_sas.css b/web/static/css/pygments_sas.css new file mode 100644 index 000000000..fd7b1418e --- /dev/null +++ b/web/static/css/pygments_sas.css @@ -0,0 +1,64 @@ +pre { line-height: 125%; } +td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 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; } +.syntax .hll { background-color: #ffffcc } +.syntax .c { color: #008800; font-style: italic } /* Comment */ +.syntax .err { color: #a61717; background-color: #e3d2d2 } /* Error */ +.syntax .g { color: #2c2cff } /* Generic */ +.syntax .k { color: #2c2cff } /* Keyword */ +.syntax .x { background-color: #ffffe0 } /* Other */ +.syntax .ch { color: #008800; font-style: italic } /* Comment.Hashbang */ +.syntax .cm { color: #008800; font-style: italic } /* Comment.Multiline */ +.syntax .cp { color: #008800; font-style: italic } /* Comment.Preproc */ +.syntax .cpf { color: #008800; font-style: italic } /* Comment.PreprocFile */ +.syntax .c1 { color: #008800; font-style: italic } /* Comment.Single */ +.syntax .cs { color: #008800; font-style: italic } /* Comment.Special */ +.syntax .gd { color: #2c2cff } /* Generic.Deleted */ +.syntax .ge { color: #008800 } /* Generic.Emph */ +.syntax .gr { color: #d30202 } /* Generic.Error */ +.syntax .gh { color: #2c2cff } /* Generic.Heading */ +.syntax .gi { color: #2c2cff } /* Generic.Inserted */ +.syntax .go { color: #2c2cff } /* Generic.Output */ +.syntax .gp { color: #2c2cff } /* Generic.Prompt */ +.syntax .gs { color: #2c2cff } /* Generic.Strong */ +.syntax .gu { color: #2c2cff } /* Generic.Subheading */ +.syntax .gt { color: #2c2cff } /* Generic.Traceback */ +.syntax .kc { color: #2c2cff; font-weight: bold } /* Keyword.Constant */ +.syntax .kd { color: #2c2cff } /* Keyword.Declaration */ +.syntax .kn { color: #2c2cff } /* Keyword.Namespace */ +.syntax .kp { color: #2c2cff } /* Keyword.Pseudo */ +.syntax .kr { color: #353580; font-weight: bold } /* Keyword.Reserved */ +.syntax .kt { color: #2c2cff } /* Keyword.Type */ +.syntax .m { color: #2e8b57; font-weight: bold } /* Literal.Number */ +.syntax .s { color: #800080 } /* Literal.String */ +.syntax .nb { color: #2c2cff } /* Name.Builtin */ +.syntax .nf { font-weight: bold; font-style: italic } /* Name.Function */ +.syntax .nv { color: #2c2cff; font-weight: bold } /* Name.Variable */ +.syntax .w { color: #bbbbbb } /* Text.Whitespace */ +.syntax .mb { color: #2e8b57; font-weight: bold } /* Literal.Number.Bin */ +.syntax .mf { color: #2e8b57; font-weight: bold } /* Literal.Number.Float */ +.syntax .mh { color: #2e8b57; font-weight: bold } /* Literal.Number.Hex */ +.syntax .mi { color: #2e8b57; font-weight: bold } /* Literal.Number.Integer */ +.syntax .mo { color: #2e8b57; font-weight: bold } /* Literal.Number.Oct */ +.syntax .sa { color: #800080 } /* Literal.String.Affix */ +.syntax .sb { color: #800080 } /* Literal.String.Backtick */ +.syntax .sc { color: #800080 } /* Literal.String.Char */ +.syntax .dl { color: #800080 } /* Literal.String.Delimiter */ +.syntax .sd { color: #800080 } /* Literal.String.Doc */ +.syntax .s2 { color: #800080 } /* Literal.String.Double */ +.syntax .se { color: #800080 } /* Literal.String.Escape */ +.syntax .sh { color: #800080 } /* Literal.String.Heredoc */ +.syntax .si { color: #800080 } /* Literal.String.Interpol */ +.syntax .sx { color: #800080 } /* Literal.String.Other */ +.syntax .sr { color: #800080 } /* Literal.String.Regex */ +.syntax .s1 { color: #800080 } /* Literal.String.Single */ +.syntax .ss { color: #800080 } /* Literal.String.Symbol */ +.syntax .bp { color: #2c2cff } /* Name.Builtin.Pseudo */ +.syntax .fm { font-weight: bold; font-style: italic } /* Name.Function.Magic */ +.syntax .vc { color: #2c2cff; font-weight: bold } /* Name.Variable.Class */ +.syntax .vg { color: #2c2cff; font-weight: bold } /* Name.Variable.Global */ +.syntax .vi { color: #2c2cff; font-weight: bold } /* Name.Variable.Instance */ +.syntax .vm { color: #2c2cff; font-weight: bold } /* Name.Variable.Magic */ +.syntax .il { color: #2e8b57; font-weight: bold } /* Literal.Number.Integer.Long */ \ No newline at end of file diff --git a/web/static/css/pygments_xcode.css b/web/static/css/pygments_xcode.css new file mode 100644 index 000000000..cd6c05933 --- /dev/null +++ b/web/static/css/pygments_xcode.css @@ -0,0 +1,67 @@ +pre { line-height: 125%; } +td.linenos .normal { color: inherit; background-color: transparent; padding-left: 5px; padding-right: 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; } +.syntax .hll { background-color: #ffffcc } +.syntax .c { color: #177500 } /* Comment */ +.syntax .err { color: #000000 } /* Error */ +.syntax .k { color: #A90D91 } /* Keyword */ +.syntax .l { color: #1C01CE } /* Literal */ +.syntax .n { color: #000000 } /* Name */ +.syntax .o { color: #000000 } /* Operator */ +.syntax .ch { color: #177500 } /* Comment.Hashbang */ +.syntax .cm { color: #177500 } /* Comment.Multiline */ +.syntax .cp { color: #633820 } /* Comment.Preproc */ +.syntax .cpf { color: #177500 } /* Comment.PreprocFile */ +.syntax .c1 { color: #177500 } /* Comment.Single */ +.syntax .cs { color: #177500 } /* Comment.Special */ +.syntax .kc { color: #A90D91 } /* Keyword.Constant */ +.syntax .kd { color: #A90D91 } /* Keyword.Declaration */ +.syntax .kn { color: #A90D91 } /* Keyword.Namespace */ +.syntax .kp { color: #A90D91 } /* Keyword.Pseudo */ +.syntax .kr { color: #A90D91 } /* Keyword.Reserved */ +.syntax .kt { color: #A90D91 } /* Keyword.Type */ +.syntax .ld { color: #1C01CE } /* Literal.Date */ +.syntax .m { color: #1C01CE } /* Literal.Number */ +.syntax .s { color: #C41A16 } /* Literal.String */ +.syntax .na { color: #836C28 } /* Name.Attribute */ +.syntax .nb { color: #A90D91 } /* Name.Builtin */ +.syntax .nc { color: #3F6E75 } /* Name.Class */ +.syntax .no { color: #000000 } /* Name.Constant */ +.syntax .nd { color: #000000 } /* Name.Decorator */ +.syntax .ni { color: #000000 } /* Name.Entity */ +.syntax .ne { color: #000000 } /* Name.Exception */ +.syntax .nf { color: #000000 } /* Name.Function */ +.syntax .nl { color: #000000 } /* Name.Label */ +.syntax .nn { color: #000000 } /* Name.Namespace */ +.syntax .nx { color: #000000 } /* Name.Other */ +.syntax .py { color: #000000 } /* Name.Property */ +.syntax .nt { color: #000000 } /* Name.Tag */ +.syntax .nv { color: #000000 } /* Name.Variable */ +.syntax .ow { color: #000000 } /* Operator.Word */ +.syntax .mb { color: #1C01CE } /* Literal.Number.Bin */ +.syntax .mf { color: #1C01CE } /* Literal.Number.Float */ +.syntax .mh { color: #1C01CE } /* Literal.Number.Hex */ +.syntax .mi { color: #1C01CE } /* Literal.Number.Integer */ +.syntax .mo { color: #1C01CE } /* Literal.Number.Oct */ +.syntax .sa { color: #C41A16 } /* Literal.String.Affix */ +.syntax .sb { color: #C41A16 } /* Literal.String.Backtick */ +.syntax .sc { color: #2300CE } /* Literal.String.Char */ +.syntax .dl { color: #C41A16 } /* Literal.String.Delimiter */ +.syntax .sd { color: #C41A16 } /* Literal.String.Doc */ +.syntax .s2 { color: #C41A16 } /* Literal.String.Double */ +.syntax .se { color: #C41A16 } /* Literal.String.Escape */ +.syntax .sh { color: #C41A16 } /* Literal.String.Heredoc */ +.syntax .si { color: #C41A16 } /* Literal.String.Interpol */ +.syntax .sx { color: #C41A16 } /* Literal.String.Other */ +.syntax .sr { color: #C41A16 } /* Literal.String.Regex */ +.syntax .s1 { color: #C41A16 } /* Literal.String.Single */ +.syntax .ss { color: #C41A16 } /* Literal.String.Symbol */ +.syntax .bp { color: #5B269A } /* Name.Builtin.Pseudo */ +.syntax .fm { color: #000000 } /* Name.Function.Magic */ +.syntax .vc { color: #000000 } /* Name.Variable.Class */ +.syntax .vg { color: #000000 } /* Name.Variable.Global */ +.syntax .vi { color: #000000 } /* Name.Variable.Instance */ +.syntax .vm { color: #000000 } /* Name.Variable.Magic */ +.syntax .il { color: #1C01CE } /* Literal.Number.Integer.Long */ \ No newline at end of file From 3690e1dbe654b21c5f2b8ccdacdc687650e8a0e6 Mon Sep 17 00:00:00 2001 From: Shreya Date: Tue, 25 Oct 2022 23:46:59 +0530 Subject: [PATCH 2/6] Use default pygments style instead of colorful for better contrast --- web/templates/base.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/templates/base.html b/web/templates/base.html index 6a74a1d60..b3495939b 100644 --- a/web/templates/base.html +++ b/web/templates/base.html @@ -37,7 +37,7 @@ - +
From 4b979b3c5460749e4293e4c32a96394d27dc4941 Mon Sep 17 00:00:00 2001 From: Shreya Date: Wed, 26 Oct 2022 00:00:10 +0530 Subject: [PATCH 3/6] Remove unnecessary variable --- web/management/commands/generate_css_files.py | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/web/management/commands/generate_css_files.py b/web/management/commands/generate_css_files.py index 2a12036d3..b30cdbdef 100644 --- a/web/management/commands/generate_css_files.py +++ b/web/management/commands/generate_css_files.py @@ -22,14 +22,10 @@ def generate_file(self, style): line = '.syntax ' + line modified_css.append(line) - language_dir_path = os.path.join( + css_file_path = os.path.join( 'web', 'static', - 'css' - ) - - css_file_path = os.path.join( - language_dir_path, + 'css', f'pygments_{style}.css' ) From 0a5fbf13d85d70839446077042727b66e00fbb3c Mon Sep 17 00:00:00 2001 From: Shreya Date: Wed, 26 Oct 2022 00:01:31 +0530 Subject: [PATCH 4/6] Add newlines to generated files --- web/management/commands/generate_css_files.py | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/web/management/commands/generate_css_files.py b/web/management/commands/generate_css_files.py index b30cdbdef..2ac528a9a 100644 --- a/web/management/commands/generate_css_files.py +++ b/web/management/commands/generate_css_files.py @@ -35,5 +35,5 @@ def generate_file(self, style): os.remove(css_file_path) with open(css_file_path, 'w') as file: - file.write('\n'.join(modified_css)) - self.stdout.write(f'Created css stylesheet: {css_file_path}') \ No newline at end of file + file.write('\n'.join(modified_css)+'\n') + self.stdout.write(f'Created css stylesheet: {css_file_path}') From fb288800def7825c7bafe915bbf568dfc1eeb974 Mon Sep 17 00:00:00 2001 From: Shreya Date: Wed, 26 Oct 2022 00:02:43 +0530 Subject: [PATCH 5/6] Upload updated css files ;_; --- web/static/css/pygments_colorful.css | 2 +- web/static/css/pygments_default.css | 2 +- web/static/css/pygments_rrt.css | 2 +- web/static/css/pygments_sas.css | 2 +- web/static/css/pygments_xcode.css | 2 +- 5 files changed, 5 insertions(+), 5 deletions(-) diff --git a/web/static/css/pygments_colorful.css b/web/static/css/pygments_colorful.css index 9eb1dcd86..19a319afc 100644 --- a/web/static/css/pygments_colorful.css +++ b/web/static/css/pygments_colorful.css @@ -70,4 +70,4 @@ span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: .syntax .vg { color: #dd7700; font-weight: bold } /* Name.Variable.Global */ .syntax .vi { color: #3333BB } /* Name.Variable.Instance */ .syntax .vm { color: #996633 } /* Name.Variable.Magic */ -.syntax .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */ \ No newline at end of file +.syntax .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */ diff --git a/web/static/css/pygments_default.css b/web/static/css/pygments_default.css index d5368fc21..d79f05123 100644 --- a/web/static/css/pygments_default.css +++ b/web/static/css/pygments_default.css @@ -70,4 +70,4 @@ span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: .syntax .vg { color: #19177C } /* Name.Variable.Global */ .syntax .vi { color: #19177C } /* Name.Variable.Instance */ .syntax .vm { color: #19177C } /* Name.Variable.Magic */ -.syntax .il { color: #666666 } /* Literal.Number.Integer.Long */ \ No newline at end of file +.syntax .il { color: #666666 } /* Literal.Number.Integer.Long */ diff --git a/web/static/css/pygments_rrt.css b/web/static/css/pygments_rrt.css index 4f47a3ff8..a755350c1 100644 --- a/web/static/css/pygments_rrt.css +++ b/web/static/css/pygments_rrt.css @@ -39,4 +39,4 @@ span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: .syntax .vc { color: #eedd82 } /* Name.Variable.Class */ .syntax .vg { color: #eedd82 } /* Name.Variable.Global */ .syntax .vi { color: #eedd82 } /* Name.Variable.Instance */ -.syntax .vm { color: #eedd82 } /* Name.Variable.Magic */ \ No newline at end of file +.syntax .vm { color: #eedd82 } /* Name.Variable.Magic */ diff --git a/web/static/css/pygments_sas.css b/web/static/css/pygments_sas.css index fd7b1418e..9b2edc95a 100644 --- a/web/static/css/pygments_sas.css +++ b/web/static/css/pygments_sas.css @@ -61,4 +61,4 @@ span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: .syntax .vg { color: #2c2cff; font-weight: bold } /* Name.Variable.Global */ .syntax .vi { color: #2c2cff; font-weight: bold } /* Name.Variable.Instance */ .syntax .vm { color: #2c2cff; font-weight: bold } /* Name.Variable.Magic */ -.syntax .il { color: #2e8b57; font-weight: bold } /* Literal.Number.Integer.Long */ \ No newline at end of file +.syntax .il { color: #2e8b57; font-weight: bold } /* Literal.Number.Integer.Long */ diff --git a/web/static/css/pygments_xcode.css b/web/static/css/pygments_xcode.css index cd6c05933..494aa5979 100644 --- a/web/static/css/pygments_xcode.css +++ b/web/static/css/pygments_xcode.css @@ -64,4 +64,4 @@ span.linenos.special { color: #000000; background-color: #ffffc0; padding-left: .syntax .vg { color: #000000 } /* Name.Variable.Global */ .syntax .vi { color: #000000 } /* Name.Variable.Instance */ .syntax .vm { color: #000000 } /* Name.Variable.Magic */ -.syntax .il { color: #1C01CE } /* Literal.Number.Integer.Long */ \ No newline at end of file +.syntax .il { color: #1C01CE } /* Literal.Number.Integer.Long */ From d73b7ddb5b6dc0dd862775f0255c7a2d09de2090 Mon Sep 17 00:00:00 2001 From: Shreya Date: Wed, 26 Oct 2022 22:07:16 +0530 Subject: [PATCH 6/6] Use in-built prepend arg and remove redundant remove call --- web/management/commands/generate_css_files.py | 14 ++++---------- web/static/css/pygments_colorful.css | 1 + web/static/css/pygments_default.css | 1 + web/static/css/pygments_rrt.css | 1 + web/static/css/pygments_sas.css | 1 + web/static/css/pygments_xcode.css | 1 + 6 files changed, 9 insertions(+), 10 deletions(-) diff --git a/web/management/commands/generate_css_files.py b/web/management/commands/generate_css_files.py index 2ac528a9a..7d1abf8f9 100644 --- a/web/management/commands/generate_css_files.py +++ b/web/management/commands/generate_css_files.py @@ -12,15 +12,10 @@ def handle(self, *args, **options): self.generate_file(style) def generate_file(self, style): - css = HtmlFormatter.get_style_defs(HtmlFormatter(style=style)) # we need to prepend the `syntax` class before every class selector in the stylesheet to make sure that the styles get applied # only to our code snippet and not any other DOM element that happens to have the same class name. - modified_css = [] - for line in css.split("\n"): - if line[0] == '.': - line = '.syntax ' + line - modified_css.append(line) + css = HtmlFormatter.get_style_defs(HtmlFormatter(style=style), '.syntax') css_file_path = os.path.join( 'web', @@ -29,11 +24,10 @@ def generate_file(self, style): f'pygments_{style}.css' ) - # remove existing stylesheet so that it can be replaced with newer style versions or fixes if os.path.exists(css_file_path): - self.stdout.write(f'Removing stylesheet: {css_file_path} for style: {style}') - os.remove(css_file_path) + self.stdout.write(f'Overwriting stylesheet: {css_file_path} for style: {style}') + # overwrite existing stylesheet so that it can be replaced with newer style versions or fixes with open(css_file_path, 'w') as file: - file.write('\n'.join(modified_css)+'\n') + file.write(css + '\n') self.stdout.write(f'Created css stylesheet: {css_file_path}') diff --git a/web/static/css/pygments_colorful.css b/web/static/css/pygments_colorful.css index 19a319afc..0dc8471eb 100644 --- a/web/static/css/pygments_colorful.css +++ b/web/static/css/pygments_colorful.css @@ -4,6 +4,7 @@ span.linenos { color: inherit; background-color: transparent; padding-left: 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; } .syntax .hll { background-color: #ffffcc } +.syntax { background: #ffffff; } .syntax .c { color: #888888 } /* Comment */ .syntax .err { color: #FF0000; background-color: #FFAAAA } /* Error */ .syntax .k { color: #008800; font-weight: bold } /* Keyword */ diff --git a/web/static/css/pygments_default.css b/web/static/css/pygments_default.css index d79f05123..2cce6a515 100644 --- a/web/static/css/pygments_default.css +++ b/web/static/css/pygments_default.css @@ -4,6 +4,7 @@ span.linenos { color: inherit; background-color: transparent; padding-left: 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; } .syntax .hll { background-color: #ffffcc } +.syntax { background: #f8f8f8; } .syntax .c { color: #408080; font-style: italic } /* Comment */ .syntax .err { border: 1px solid #FF0000 } /* Error */ .syntax .k { color: #008000; font-weight: bold } /* Keyword */ diff --git a/web/static/css/pygments_rrt.css b/web/static/css/pygments_rrt.css index a755350c1..2910f017f 100644 --- a/web/static/css/pygments_rrt.css +++ b/web/static/css/pygments_rrt.css @@ -4,6 +4,7 @@ span.linenos { color: inherit; background-color: transparent; padding-left: 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; } .syntax .hll { background-color: #0000ff } +.syntax { background: #000000; } .syntax .c { color: #00ff00 } /* Comment */ .syntax .k { color: #ff0000 } /* Keyword */ .syntax .ch { color: #00ff00 } /* Comment.Hashbang */ diff --git a/web/static/css/pygments_sas.css b/web/static/css/pygments_sas.css index 9b2edc95a..48d84a169 100644 --- a/web/static/css/pygments_sas.css +++ b/web/static/css/pygments_sas.css @@ -4,6 +4,7 @@ span.linenos { color: inherit; background-color: transparent; padding-left: 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; } .syntax .hll { background-color: #ffffcc } +.syntax { background: #ffffff; } .syntax .c { color: #008800; font-style: italic } /* Comment */ .syntax .err { color: #a61717; background-color: #e3d2d2 } /* Error */ .syntax .g { color: #2c2cff } /* Generic */ diff --git a/web/static/css/pygments_xcode.css b/web/static/css/pygments_xcode.css index 494aa5979..300f34c97 100644 --- a/web/static/css/pygments_xcode.css +++ b/web/static/css/pygments_xcode.css @@ -4,6 +4,7 @@ span.linenos { color: inherit; background-color: transparent; padding-left: 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; } .syntax .hll { background-color: #ffffcc } +.syntax { background: #ffffff; } .syntax .c { color: #177500 } /* Comment */ .syntax .err { color: #000000 } /* Error */ .syntax .k { color: #A90D91 } /* Keyword */