https://github.com/kekland/stylist
A Flutter package for css-variables like theming
https://github.com/kekland/stylist
Last synced: 8 months ago
JSON representation
A Flutter package for css-variables like theming
- Host: GitHub
- URL: https://github.com/kekland/stylist
- Owner: kekland
- License: mit
- Created: 2019-07-11T18:34:14.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2019-07-13T08:03:23.000Z (over 6 years ago)
- Last Synced: 2023-08-20T23:18:23.215Z (about 2 years ago)
- Language: Dart
- Size: 17.6 KB
- Stars: 15
- Watchers: 1
- Forks: 3
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# stylist
CSS-variables like Flutter theming.
## How does it work?
`stylist` is just like CSS variables - it will be easy to pick up and use for web developers.
First, you create `StyleData` instance. You can have multiple `StyleData` instances, and then inject them all into one big `StyleData`.
```dart
StyleData cardStyle = StyleData({
"card-color": Color(0xFF129892),
"card-border-radius": BorderRadius.circular(16.0),
"card-border-color": "app-primary-color",
});
StyleData appStyle = StyleData({
"app-primary-color": Colors.blue.shade500,
})..inject(cardStyle)
```
Then, you apply your style in your app root using `StaticStyle`.
```dart
return StaticStyle(
style: appStyle,
child: MaterialApp(...),
);
```
Now you can use your style by calling `Style.of(context)`.
```dart
final style = Style.of(context);
// Automatically resolves the "app-primary-color" as a reference and gets the color.
final cardBorderColor = style.get("card-border-color");
```
## Benefits and downsides
It is really flexible, but you might lose some custom behavior that is obtainable through classes. Nevertheless, the ease of use makes up for it.
By the way, it also supports hex string colors.
## Want more CSS-like experience?
Check out [division](https://github.com/ReinBentdal/division) - a great package for styling your apps :)
## Contact me
**E-Mail**: `kk.erzhan@gmail.com`
Happy to accept and fix any issues or pull requests :)