add load_resources to markdown

This commit is contained in:
Fabio Pliger
2024-01-31 17:56:41 -06:00
parent be65cf37ce
commit f37048f09e
3 changed files with 15 additions and 20 deletions

View File

@@ -1,7 +1,7 @@
"""Markdown module to generate web/HTML components from Markdown code"""
from pyscript import document, window
from pyweb.ui.elements import TextElementBase
from pyweb import pydom
from pyweb.ui.elements import TextElementBase, script
class markdown(TextElementBase):
"""Markdown component to render HTML from Markdown code"""
@@ -10,5 +10,17 @@ class markdown(TextElementBase):
def __init__(self, content, style=None, **kwargs):
# TODO: We should sanitize the content!!!!!
html = window.marked.parse(content)
super().__init__(html, style=style, **kwargs)
# TODO: DON'T KNOW WHY BUT THIS DOESN'T WORK
def load_resources(parent=None):
if parent is None:
parent = pydom.body
parent.append(
script(src="https://cdn.jsdelivr.net/npm/marked@11.1.1/lib/marked.umd.min.js"),
)
# load_resources()

View File

@@ -378,7 +378,7 @@ class Icon(ShoeBase):
# <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.12.0/cdn/themes/light.css" />
# <script type="module" src="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.12.0/cdn/shoelace-autoloader.js"></script>
def load_resources(parent=None):
print("Loading resources...")
print("Loading shoelace resources...")
if parent is None:
parent = pydom.body
parent.append(

View File

@@ -8,27 +8,10 @@
<link rel="stylesheet" href="../../dist/core.css">
<script type="module" src="../../dist/core.js"></script>
<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.12.0/cdn/themes/light.css" />
<script type="module" src="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.12.0/cdn/shoelace-autoloader.js"></script> -->
<script src="https://cdn.jsdelivr.net/npm/marked@11.1.1/lib/marked.umd.min.js"></script>
<!-- SHOWLACE CUSTOM CSS -->
<style>
.card-overview {
max-width: 300px;
}
.card-overview small {
color: var(--sl-color-neutral-500);
}
.card-overview [slot='footer'] {
display: flex;
justify-content: space-between;
align-items: center;
}
</style>
<style>