https://github.com/jsdw/fuss
A Functional CSS Preprocessor
https://github.com/jsdw/fuss
css rust
Last synced: about 1 year ago
JSON representation
A Functional CSS Preprocessor
- Host: GitHub
- URL: https://github.com/jsdw/fuss
- Owner: jsdw
- License: mit
- Created: 2017-05-17T21:21:37.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2018-03-14T21:40:13.000Z (over 8 years ago)
- Last Synced: 2025-04-02T15:51:14.388Z (over 1 year ago)
- Topics: css, rust
- Language: Rust
- Size: 272 KB
- Stars: 14
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
README
- [Documentation](docs/index.md)
- [Examples](examples)
# FUSS - A Functional CSS Preprocessor.
The goal of FUSS is to improve on the power to weight ratio of existing CSS preprocessors. The syntax aims to be a superset of CSS, so you can write CSS as you would normally, but augment it with FUSS syntax when you'd like the extra functionality.
In FUSS, almost everything is an expression. Functions, variables, and CSS blocks themselves can all be composed with eachother. FUSS looks something like:
```
$other: import("other");
$drop: &.drop {
border: 3px solid yellow;
.icon {
color: yellow;
}
};
.site-body {
// apply our other theme here,
// overriding the title colors:
$other.theme({
$title: red;
$titleBg: black;
});
// add drop styling too:
$drop;
&.massive .banner, &.huge .banner {
height: 100px;
}
}
```
Check out the [examples](examples) folder for more.
## Installation
The easiest way to have a play with FUSS at the moment is to build from source. This is very straightforward:
1. install rust from [the official website](https://www.rust-lang.org).
2. run `cargo install` in this folder to build an optimised binary.
## Note
This is a prototype/work in progress. Many things work great, but there is still much to do before it can cover the vast majority of use cases!
## Contributions
Feedback and pull requests are welcome! Please open an issue prior to doing any serious amount of work so that we can have a chat and make sure we're on the same page :)