connect-group/thymesheet

CSS-inspired extension to @Thymeleaf

thymesheet's Issues

Feature request: when more than one attribute with the same name applies to a single element, throw an exception instead of just using the last one

Consider Thymesheet files with duplicate attributes, like:

a {
  th-class: "firstClass";
  th-class: "secondClass";
}

or, even something like:

a {
  th-class: "firstClass";
}
* {
  th-class: "secondClass";
}

More than once I have seen people expect this sort of thing to work (by expecting ThymeLeaf/Sheet to combine the attributes), but instead only the last attribute that applies to an element will be used, and the others ignored.

I think both of the above cases should result in exceptions (and they will probably require different bits of code to be changed to implement each of them). Do you agree?

Cannot target HTML inside conditional comments

Feature Request: Allow Sass style syntax

It would be nice to be able to use a Sass-style syntax for Thymesheet.

E.g. instead of:

a b { .. }
a b c { ... }
a b c d { ... }
a b c e { ... }

Allow:

a b {
  c {
    d { ... }
    e { ... }
  }
}

This would reduce the amount of selector duplication in Thymesheet files.

Cannot target inline JavaScript

Command Line tool which combines Thymesheet with HTML to produce Thymeleaf

For debugging purposes it would be useful to be able to see the result of combining a Thymesheet with a HTML file, to produce a vanilla Thymeleaf HTML file.

Thymesheet equivalent to th:block

Some kind of :pseudo syntax for wrapping elements (so we can iterate over them, primarily); equivalent to th:block

An example would be a table where we want to repeat the first two rows;

<table>
  <tr><td>Name</td></tr>
  <tr><td>Address</td></tr>

  <tr><td>Name 2</td></tr>
  <tr><td>Address 2</td></tr>
</table>

(Loosely based on the Thymeleaf 2.1 example)

Thymeleaf lets you add a block to this e.g.

<table data-th-remove="all-but-first">
  <th:block data-th-each="dude : ${addressBook}">
    <tr><td>Name</td></tr>
    <tr><td>Address</td></tr>
  </th:block>

  <tr><td>Name 2</td></tr>
  <tr><td>Address 2</td></tr>
</table>

The solution I'm toying with is something like a :wrap pseudo-class where, :wrap will wrap an element; or optionally, an element and its following elements.

So e.g. to get the first two rows in a table, and wrap them in a block;

table tr:first-child:group(2) {
tagname: "th:block";
th-each: "dude : ${addressBook}"
}

table {
data-th-remove: "all-but-first";
}

WARNING… modifying the dom will depend on the order that the dom is modified!! So to get around that, the injected th:block would be wrapped in a Thymeleaf prototype-only comment block, e.g.

<!--/*/ <th:block th:each="dude : ${addressBook}"> /*/-->
    <tr><td>Name</td></tr>
    <tr><td>Address</td></tr>
<!--/*/ </th:block> /*/-->

TODO: check where these comments are unwrapped in the Thymeleaf process.

LookupLocator .properties location should be configurable in Spring

Syntax errors should result in exceptions rather than being logged to System.err and otherwise ignored

The error messages that are logged are easy to miss, and also don't include the path to the broken file.

It seems you can make exceptions be thrown by inserting this code at line 135 in ThymesheetPreprocessor.java

parser.setErrorHandler(ThrowCssExceptionErrorHandler.INSTANCE);

I can send a pull request with a test if you like.

HtmlThymesheetLocator should extend the lookup locator

This would allow the html to have zero changes made.

Command Line tool which converts Thymeleaf to Thymesheet

Some users may find it easier to write in Thymeleaf style (by adding attributes to HTML), but be able to extract this out to a Thymesheet file.

A tool which can analyse Thymeleaf HTML and extract to CSS would be useful.

Unfortunately the generated CSS file would be ultra-specific but would work.

Support for XML

Support Thymesheet for XML documents.

<?xml-stylesheet type="text/thymesheet" href="style9.tss"?>

Externalise Thymesheet includes

Add a parser which uses an XML look up file which lists Thymesheet file(s) per HTML file.

This will mean that the HTML files require zero modifications.