chaiwind 2.0.0 → 2.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +53 -23
- package/chaiwind.js +367 -323
- package/demo/demo.html +104 -0
- package/package.json +14 -8
- package/chaiwind.css-data.json +0 -1072
- package/scripts/postinstall.js +0 -142
package/demo/demo.html
ADDED
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8">
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
6
|
+
<title>chaiwind demo</title>
|
|
7
|
+
<!-- load chaiwind in head — DOMContentLoaded handles timing -->
|
|
8
|
+
<script src="chaiwind.js"></script>
|
|
9
|
+
<style>
|
|
10
|
+
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
11
|
+
body { font-family: -apple-system, BlinkMacSystemFont, sans-serif; }
|
|
12
|
+
</style>
|
|
13
|
+
</head>
|
|
14
|
+
<body>
|
|
15
|
+
|
|
16
|
+
<!-- hero -->
|
|
17
|
+
<div class="chai-bg-chaicode-dark chai-p-12 chai-text-center">
|
|
18
|
+
<h1 class="chai-text-white chai-text-4xl chai-font-bold chai-mb-4">
|
|
19
|
+
chaiwind.js
|
|
20
|
+
</h1>
|
|
21
|
+
<p class="chai-text-gray chai-text-lg chai-mb-8">
|
|
22
|
+
utility-first CSS engine — chai-* classes, inline styles
|
|
23
|
+
</p>
|
|
24
|
+
<div class="chai-flex chai-justify-center chai-gap-4">
|
|
25
|
+
<button class="chai-bg-chai chai-text-white chai-p-3 chai-rounded-md chai-cursor-pointer chai-font-bold">
|
|
26
|
+
☕ Hitesh sir
|
|
27
|
+
</button>
|
|
28
|
+
<button class="chai-bg-piyush chai-text-white chai-p-3 chai-rounded-md chai-cursor-pointer chai-font-bold">
|
|
29
|
+
🩷 Piyush sir
|
|
30
|
+
</button>
|
|
31
|
+
<button class="chai-bg-macos-blue chai-text-white chai-p-3 chai-rounded-md chai-cursor-pointer chai-font-bold">
|
|
32
|
+
🍎 Akash sir
|
|
33
|
+
</button>
|
|
34
|
+
</div>
|
|
35
|
+
</div>
|
|
36
|
+
|
|
37
|
+
<!-- cards -->
|
|
38
|
+
<div class="chai-bg-white chai-p-10">
|
|
39
|
+
<div class="chai-flex chai-gap-6 chai-justify-center">
|
|
40
|
+
|
|
41
|
+
<!-- hitesh card -->
|
|
42
|
+
<div class="chai-bg-dudh chai-p-6 chai-rounded-lg chai-shadow-chai chai-w-full">
|
|
43
|
+
<p class="chai-text-masala chai-font-bold chai-text-xl chai-mb-3">
|
|
44
|
+
☕ Chai palette
|
|
45
|
+
</p>
|
|
46
|
+
<p class="chai-text-gray chai-text-sm chai-mb-4">
|
|
47
|
+
Warm, earthy, tapri-coded
|
|
48
|
+
</p>
|
|
49
|
+
<div class="chai-flex chai-gap-2">
|
|
50
|
+
<span class="chai-bg-chai chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">chai</span>
|
|
51
|
+
<span class="chai-bg-adrak chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">adrak</span>
|
|
52
|
+
<span class="chai-bg-masala chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">masala</span>
|
|
53
|
+
<span class="chai-bg-kulhad chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">kulhad</span>
|
|
54
|
+
</div>
|
|
55
|
+
</div>
|
|
56
|
+
|
|
57
|
+
<!-- piyush card -->
|
|
58
|
+
<div class="chai-bg-blush chai-p-6 chai-rounded-lg chai-shadow-piyush chai-w-full">
|
|
59
|
+
<p class="chai-text-piyush-dark chai-font-bold chai-text-xl chai-mb-3">
|
|
60
|
+
🩷 Pink palette
|
|
61
|
+
</p>
|
|
62
|
+
<p class="chai-text-gray chai-text-sm chai-mb-4">
|
|
63
|
+
Hot pink to soft blush
|
|
64
|
+
</p>
|
|
65
|
+
<div class="chai-flex chai-gap-2">
|
|
66
|
+
<span class="chai-bg-piyush chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">piyush</span>
|
|
67
|
+
<span class="chai-bg-rose chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">rose</span>
|
|
68
|
+
<span class="chai-bg-fuschia chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">fuschia</span>
|
|
69
|
+
</div>
|
|
70
|
+
</div>
|
|
71
|
+
|
|
72
|
+
<!-- akash card -->
|
|
73
|
+
<div class="chai-bg-silver chai-p-6 chai-rounded-lg chai-shadow-mac chai-w-full">
|
|
74
|
+
<p class="chai-text-midnight chai-font-bold chai-text-xl chai-mb-3">
|
|
75
|
+
🍎 Mac palette
|
|
76
|
+
</p>
|
|
77
|
+
<p class="chai-text-gray chai-text-sm chai-mb-4">
|
|
78
|
+
Clean, minimal, premium
|
|
79
|
+
</p>
|
|
80
|
+
<div class="chai-flex chai-gap-2">
|
|
81
|
+
<span class="chai-bg-midnight chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">midnight</span>
|
|
82
|
+
<span class="chai-bg-spacegray chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">spacegray</span>
|
|
83
|
+
<span class="chai-bg-macos-blue chai-text-white chai-p-2 chai-rounded-full chai-text-xs chai-font-bold">macos-blue</span>
|
|
84
|
+
</div>
|
|
85
|
+
</div>
|
|
86
|
+
|
|
87
|
+
</div>
|
|
88
|
+
</div>
|
|
89
|
+
|
|
90
|
+
<!-- usage example -->
|
|
91
|
+
<div class="chai-bg-midnight chai-p-10 chai-text-center">
|
|
92
|
+
<p class="chai-text-white chai-text-2xl chai-font-bold chai-mb-2">
|
|
93
|
+
Zero config. Just add classes.
|
|
94
|
+
</p>
|
|
95
|
+
<p class="chai-text-gray chai-mb-6">
|
|
96
|
+
chai-* prefix → parsed → inline style applied → class removed
|
|
97
|
+
</p>
|
|
98
|
+
<div class="chai-bg-chaicode chai-text-white chai-p-4 chai-rounded-lg chai-text-lg chai-font-bold chai-shadow-chai">
|
|
99
|
+
chai-bg-chaicode + chai-p-4 + chai-rounded-lg
|
|
100
|
+
</div>
|
|
101
|
+
</div>
|
|
102
|
+
|
|
103
|
+
</body>
|
|
104
|
+
</html>
|
package/package.json
CHANGED
|
@@ -1,21 +1,27 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "chaiwind",
|
|
3
|
-
"version": "2.
|
|
3
|
+
"version": "2.1.1",
|
|
4
4
|
"description": "Bounty Jitenge hum Hehe",
|
|
5
5
|
"main": "chaiwind.js",
|
|
6
|
-
|
|
7
6
|
"scripts": {
|
|
8
|
-
|
|
9
|
-
},
|
|
10
|
-
"files": [
|
|
7
|
+
"postinstall": "node scripts/postinstall.js"
|
|
8
|
+
},
|
|
9
|
+
"files": [
|
|
11
10
|
"chaiwind.js",
|
|
11
|
+
"chaiwind.css",
|
|
12
12
|
"chaiwind.css-data.json",
|
|
13
13
|
"scripts/postinstall.js",
|
|
14
|
+
"demo/",
|
|
14
15
|
"README.md"
|
|
15
16
|
],
|
|
16
|
-
"keywords": [
|
|
17
|
-
|
|
17
|
+
"keywords": [
|
|
18
|
+
"css",
|
|
19
|
+
"utility",
|
|
20
|
+
"framework",
|
|
21
|
+
"chaicode",
|
|
22
|
+
"inline-style"
|
|
23
|
+
],
|
|
18
24
|
"author": "anand",
|
|
19
25
|
"license": "MIT",
|
|
20
26
|
"type": "commonjs"
|
|
21
|
-
}
|
|
27
|
+
}
|