tailwind-css

Crates.iotailwind-css
lib.rstailwind-css
version0.12.7
created_at2022-01-17 17:26:13.219778+00
updated_at2023-11-27 04:03:38.649675+00
descriptionCompile tailwind short instructions to css
homepage
repositoryhttps://github.com/oovm/tailwind-rs
max_upload_size
id515693
size456,889
SasakiSaki (oovm)

documentation

https://docs.rs/tailwind-css

README

Tailwind CSS

Tailwind style tracer, JIT + AOT Interpreter!

use tailwind_css::TailwindBuilder;

fn build() {
    let mut tailwind = TailwindBuilder::default();
    // The compiler will expand directly into the final css property
    // Inline style will not be tracked
    let inline = tailwind.inline("py-2 px-4 bg-green-500");
    // The compiler will expand into a `class`, and record the style class used
    tailwind.trace("py-2 px-4 bg-green-500", false);
    // Compile all traced classes into bundle
    let bundle = tailwind.bundle();
}

Notice

Tailwind++ Grammar

This library is not strictly implemented according to the original version.

Especially when some writing methods can be simplified or generalized.

For example arbitrary values of z-index needs brackets, but rs version does not.

  • js: z-[100]
  • rs: z-100

Bundle or Inline?

For example, there are style overrides in p-auto px-px pt-2 pb-2.

In inline mode, the latter will overwrite the former, and finally get padding:.5rem 1px

In Bundle mode, the final result depends on the browser.

Implement Progress

tailwind-rs needs your help!

A lot of documentation and test cases are missing, you are welcome to pr!

See the tests folder for details.

Commit count: 338

cargo fmt