https://github.com/mdgriffith/style-elements
Create styles that don't mysteriously break!
https://github.com/mdgriffith/style-elements
Last synced: 5 months ago
JSON representation
Create styles that don't mysteriously break!
- Host: GitHub
- URL: https://github.com/mdgriffith/style-elements
- Owner: mdgriffith
- License: bsd-3-clause
- Created: 2016-07-28T11:24:34.000Z (almost 10 years ago)
- Default Branch: master
- Last Pushed: 2020-09-23T23:27:09.000Z (over 5 years ago)
- Last Synced: 2025-01-21T18:51:28.295Z (over 1 year ago)
- Language: HTML
- Homepage: http://package.elm-lang.org/packages/mdgriffith/style-elements/latest
- Size: 1.83 MB
- Stars: 445
- Watchers: 22
- Forks: 49
- Open Issues: 68
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# The Style Elements Library!
**Note** This project had a major rewrite and continues as [Elm UI](https://github.com/mdgriffith/elm-ui). Go check it out :)
#### Resources to get you started
Check out the [intro guide to style-elements!](https://mdgriffith.gitbooks.io/style-elements/content/)
I also spoke about the basis of this library at [Elm Europe, 2017](https://www.youtube.com/watch?v=NYb2GDWMIm0)
Join us on the `#style-elements` channel in the [Elm Slack](https://elmlang.herokuapp.com/). Many style-element friends and I are there to answer questions and point you in the right direction. Don't be shy!
### Building a new layout language
The Style Elements library is a new set of primitives for working with layout and style in Elm.
The most common goal when working with your view is usually to set or to adjust your layout.
HTML and CSS make this difficult because there's no central place that represents your layout.
You're generally forced to bounce back and forth between multiple definitions in multiple files in order to adjust layout, even though it's probably the most common thing you'll do.
### Separating Layout and Style
The Style Elements library makes layout a first class idea, which makes working with style and layout a breeze.
It also makes refactoring your style feel similarly invincible as refactoring in Elm!
The main idea is that layout should live in your view, and your stylesheet should deal with all properties _except_ those relating to layout, position, sizing, and spacing.
The `Element` module contains all the components that go in your view.
The `Style` module is the base for creating your stylesheet.