mirror of https://github.com/status-im/reagent.git
Merge pull request #391 from grav/patch-1
Docs: Add special notation for id and classes
This commit is contained in:
commit
46180032b7
|
@ -52,6 +52,46 @@ As of reagent 0.8.0, the `class` attribute accepts a collection of classes and w
|
||||||
[:div {:class ["a-class" (when active? "active") "b-class"]}]
|
[:div {:class ["a-class" (when active? "active") "b-class"]}]
|
||||||
```
|
```
|
||||||
|
|
||||||
|
## Special notation for id and class
|
||||||
|
|
||||||
|
The id of an element can be indicated with a hash (`#`) after the name of the element.
|
||||||
|
|
||||||
|
This:
|
||||||
|
|
||||||
|
```clojure
|
||||||
|
[:div#my-id]
|
||||||
|
```
|
||||||
|
|
||||||
|
is the same as this:
|
||||||
|
|
||||||
|
```clojure
|
||||||
|
[:div {:id "my-id"}]
|
||||||
|
```
|
||||||
|
|
||||||
|
One or more classes can indicated for an element with a `.` and the class-name like this:
|
||||||
|
|
||||||
|
```clojure
|
||||||
|
[:div.my-class.my-other-class.etc]
|
||||||
|
```
|
||||||
|
|
||||||
|
which is the same as:
|
||||||
|
|
||||||
|
```clojure
|
||||||
|
[:div {:class ["my-class" "my-other-class" "etc"]}]
|
||||||
|
```
|
||||||
|
|
||||||
|
Special notations for id and classes can be used together. The id must be listed first:
|
||||||
|
|
||||||
|
```clojure
|
||||||
|
[:div#my-id.my-class.my-other-class]
|
||||||
|
```
|
||||||
|
|
||||||
|
which is the same as:
|
||||||
|
|
||||||
|
```clojure
|
||||||
|
[:div {:id "my-id" :class ["my-class" "my-other-class"]}]
|
||||||
|
```
|
||||||
|
|
||||||
## Special notation for nested elements
|
## Special notation for nested elements
|
||||||
|
|
||||||
Reagent extends standard Hiccup in one way: it is possible to "squeeze" elements together by using a `>` character.
|
Reagent extends standard Hiccup in one way: it is possible to "squeeze" elements together by using a `>` character.
|
||||||
|
|
Loading…
Reference in New Issue