Crate tailwind_css

source · [−]

Expand description

Tailwind to Css

use tailwind_css::TailwindBuilder;

fn build() {
    let mut tailwind = TailwindBuilder::default();
    // 
    let inline = tailwind.inline("py-2 px-4 bg-green-500");
    // 
    tailwind.trace("py-2 px-4 bg-green-500");
    //
    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.

raw: 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 {}

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

Implement Progress

See the tests folder for details

preflight: PreflightSystem
Layout
- aspect-ratio: TailwindAspect
- container: [``]
- columns: [``]
- break-after: TailwindBreak::After
- break-before: TailwindBreak::Before
- break-inside: TailwindBreak::Inside
- box-decoration-break
- box-sizing
- display
- float
- clear
- isolation
- object-fit
- object-position
- overflow
- overscroll-behavior
- position
- top-right-bottom-left
- visibility
- z-index
Flexbox & Grid
- z-index: TailWindZIndex
Spacing
- padding
- margin
- space
Sizing
Typography
- font-family
Backgrounds
- background-attachment
Borders
- border-radius
Effects
Filters
- blur
Tables
- border-collapse: TailwindBorderCollapse
- table-layout: TailwindTableLayout
Transitions & Animation
- box-shadow

Macros

Structs

BreakPointSystem

In general, it is a look-up table.

PreflightSystem

https://tailwindcss.com/docs/preflight

https://tailwindcss.com/docs/box-shadow

Utilities for controlling the aspect ratio of an element.

TailwindBlender

https://tailwindcss.com/docs/mix-blend-mode

TailwindBuilder

Error type for all tailwind operators

Uncategorized tailwind property

TailwindOpacity

https://tailwindcss.com/docs/opacity

Enums

Utilities for controlling the stack order of an element.

TailwindBlendKind

TailwindBlendMode

TailwindBorderCollapse

Utilities for controlling whether table borders should collapse or be separated.

TailwindErrorKind

Actual error data for the error

https://tailwindcss.com/docs/width

used to express sizing

TailwindTableLayout

Utilities for controlling the table layout algorithm.

https://tailwindcss.com/docs/height

Traits

TailwindInstance

Type Definitions

Tailwind Parsed Result

Tailwind Parsed Result

All result about tailwind