kivish

simple html template language

The project is in early development stage.

Kivish is a simple html template language, which could be an alternative to the Jade or Haml.
The name comes from the Kivy framework, which inspired this project.

Hello world example:

.kvs ## <!DOCTYPE html>
html
    head
        /meta
            *charset: utf-8
    body
        # let's create a simple span
        span: hello world
.html <!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8"/>
  </head>
  <body>
    <span>
      hello world
    </span>
  </body>
</html>

It differs from them both in syntax and features. It's most important difference are rules (aka directives).

.kvs SomeTable
SomeTable

<SomeTable@table>
    *style: |
        border-width: 1px;
        border-style: dashed;
        padding: 5px
    tr
        *style: background-color: #cccccc
        th: header
    tr
        td: row
.html <table style="border-width: 1px; border-style: dashed; padding: 5px">
  <td style="background-color: #cccccc">
    <th>
      header
    </th>
  </tr>
  <tr>
    <td>
      row
    </td>
  </tr>
</table>
<table style="border-width: 1px; border-style: dashed; padding: 5px">
  <td style="background-color: #cccccc">
    <th>
      header
    </th>
  </tr>
  <tr>
    <td>
      row
    </td>
  </tr>
</table>

Classes or ids can be defined inline using a dot or a hash.

.kvs node .class-a .class-b #id-a
.html <node class="class-a class-b" id="id-a">
</node>

Additionally, rules can have multiple inheritance levels.

.kvs rule:
    *style: a
    *class: a

<rule@deep>
    *style: b
    *class: b

<deep@div>
    *style: c
    *class: c
.html <div style="c; b; a" class="c b a">
</div>