sunbeam

Crates.iosunbeam
lib.rssunbeam
version0.0.22-alpha
sourcesrc
created_at2022-03-18 22:19:35.085465
updated_at2023-06-22 21:30:40.626928
descriptionA dynamic CSS class library
homepage
repositoryhttps://github.com/chinedufn/sunbeam
max_upload_size
id552935
size4,719
Chinedu Francis Nwafili (chinedufn)

documentation

README

sunbeam Actions Status docs

Sunbeam is a typo-safe CSS class library

Sunbeam is a typo-safe CSS class library.

With sunbeam you write your CSS using the css! macro.

Later, at build time, you run sunbeam-build to parse these css! calls and then generate a CSS file that contains only the CSS that your application is using.

Basic Usage

cargo new sunbeam-example
cd sunbeam-example
// src/main.rs

#[macro_use]
extern crate sunbeam;

fn main () {
    let classes = css!("mr10 px5 py10 min640:bg-col-red min980:bg-col-custom");
    assert_eq!(classes, "mr10 px5 py10 min640:bg-col-red min980:bg-col-custom");
}
// build.rs

use sunbeam_build;

fn main() {
    // In a real application you might programatically build your file list
    // using something like:
    // `swift_bridge_build::files_in_dir_ending_with("src", "-view.rs")`
    let files_with_css = vec!["src/main.rs"];

    for path in &files_with_css {
        println!("cargo:rerun-if-changed={}", path);
    }

    sunbeam_build::parse_css(files)
        .write_class_declarations("./app.css")
}
cargo check
cat app.css

Custom CSS

Sunbeam's default styles should cover most use cases, but some applications might need to introduce new classes for their own needs.

For certain kinds of CSS, sunbeam allows you to define additional classes that will also be type checked at compile time.

# Sunbeam.toml

screen-widths = [ 308, 999, ]

[colors]
brand-red = #ff0001
let classes = css!("mb36 ml98 p85 bg-col-brand-red mt5 mr10");
assert_eq!(classes, "mb36 ml98 p85 bg-col-brand-red mt5 mr10");

Invalid CSS

If you try to use a class or selector that is not defined by sunbeam or in your Sunbeam.toml, you will get a compile time error.

let _classes = css!("d-flex not-a-real-class");
# SHOW THE COMPILE TIME ERROR HERE

TODO

  • Docs explain why Sunbeam does not come with color palettes. We want to encourage visual diversity.

To Test

To run the test suite.

# Clone the repository
git clone git@github.com:chinedufn/sunbeam.git
cd sunbeam

# Run tests
cargo test --all

License

sunbeam is licensed under either of

Commit count: 0

cargo fmt