From 4c641266266de8b8e49a71208e1639ea49a3fb0c Mon Sep 17 00:00:00 2001 From: George Lemon Date: Thu, 15 Feb 2024 05:56:46 +0200 Subject: [PATCH] update Signed-off-by: George Lemon --- README.md | 53 +++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 51 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index a29eeff..21bbdcc 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,56 @@ ## 😍 Key Features -todo +_todo_ + +## Quick Example +```timl +div.container > div.row > div.col-lg-7.mx-auto + h1.display-3.fw-bold: "Tim is Awesome" +``` + +## Tim in action +Check [/example](https://github.com/openpeeps/tim/tree/main/example) folder to better understand Tim's structure. [Also, check the generated HTML file](https://htmlpreview.github.io/?https://raw.githubusercontent.com/openpeeps/tim/main/example/preview.html) + +### Client-Side Rendering +Tim Engine seamlessly shifts rendering to the client side for dynamic interactions, using the intuitive `@client` block statement. + +```timl +body + section#contact > div.container + div.row > div.col-12 > h3.fw-bold: "Leave a message" + div#contact-form + +@client target="#contact-form" + form method="POST" action="comment" + div > input.form-control type="text" name="username" placeholder="Your name" + div.my-3 > textarea.form-control name="message": "Your message" style="height: 140px" + div > button.btn.btn-dark type="submit": "Submit your message" +@end +``` +## Embeddable Code +Tim Engine is a versatile template engine. It seamlessly integrates a variety of embeddable code formats, including: +**JavaScript**, **YAML**/**JSON**, **CSS/SCSS** and **Sass** + +### JavaScript block + +```timl +@js + document.addEventListener('DOMContentLoaded', function() { + console.log("Hello, hello, hello!") + }); +@end +``` + +### JSON block +_todo_ + +### YAML block +_todo_ + +#### CSS/SCSS and Sass +_todo_ + ### ❤ Contributions & Support - 🐛 Found a bug? [Create a new Issue](https://github.com/openpeeps/tim/issues) @@ -25,4 +74,4 @@ todo ### 🎩 License Tim Engine | `LGPLv3` license. [Made by Humans from OpenPeeps](https://github.com/openpeeps).
-Copyright © 2023 OpenPeeps & Contributors — All rights reserved. +Copyright © 2024 OpenPeeps & Contributors — All rights reserved.