generate tags and styles in /formatting dynamically
parent
ca56758d1e
commit
8c0093c279
|
|
@ -49,14 +49,9 @@ TLDS = ( # Original gTLDs and ccTLDs
|
|||
'red','city','quest','works'
|
||||
)
|
||||
|
||||
allowed_tags = (
|
||||
'b','blockquote','br','code','del','em','h1','h2','h3','h4','h5','h6','hr','i',
|
||||
'li','ol','p','pre','strong','sub','sup','table','tbody','th','thead','td','tr','ul',
|
||||
'marquee','a','span','ruby','rp','rt','spoiler','img','lite-youtube','video','audio','g','u','small',
|
||||
'strike','center','details','summary',
|
||||
)
|
||||
allowed_tags = ('a','audio','b','blockquote','br','center','code','del','details','em','g','h1','h2','h3','h4','h5','h6','hr','i','img','li','lite-youtube','marquee','ol','p','pre','rp','rt','ruby','small','span','spoiler','strike','strong','sub','summary','sup','table','tbody','td','th','thead','tr','u','ul','video')
|
||||
|
||||
allowed_styles = ['color', 'background-color', 'font-weight', 'text-align']
|
||||
allowed_styles = ['background-color', 'color', 'filter', 'font-weight', 'text-align']
|
||||
|
||||
def allowed_attributes(tag, name, value):
|
||||
|
||||
|
|
@ -508,10 +503,9 @@ def sanitize(sanitized, golden=True, limit_pings=0, showmore=False, count_emojis
|
|||
|
||||
sanitized = sanitized.replace('<p></p>', '')
|
||||
|
||||
allowed_css_properties = allowed_styles.copy()
|
||||
if g.v and g.v.chud:
|
||||
allowed_css_properties = allowed_styles
|
||||
else:
|
||||
allowed_css_properties = allowed_styles + ["filter"]
|
||||
allowed_css_properties.remove('filter')
|
||||
|
||||
css_sanitizer = CSSSanitizer(allowed_css_properties=allowed_css_properties)
|
||||
sanitized = bleach.Cleaner(tags=allowed_tags,
|
||||
|
|
|
|||
|
|
@ -358,7 +358,7 @@ def blocks(v):
|
|||
@limiter.limit(DEFAULT_RATELIMIT, deduct_when=lambda response: response.status_code < 400, key_func=get_ID)
|
||||
@auth_required
|
||||
def formatting(v):
|
||||
return render_template("formatting.html", v=v)
|
||||
return render_template("formatting.html", v=v, allowed_tags=allowed_tags, allowed_styles=allowed_styles)
|
||||
|
||||
@app.get("/app")
|
||||
@limiter.limit(DEFAULT_RATELIMIT, deduct_when=lambda response: response.status_code < 400)
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
<div class="ml-2">You can use Markdown formatting:</div>
|
||||
|
||||
<div class="overflow-x-auto mt-3"><table class="table table-striped mb-5 generate-copy-buttons">
|
||||
<div class="overflow-x-auto mt-3"><table class="table table-striped generate-copy-buttons">
|
||||
<thead class="bg-primary text-white">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
|
|
@ -286,395 +286,40 @@ Text 2
|
|||
</tbody>
|
||||
</table></div>
|
||||
|
||||
<hr class="my-6">
|
||||
|
||||
<h1>HTML Formatting</h1>
|
||||
|
||||
And we allow custom HTML in most places:
|
||||
|
||||
<h4 class="mt-2">Allowed Tags</h4>
|
||||
<h4 class="mt-3">Allowed Tags</h4>
|
||||
|
||||
<div class="overflow-x-auto"><table class="table table-striped mb-5 generate-copy-buttons">
|
||||
<thead class="bg-primary text-white">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
<th class="disable-sort-click">What you type</th>
|
||||
<th class="disable-sort-click">What gets displayed</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>Span</td>
|
||||
<td>
|
||||
My mother has <span style="color:blue">blue</span> eyes.
|
||||
</td>
|
||||
<td>
|
||||
My mother has <span style="color:blue">blue</span> eyes.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Bold</td>
|
||||
<td>This will be <b>bold</b></td>
|
||||
<td>
|
||||
This will be <b>bold</b>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Blockquote</td>
|
||||
<td>
|
||||
<blockquote>This is a blockquote</blockquote>
|
||||
</td>
|
||||
<td>
|
||||
<blockquote>
|
||||
This is a blockquote
|
||||
</blockquote>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Greentext</td>
|
||||
<td>>text</td>
|
||||
<td><g>text</g></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Line Break</td>
|
||||
<td>
|
||||
<pre>
|
||||
Line 1
|
||||
<br>
|
||||
Line 2
|
||||
</pre>
|
||||
</td>
|
||||
<td>
|
||||
Line 1
|
||||
<br>
|
||||
Line 2
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Code</td>
|
||||
<td>
|
||||
<code>This is code</code>
|
||||
</td>
|
||||
<td>
|
||||
<code>This is code</code>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Strikethrough</td>
|
||||
<td>
|
||||
The last word will have a <del>strikethrough</del>
|
||||
</td>
|
||||
<td>
|
||||
The last word will have a <del>strikethrough</del>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Emphasis</td>
|
||||
<td>
|
||||
We <em>cannot</em> live like this.
|
||||
</td>
|
||||
<td>
|
||||
We <em>cannot</em> live like this.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Headings</td>
|
||||
<td>
|
||||
<pre>
|
||||
<h1>This is heading 1</h1>
|
||||
<h2>This is heading 2</h2>
|
||||
<h3>This is heading 3</h3>
|
||||
<h4>This is heading 4</h4>
|
||||
<h5>This is heading 5</h5>
|
||||
<h6>This is heading 6</h6>
|
||||
</pre>
|
||||
</td>
|
||||
<td>
|
||||
<h1>This is heading 1</h1>
|
||||
<h2>This is heading 2</h2>
|
||||
<h3>This is heading 3</h3>
|
||||
<h4>This is heading 4</h4>
|
||||
<h5>This is heading 5</h5>
|
||||
<h6>This is heading 6</h6>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Horizontal Rule</td>
|
||||
<td>
|
||||
<pre>
|
||||
Text 1
|
||||
<hr>
|
||||
Text 2
|
||||
</pre>
|
||||
</td>
|
||||
<td>
|
||||
Text 1
|
||||
<hr>
|
||||
Text 2
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Italics</td>
|
||||
<td>
|
||||
<i>This</i> is how you get italics.
|
||||
</td>
|
||||
<td>
|
||||
<i>This</i> is how you get italics.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Lists</td>
|
||||
<td>
|
||||
<pre>
|
||||
<ul>
|
||||
<li>Bullet 1</li>
|
||||
<li>Bullet 2</li>
|
||||
</ul>
|
||||
<ol>
|
||||
<li>Number 1</li>
|
||||
<li>Number 2</li>
|
||||
</ol>
|
||||
</pre>
|
||||
</td>
|
||||
<td>
|
||||
<ul>
|
||||
<li>Bullet 1</li>
|
||||
<li>Bullet 2</li>
|
||||
</ul>
|
||||
<ol>
|
||||
<li>Number 1</li>
|
||||
<li>Number 2</li>
|
||||
</ol>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Paragraphs</td>
|
||||
<td>
|
||||
<pre>
|
||||
<p>Paragraph 1</p>
|
||||
<p>Paragraph 2</p>
|
||||
</pre>
|
||||
</td>
|
||||
<td>
|
||||
<p>Paragraph 1</p>
|
||||
<p>Paragraph 2</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Preformatted Text</td>
|
||||
<td><pre>
|
||||
<pre>
|
||||
Text in a pre element
|
||||
is displayed in a fixed-width
|
||||
font, and it preserves
|
||||
both spaces and
|
||||
line breaks
|
||||
</pre>
|
||||
</pre></td>
|
||||
<td>
|
||||
<pre>
|
||||
Text in a pre element
|
||||
is displayed in a fixed-width
|
||||
font, and it preserves
|
||||
both spaces and
|
||||
line breaks
|
||||
</pre>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Strong</td>
|
||||
<td>
|
||||
<strong>This text is important!</strong>
|
||||
</td>
|
||||
<td>
|
||||
<strong>This text is important!</strong>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Subscript</td>
|
||||
<td>
|
||||
This text contains <sub>subscript</sub> text.
|
||||
</td>
|
||||
<td>
|
||||
This text contains <sub>subscript</sub> text.
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Superscript</td>
|
||||
<td>
|
||||
E = mc<sup>2</sup>
|
||||
</td>
|
||||
<td>
|
||||
E = mc<sup>2</sup>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Tables</td>
|
||||
<td><pre>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<td>Col 1</td>
|
||||
<td>Col 2</td>
|
||||
<td>Col 3</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>2</td>
|
||||
<td>3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>5</td>
|
||||
<td>6</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></pre>
|
||||
</td>
|
||||
<td>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<td>Col 1</td>
|
||||
<td>Col 2</td>
|
||||
<td>Col 3</td>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>1</td>
|
||||
<td>2</td>
|
||||
<td>3</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>4</td>
|
||||
<td>5</td>
|
||||
<td>6</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Marquee</td>
|
||||
<td>
|
||||
<marquee direction="up" behavior="scroll" scrollamount="10" height="250">
|
||||
This is a sample scrolling text that has scrolls in the upper direction.
|
||||
</marquee>
|
||||
</td>
|
||||
<td>
|
||||
<marquee direction="up" behavior="scroll" scrollamount="10" height="250">
|
||||
This is a sample scrolling text that has scrolls in the upper direction.
|
||||
</marquee>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Links</td>
|
||||
<td>
|
||||
This is a <a href='https://www.w3schools.com/tags/tag_a.asp'>link</a>
|
||||
</td>
|
||||
<td>
|
||||
This is a <a rel="nofollow noopener" href='https://www.w3schools.com/tags/tag_a.asp'>link</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Images</td>
|
||||
<td>
|
||||
<img src="https://i.imgur.com/SwVuagI_d.webp" width="200">
|
||||
</td>
|
||||
<td>
|
||||
<img loading="lazy" alt="example image" src="https://i.imgur.com/SwVuagI_d.webp" width="200">
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>Underlined Text</td>
|
||||
<td>
|
||||
<u>fart</u>
|
||||
</td>
|
||||
<td>
|
||||
<u>fart</u>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></div>
|
||||
<ul>
|
||||
{% for tag in allowed_tags %}
|
||||
<li>{{tag}}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
<h4>Allowed Attributes</h4>
|
||||
<h5 class="mt-4">Allowed Styles</h5>
|
||||
|
||||
<div class="overflow-x-auto"><table class="table table-striped mb-5">
|
||||
<thead class="bg-primary text-white">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>href</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>style</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>src</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>class</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>title</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>direction</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>behavior</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>scrollamount</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></div>
|
||||
<ul>
|
||||
{% for style in allowed_styles %}
|
||||
<li>{{style}}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
<h5>Allowed Styles</h5>
|
||||
<hr class="my-6">
|
||||
|
||||
<div class="overflow-x-auto"><table class="table table-striped mb-5">
|
||||
<thead class="bg-primary text-white">
|
||||
<tr>
|
||||
<th>Name</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>background-color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>font-weight</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>text-align</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table></div>
|
||||
<h1 id="approved">Approved Media Hosts</h1>
|
||||
|
||||
<h5 id="approved">Approved Image Hosts</h5>
|
||||
|
||||
<div class="overflow-x-auto"><table class="table table-striped mb-5">
|
||||
<thead class="bg-primary text-white">
|
||||
<tr>
|
||||
<th>Host</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for host in approved_embed_hosts %}
|
||||
<tr>
|
||||
<td>{{host}}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table></div>
|
||||
Image files, video files, and audio files from these sources will get embedded automatically:
|
||||
|
||||
<ul class="mt-3">
|
||||
{% for host in approved_embed_hosts %}
|
||||
<li>{{host}}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
|
||||
<div class="toast clipboard" id="toast-success" data-bs-animation="true" data-bs-autohide="true" data-bs-delay="5000">
|
||||
<div class="toast-body text-center">
|
||||
<i class="fas fa-check-circle text-success mr-2"></i>Text copied to clipboard
|
||||
|
|
|
|||
Loading…
Reference in New Issue