Skip to content

Commit 4fe7804

Browse files
authored
docs: update readme
1 parent 4485ba2 commit 4fe7804

File tree

1 file changed

+52
-4
lines changed

1 file changed

+52
-4
lines changed

README.md

Lines changed: 52 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,54 @@
1-
# via-plugin-picocss
2-
Enables styles from PicoCSS globally in a Via application.
3-
1+
# ✨ PicoCSS Plugin
42
The PicoCSS plugin integrates seamlessly with Via to provide elegant, responsive, and lightweight styling for your components without writing any CSS manually.
53

6-
See PicoCSS [Documentation](https://picocss.com/docs), to learn more about PicoCSS.
4+
## Example
5+
```go
6+
package main
7+
8+
import (
9+
"github.com/go-via/via"
10+
"github.com/go-via/via-plugin-picocss/picocss"
11+
"github.com/go-via/via/h"
12+
)
13+
14+
type Counter struct{ Count int }
15+
16+
func main() {
17+
v := via.New()
18+
19+
v.Config(via.Options{
20+
DocumentTitle: "Via Counter",
21+
Plugins: []via.Plugin{picocss.Default},
22+
})
23+
24+
v.Page("/", func(c *via.Context) {
25+
data := Counter{Count: 0}
26+
step := c.Signal(1)
27+
28+
increment := c.Action(func() {
29+
data.Count += step.Int()
30+
c.Sync()
31+
})
32+
33+
c.View(func() h.H {
34+
return h.Main(h.Class("container"), h.Br(),
35+
h.H1(h.Text("⚡ Via Counter w/ PicoCSS Plugin")),
36+
h.Hr(),
37+
h.Div(
38+
h.H2(h.Strong(h.Text("Count - ")), h.Textf("%d", data.Count)),
39+
h.H5(h.Strong(h.Text("Step - ")), h.Span(step.Text())),
40+
h.Div(h.Role("group"),
41+
h.Input(h.Type("number"), step.Bind()),
42+
h.Button(h.Text("Increment"), increment.OnClick()),
43+
),
44+
),
45+
)
46+
})
47+
})
48+
49+
v.Start()
50+
}
51+
```
52+
53+
## Docs
54+
See PicoCSS [docs](https://picocss.com/docs) to learn how to use it.

0 commit comments

Comments
 (0)