Fix: Escape CSS curly braces in HTML templates
Update inline CSS within `HTML_TEMPLATE` and the root endpoint's HTML. Double curly braces `{{` and `}}` are now used for CSS rules to prevent the templating engine from misinterpreting single curly braces `{}` as placeholders, ensuring correct CSS rendering.
This commit is contained in:
parent
0386b9f4ff
commit
15f51108dd
@ -28,6 +28,7 @@ except ImportError:
|
|||||||
app = FastAPI(title="Markdown Server", docs_url=None, redoc_url=None)
|
app = FastAPI(title="Markdown Server", docs_url=None, redoc_url=None)
|
||||||
|
|
||||||
# Define the HTML template for rendering markdown
|
# Define the HTML template for rendering markdown
|
||||||
|
# Using double curly braces to escape them in the CSS
|
||||||
HTML_TEMPLATE = """
|
HTML_TEMPLATE = """
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html>
|
<html>
|
||||||
@ -36,65 +37,65 @@ HTML_TEMPLATE = """
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||||
<title>{title}</title>
|
<title>{title}</title>
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {{
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
color: #333;
|
color: #333;
|
||||||
max-width: 800px;
|
max-width: 800px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}}
|
||||||
h1 {
|
h1 {{
|
||||||
border-bottom: 2px solid #eaecef;
|
border-bottom: 2px solid #eaecef;
|
||||||
padding-bottom: 0.3em;
|
padding-bottom: 0.3em;
|
||||||
color: #24292e;
|
color: #24292e;
|
||||||
}
|
}}
|
||||||
h2 {
|
h2 {{
|
||||||
border-bottom: 1px solid #eaecef;
|
border-bottom: 1px solid #eaecef;
|
||||||
padding-bottom: 0.3em;
|
padding-bottom: 0.3em;
|
||||||
color: #24292e;
|
color: #24292e;
|
||||||
}
|
}}
|
||||||
code {
|
code {{
|
||||||
background-color: #f6f8fa;
|
background-color: #f6f8fa;
|
||||||
padding: 0.2em 0.4em;
|
padding: 0.2em 0.4em;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
font-family: SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;
|
font-family: SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;
|
||||||
}
|
}}
|
||||||
pre {
|
pre {{
|
||||||
background-color: #f6f8fa;
|
background-color: #f6f8fa;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
border-radius: 6px;
|
border-radius: 6px;
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
}
|
}}
|
||||||
pre code {
|
pre code {{
|
||||||
background-color: transparent;
|
background-color: transparent;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
}
|
}}
|
||||||
a {
|
a {{
|
||||||
color: #0366d6;
|
color: #0366d6;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}}
|
||||||
a:hover {
|
a:hover {{
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
}
|
}}
|
||||||
table {
|
table {{
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-bottom: 16px;
|
margin-bottom: 16px;
|
||||||
}
|
}}
|
||||||
table, th, td {
|
table, th, td {{
|
||||||
border: 1px solid #dfe2e5;
|
border: 1px solid #dfe2e5;
|
||||||
}
|
}}
|
||||||
th, td {
|
th, td {{
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
}
|
}}
|
||||||
th {
|
th {{
|
||||||
background-color: #f6f8fa;
|
background-color: #f6f8fa;
|
||||||
}
|
}}
|
||||||
tr:nth-child(even) {
|
tr:nth-child(even) {{
|
||||||
background-color: #f6f8fa;
|
background-color: #f6f8fa;
|
||||||
}
|
}}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
@ -151,7 +152,7 @@ async def root(request: Request):
|
|||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<title>Bot Legal Documents</title>
|
<title>Bot Legal Documents</title>
|
||||||
<style>
|
<style>
|
||||||
body {
|
body {{
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
color: #333;
|
color: #333;
|
||||||
@ -159,17 +160,17 @@ async def root(request: Request):
|
|||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}}
|
||||||
h1 {
|
h1 {{
|
||||||
margin-bottom: 30px;
|
margin-bottom: 30px;
|
||||||
}
|
}}
|
||||||
.links {
|
.links {{
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
gap: 20px;
|
gap: 20px;
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
}
|
}}
|
||||||
.link-button {
|
.link-button {{
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
padding: 10px 20px;
|
padding: 10px 20px;
|
||||||
background-color: #0366d6;
|
background-color: #0366d6;
|
||||||
@ -177,10 +178,10 @@ async def root(request: Request):
|
|||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}}
|
||||||
.link-button:hover {
|
.link-button:hover {{
|
||||||
background-color: #0056b3;
|
background-color: #0056b3;
|
||||||
}
|
}}
|
||||||
</style>
|
</style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
Loading…
x
Reference in New Issue
Block a user