🐱 Simo is assembling components...
Our cat is hard at work!⌛
Cancell

@import[components/simoheader.html]
@import[components/simoside.html]

Partialing Components with Simo

With Simo, you can break down your HTML file into smaller sections like the header , footer , and other parts of your site, and load each section asynchronously.
This improves site speed and makes managing and updating your code easier. Additionally, instead of repeating commonly used sections like the header and footer on every page, you can simply call their components

Run
index.html
index.html
"Please wait a moment..."

How does it work?

In Simo, each component is essentially an HTML file that does not require a head and body structure.
First, create a new file named myside.html

myside.html
@norender @---defaultclass[p-4]

Now, create the myheader.html file.

myheader.html
@norender @d---efaultclass[p-4]
// active menu $('#this---id li').removeClass("text-[#0a82a9]") $('#this---id li').map((index, li) => { if ($(li).text().toLowerCase() == thisid.active??'home') { $(li).addClass("text-[#0a82a9]") } })

Now, you can use these two files anywhere in your master files by using the <simo> tag and the import command.

index.html
@norender <---!DOCTYP---E html> Document @---import[./myheader.html]
@---import[./myside.html]

main
index.html
@import[components/partials/myheader.html]
@import[components/partials/myside.html]

main