baalajimaestro/obsolute-paste
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

Use prismjs for highlighting

Browse source 
- Also update fonts to Lunasima and Fira Code

Signed-off-by: baalajimaestro <me@baalajimaestro.me>
This commit is contained in:
baalajimaestro 2023-08-19 19:31:26 +05:30
parent f272a75d6d
commit e21c1a73a6
Signed by: baalajimaestro
GPG key ID: F93C394FE9BBAFD5
2 changed files with 17 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

20
static/styles.css
View file

@ -1,20 +1,18 @@
@import url("https://fonts.googleapis.com/css?family=IBM Plex Sans"); @import url("https://fonts.googleapis.com/css?family=IBM Plex Sans");
@import url("https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/atom-one-dark.min.css"); @import url("https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/themes/prism-tomorrow.min.css");
@import url("https://cdnjs.cloudflare.com/ajax/libs/hack-font/3.3.0/web/hack.css");
body { body {
font-family: "IBM Plex Sans"; font-family: "IBM Plex Sans";
} }
pre { code[class*="language-*"] {
overflow-x: auto; font-family: "Fira Code" !important;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
white-space: -pre-wrap;
white-space: -o-pre-wrap;
word-wrap: break-word;
} }
.hljs { .mdpaste {
font-family: "Hack" !important; white-space: normal !important;
word-break: break-word !important;
font-family: "Lunasima" !important;
font-size: 14 !important;
color: "white" !important;
} }

10
templates/paste.html
View file

@ -13,8 +13,9 @@
<h2 class="text-3xl font-bold text-gray-300">Obsolute Paste</h2> <h2 class="text-3xl font-bold text-gray-300">Obsolute Paste</h2>
{% block content %} {% block content %}
{% if md %} {% if md %}
<link href='https://fonts.googleapis.com/css?family=Lunasima' rel='stylesheet'>
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
<div class="w-10/12 text-gray-100 border border-solid border-emerald-200 rounded bg-zinc-800 p-2" id="pastecontent"></div> <div class="w-10/12 text-gray-100 border border-solid border-emerald-200 rounded bg-zinc-800 p-2 mdpaste" id="pastecontent"></div>
<script> <script>
document.getElementById('pastecontent').innerHTML = marked.parse(`{{paste_content}}`); document.getElementById('pastecontent').innerHTML = marked.parse(`{{paste_content}}`);
</script> </script>
@ -24,9 +25,14 @@
document.addEventListener("DOMContentLoaded", (event) => { document.addEventListener("DOMContentLoaded", (event) => {
const elem = document.getElementById("pastecontent"); const elem = document.getElementById("pastecontent");
hljs.highlightElement(elem); hljs.highlightElement(elem);
Prism.highlightElement(elem);
}); });
</script> </script>
<pre class="w-10/12 text-gray-100 border border-solid border-emerald-200 rounded bg-zinc-800 p-2" id="pastecontent">{{paste_content}}</pre> <script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/prism.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/components/prism-core.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/prism/1.29.0/plugins/autoloader/prism-autoloader.min.js"></script>
<link href='https://fonts.googleapis.com/css?family=Fira Code' rel='stylesheet'>
<pre class="w-10/12 text-gray-100 border border-solid border-emerald-200 rounded bg-zinc-800 p-2"><code id="pastecontent">{{paste_content}}</code></pre>
{% endif %} {% endif %}
{% endblock content %} {% endblock content %}
</div> </div>