📝 updated readme

leafsphp · Mar 26, 2021 · c6e771b · c6e771b
1 parent 0f7f9da
commit c6e771b
Show file tree

Hide file tree

Showing 2 changed files with 30 additions and 44 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1 +1,2 @@
-vendor
+vendor
+try
diff --git a/readme.md b/readme.md
@@ -16,57 +16,42 @@ This will install Leaf UI into your application. You don't have to worry about b
 
 After this, you can use all of Leaf UI's methods and components.
 
-View the [mini documentation here](//leafphp.netlify.app/#/2.1/views/ui/)
+View the [mini documentation here](//leafphp.netlify.app/#//ui/)
 
-## Working With Templates
+## Working with Leaf UI
 
-Templates provide a quick way to scaffold a Leaf UI without sweating the tiny details. To get started, simply swap out the main the `Leaf\UI` package for `Leaf\UI\Template`.
+What does leaf UI offer you?
 
-```php
-use Leaf\UI\Template as UI;
-
-UI::element(...);
-```
+Instead of this:
 
 ```php
-$ui = new Leaf\UI\Template;
-
-$ui::element(...);
+<?php
+// all your logic
+
+echo "<section class=\"box\">
+  <h2 class=\"box-title\">Item name</h2>
+  <p class=\"box-body\">
+    Your body here
+  </p>
+</section>";
+?>
 ```
 
-### Template Methods
-
-#### _template
-
-This method let's you create a plain HTML structure consisting which looks somewhat like this when rendered:
-
-```html
-<!Doctype html  id="1590108145!Doctype html" />
-<html  id="1590108145html">
-	<head  id="1590108145head">
-		<title  id="1590108145title">{ Title Here }</title>
-		<meta name="viewport" content="width=device-width, initial-scale=1"  id="1590108145meta" />
-		<link href="vendor/leafs/ui/src/UI/default/default.css" rel="stylesheet"  id="1590108145link" />
-		{ Other Head Elements Here}
-	</head>
-	<body  id="1590108145body">
-		{ Body Here }
-	</body>
-</html>
-```
+You get to write this:
 
-Usage:
-
-```js
-$html = (
-	$ui::_template("Title Here", [
-		// Body Components here
-	])
-);
-
-$ui::render($html);
+```php
+<?php
+// all your logic
+
+echo section(["class" => "box"], [
+  h2("Item name"),
+  p("Your body here")
+]);
+?>
 ```
 
-### Wynter CSS Integration
+In the end, leaf ui allows you to write your whole app peacefully without having to deal with weird strings, interpollation and all that. Just write PHP!
+
+*This file is still being updated!*
 
-Leaf UI with wynter css allows you to use wynter css components instead of raw HTML components. Wynter CSS is a CSS Framework (work-in-progress) based on [spectre CSS](https://picturepan2.github.io/spectre/). So, with Leaf UI - Wynter Components, you can build your amazing frontends without any additional CSS or Javascript.
+Built with ❤ by [**Mychi Darko**](https://mychi.netlify.app)
-Original file line number
+Diff line change
@@ -1 +1,2 @@
-    vendor
+    vendor
+    try