1

I am trying to use flask-flatpages to render my markdown post. Markdown extension is fenced_code_blocks, so I set FLATPAGES_MARKDOWN_EXTENSIONS = ['fenced_code'] for flatpages-flask. And also I want to highlight my code using pygments css. Create css view :

@app.route('/pygments.css')
def pygments_css():
    return pygments_style_defs('tango'), 200, {'Content-Type':"text/css"}

Jinja2 template html is below:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta name="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="{{ url_for('pygments_css')  }}">
  </head>
    {{ post.html|safe}}
  <body>

  </body>
</html>

But the final html is not highlighted, pygments.css contains codehilite which is default markdown extension in flask-flatpages

# part of pygments.css
.codehilite .hll { background-color: #ffffcc }
.codehilite  { background: #f8f8f8; }
.codehilite .c { color: #8f5902; font-style: italic } /* Comment */
.codehilite .err { color: #a40000; border: 1px solid #ef2929 } /* Error */
.codehilite .g { color: #000000 } /* Generic */
.codehilite .k { color: #204a87; font-weight: bold } /* Keyword */
.codehilite .l { color: #000000 } /* Literal */
.codehilite .n { color: #000000 } /* Name */
.codehilite .o { color: #ce5c00; font-weight: bold } /* Operator */
.codehilite .x { color: #000000 } /* Other */  

To highlight fenced code block rendered html, I should use fenced code block style css. Is it anyway to get fenced code block hightlight css file?

l0o0
  • 773
  • 1
  • 9
  • 26

0 Answers0