Skip to content

Commit caf21b0

Browse files
Merge pull request #3274 from telerik/unstyled-tailwind-v4-example
docs: publish demo with unstyled and tailwind v4
2 parents 7f25149 + 2b43208 commit caf21b0

23 files changed

+6142
-0
lines changed
Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
pnpm-debug.log*
8+
lerna-debug.log*
9+
10+
node_modules
11+
dist
12+
dist-ssr
13+
*.local
14+
15+
# Editor directories and files
16+
.vscode/*
17+
!.vscode/extensions.json
18+
.idea
19+
.DS_Store
20+
*.suo
21+
*.ntvs*
22+
*.njsproj
23+
*.sln
24+
*.sw?
Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
# Kendo React Unstyled + Tailwind CSS v4
2+
3+
A feature request form built with unstyled Kendo React components and styled with Tailwind CSS v4.
4+
5+
## Quick Start
6+
7+
```bash
8+
npm install
9+
npm run dev
10+
```
11+
12+
## What's Inside
13+
14+
- **React 19** + **TypeScript** + **Vite**
15+
- **Kendo React** components (unstyled)
16+
- **Tailwind CSS v4** for styling
17+
- Custom form components with validation
18+
- Responsive design
19+
20+
## Key Files
21+
22+
- `src/App.tsx` - Main form component
23+
- `src/tailwind-preset.ts` - Tailwind styling for Kendo components
24+
- `src/components/fields/` - Custom form fields
25+
- `src/data.ts` - Form options data
26+
27+
## Scripts
28+
29+
- `npm run dev` - Start development server
30+
- `npm run build` - Build for production
31+
- `npm run preview` - Preview production build
32+
33+
## Features
34+
35+
- Unstyled Kendo React components with full styling control
36+
- Dynamic form fields based on user selections
37+
- Form validation and error handling
38+
- Mobile-responsive design
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<!doctype html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
7+
<title>Vite + React + TS</title>
8+
</head>
9+
<body>
10+
<div id="root"></div>
11+
<script type="module" src="/src/main.tsx"></script>
12+
</body>
13+
</html>

0 commit comments

Comments
 (0)