Skip to content

Commit fd49dc8

Browse files
committed
Add demo gif
1 parent 80db954 commit fd49dc8

File tree

3 files changed

+9
-3
lines changed

3 files changed

+9
-3
lines changed

README.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,11 @@ A CSS class type provider for F# web development.
44

55
Bring external stylesheet classes into your F# code as design-time discoverable compiler-verified properties.
66

7-
## Examples
7+
## Demo
8+
9+
Check out the [Fable Tailwind sample](https://github.com/zanaptak/TypedCssClasses/tree/master/sample/FableTailwind) to see it in action.
10+
11+
## Code examples
812

913
The following examples use [Fable.React](https://fable.io/blog/Announcing-Fable-React-5.html) view syntax, but any other web framework should work as well since the provided properties compile to strings.
1014

sample/FableTailwind/README.md

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# TypedCssClasses Fable Tailwind Sample
22

3+
![Demo](demo.gif)
4+
35
This sample illustrates the following concepts:
46

57
* Using [TypedCssClasses](https://github.com/zanaptak/TypedCssClasses) for type-safe CSS class properties in a [Fable](https://fable.io/) single page application.
@@ -10,15 +12,15 @@ This sample illustrates the following concepts:
1012

1113
* Using [Feliz](https://github.com/Zaid-Ajaj/Feliz/) for type-safe inline styles when you don't have a CSS class available to produce the desired effect.
1214

13-
## Quick start
15+
## Getting started
1416

1517
Install [.NET Core SDK](https://dotnet.microsoft.com/download).
1618

1719
Install [Node.js](https://nodejs.org/).
1820

1921
Run `npm install`.
2022

21-
Run the `watch.cmd` (Windows) or `watch.sh` (Linux) script, and then browse to `http://localhost:8080`. You should see a simple counter app with blue buttons styled with Tailwind.
23+
Run the `watch.cmd` (Windows) or `watch.sh` (Linux) script, and then browse to `http://localhost:8080`. You should see a simple counter app with blue buttons styled with Tailwind CSS.
2224

2325
## Project structure
2426

sample/FableTailwind/demo.gif

231 KB
Loading

0 commit comments

Comments
 (0)