Comments (2)
Garden uses a hash map to express rules, and hash maps cannot repeat keys.
...
This assumes that the order doesn't matter, but by using hash maps in the first place we're kind of assuming that CSS rule order doesn't matter within a single selector.
Both of these points are certainly valid and I knew it would be important to have solutions for them. For Garden, the solution is actually quite simple: use multiple hash maps.
[:div
{:background "rgb(...)"}
{:background "-moz-linear-gradient(...)"}
{:background "-webkit-gradient(...)"}]
This will give you the output you are looking for.
div {
background: rgb(...);
background: -moz-linear-gradient(...);
background: -webkit-gradient(...);
}
Now, I should point out that I hadn't considered this case in particular when thinking about the data structure semantics and I really like your idea of using sets as another solution. Since there are no semantics regarding sets within the context of a CSS declaration, I am inclined to included them based on your example. Ordering could still pose a small issue for some authors but, again, it's possible to use multiple maps to achieve the same end. Other than that I can't think of any good reasons not to permit sets to be used as you've demonstrated. In fact, I'll probably add it to the TODO list shortly. :)
It could also be useful to have a way to introduce a raw CSS string into a garden data structure...
I've thought a lot about this as well. While it could be nice to have strings around as a "backdoor", I'm not totally convinced it's a good idea. In fact, I've tried to design Garden such that it would eliminate any potential reasons for using raw CSS strings at all. With Hiccup, the case for strings as you've shown them has clear and obvious benefits. With Garden, I'm not so sure. However, I'm always open to solid cases and listening to what people have to say.
from garden.
It could also be useful to have a way to introduce a raw CSS string into a garden data structure, similar to how in hiccup you can mix and match:
(use '[hiccup.core :refer [html]])
(html [:div "<p>this is raw html</p>"])
; Result: "<div><p>this is raw html</p></div>"
from garden.
Related Issues (20)
- defcssfn don't behave as documented HOT 2
- Incorrect CSS emitted for inner media queries HOT 6
- Link broken for Tutorial and example in Wiki HOT 6
- how to supply the value to grid-template-area? in css it is multiple strings... HOT 3
- Changelog since 1.3.6 HOT 1
- Property order is different in output CSS, renders incorrectly in browser HOT 7
- `as-hex` taking into account Alpha value
- No `fr` unit
- Question about defining multiple style maps HOT 6
- Add support for container queries HOT 3
- Incorrect CSS emitted for "&" parent selector
- defcssfn is not defined in cljs or cljc
- `ClassNotFoundException` thrown when running tests on Java 11
- Warning about `garden.color/abs` shadowing `clojure.core` output when using Clojure 1.11.0 HOT 1
- `::marker` pseudo element isn't supported HOT 2
- Release request, to prevent repeated shadowed-var warnings in the REPL HOT 13
- Incorrect handling of selectors HOT 1
- Incorrect css generation HOT 1
- content: " " produces wrong output HOT 5
- Feature request: Support for cascade layers HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from garden.