-
Notifications
You must be signed in to change notification settings - Fork 4
Home
Here's a summary of the syntax of Slade. This syntax can still change, because I'm not quite sure yet if this is the best and easiest syntax I can think of.
If you want to let Slade generate an html tag, simple write the name of the tag lower cased. So if index.slade.php looks like this:
div
Then it will compile to:
<div></div>
Slade actually assumes that any line beginning with a lower-cased word, represents an html tag. So you could use that to also generate custom elements like so:
my-component
Which translates to
<my-component></my-component>
And Slade is also aware of self-closing tags of course, so meta
converts to <meta />
.
Now I assume you might also want to add an id, some classes, other attributes and some inner text, don't you? That's easy:
div#main.container.well layout="vertical" This is my content
Will translate to:
<div id="main" class="container well" layout="vertical">This is my content</div>
By the way, if you start a tag with an id, or a class, instead of a tag-name then Slade will assume you want to use a div.
If you want to nest tags then that is done by indentation. In fact, all of Slade works like that. There are no ways to open or close blocks other than to use indentation.
#container
h1 My first article
p Here's my body text
Turns into
<div id="container">
<h1>My first article</h1>
<p>Here's my body text</p>
</div>
Variables can be put in many places in many different ways. Say you want to use a variable for an attribute of an html tag, you can do it like this:
meta author=$username
If the view was passed data that looks like ['username' => 'Evert']
then the html would be:
<meta author="Evert">
If you want to insert variables as the text content of a tag, you can do it like this:
h1 = $article->title
p == $article->body
<h1>Nuts & Bolts</h1>
<p>My <strong>very important</strong> opinion</p>
Notice how the title was encoded with html-entities (because it was prefixed with only 1 =
sign) and the body was inserted unencoded (because it was prefixed with 2 =
signs).
Finally, you can also execute functions this way.
= str_repeat($user->signature, 5)
One can insert a block of text by using a pipe.
| You can use a pipe
| On every new line.
| Or you can only
use one single pipe
as long as you indent
the text, like I'm doing here.
If you want to insert variables in that block of text, you have several options:
| Hello $name, I heard you like {$animals[0]} and ${animals[1]}
If you want a certain block of content to appear or not appear depending on the content of a variable, you can use a question-mark or an exclamation-mark. The exclamation mark is an inverted conditional.
? $messages
p You have messages.
! $messages
p You have no messages.
You can also use more complicated conditional statements like so:
? !$var || ($number < 6 && $role == 'administrator')
Which is equivalent to:
if ( !$var || ($number < 6 && $role == 'administrator') ):
or
! $var && ($number > 5 || $role != 'administrator')
Which is equivalent to:
if ( ! ( $var && ($number > 5 || $role != 'administrator') ) ):
If you want a certain block to be repeated for every item in an iterable, then you can do this:
ul
> $people
li = $person->name
Slade automatically converts the variable name from plural to singular. If it doesn't know a singular version of the word, it will use the variable $item.
ul
> $rain
li = $item->size
You can also choose your own variable name, like so:
ul
> $rain > $droplet
li = $droplet->size
To be continued...