prewindcss 1.1.0 → 1.2.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 +3 -2
- package/package.json +1 -1
- package/script/prewindcss.js +11 -5
- package/script/theme.js +57 -0
- package/theme.css +2 -1
package/README.md
CHANGED
|
@@ -25,7 +25,7 @@ Prewind works with the platform, not around it. CSS already has a cascade, varia
|
|
|
25
25
|
Load Prewind from a CDN or host it yourself:
|
|
26
26
|
|
|
27
27
|
```html
|
|
28
|
-
<link rel="stylesheet" href="https://unpkg.com/prewindcss@1.
|
|
28
|
+
<link rel="stylesheet" href="https://unpkg.com/prewindcss@1.2.1" />
|
|
29
29
|
```
|
|
30
30
|
|
|
31
31
|
### 2. Define your theme variables
|
|
@@ -114,9 +114,10 @@ To generate custom fluid sizes for your project:
|
|
|
114
114
|
```bash
|
|
115
115
|
npx prewindcss text # Generate fluid typography scale
|
|
116
116
|
npx prewindcss space # Generate fluid spacing scale
|
|
117
|
+
npx prewindcss theme # Get default theme CSS variables
|
|
117
118
|
```
|
|
118
119
|
|
|
119
|
-
|
|
120
|
+
The `text` and `space` commands launch an interactive configurator where you can adjust:
|
|
120
121
|
|
|
121
122
|
- Viewport range (min/max)
|
|
122
123
|
- Base size at each viewport
|
package/package.json
CHANGED
package/script/prewindcss.js
CHANGED
|
@@ -6,16 +6,22 @@
|
|
|
6
6
|
* Usage:
|
|
7
7
|
* npx prewindcss text - Generate fluid typography scale
|
|
8
8
|
* npx prewindcss space - Generate fluid spacing scale
|
|
9
|
+
* npx prewindcss theme - Get default theme CSS variables
|
|
9
10
|
*/
|
|
10
11
|
|
|
11
12
|
const command = process.argv[2];
|
|
12
13
|
|
|
13
|
-
if (command ===
|
|
14
|
-
const { run } = await import(
|
|
14
|
+
if (command === "text") {
|
|
15
|
+
const { run } = await import("./text.js");
|
|
15
16
|
run();
|
|
16
|
-
} else if (command ===
|
|
17
|
-
const { run } = await import(
|
|
17
|
+
} else if (command === "space") {
|
|
18
|
+
const { run } = await import("./space.js");
|
|
19
|
+
run();
|
|
20
|
+
} else if (command === "theme") {
|
|
21
|
+
const { run } = await import("./theme.js");
|
|
18
22
|
run();
|
|
19
23
|
} else {
|
|
20
|
-
console.log(
|
|
24
|
+
console.log(
|
|
25
|
+
"Did you mean to run npx prewindcss text, npx prewindcss space, or npx prewindcss theme?",
|
|
26
|
+
);
|
|
21
27
|
}
|
package/script/theme.js
ADDED
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Theme Generator
|
|
3
|
+
*
|
|
4
|
+
* Fetches the default theme CSS from GitHub and copies it to clipboard.
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
const THEME_URL =
|
|
8
|
+
"https://raw.githubusercontent.com/codepilotsf/prewind/refs/heads/main/theme.css";
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* Copy text to the system clipboard.
|
|
12
|
+
* Uses pbcopy on macOS, xclip on Linux, clip on Windows.
|
|
13
|
+
*/
|
|
14
|
+
async function copyToClipboard(text) {
|
|
15
|
+
const { spawn } = await import("child_process");
|
|
16
|
+
const platform = process.platform;
|
|
17
|
+
|
|
18
|
+
let cmd, args;
|
|
19
|
+
if (platform === "darwin") {
|
|
20
|
+
cmd = "pbcopy";
|
|
21
|
+
args = [];
|
|
22
|
+
} else if (platform === "win32") {
|
|
23
|
+
cmd = "clip";
|
|
24
|
+
args = [];
|
|
25
|
+
} else {
|
|
26
|
+
// Linux - try xclip
|
|
27
|
+
cmd = "xclip";
|
|
28
|
+
args = ["-selection", "clipboard"];
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
return new Promise((resolve, reject) => {
|
|
32
|
+
const proc = spawn(cmd, args);
|
|
33
|
+
proc.stdin.write(text);
|
|
34
|
+
proc.stdin.end();
|
|
35
|
+
proc.on("close", resolve);
|
|
36
|
+
proc.on("error", reject);
|
|
37
|
+
});
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
export async function run() {
|
|
41
|
+
try {
|
|
42
|
+
const response = await fetch(THEME_URL);
|
|
43
|
+
if (!response.ok) {
|
|
44
|
+
throw new Error(`Failed to fetch theme: ${response.status}`);
|
|
45
|
+
}
|
|
46
|
+
const css = await response.text();
|
|
47
|
+
|
|
48
|
+
console.log(css);
|
|
49
|
+
console.log("");
|
|
50
|
+
|
|
51
|
+
await copyToClipboard(css);
|
|
52
|
+
console.log("Copied to clipboard!");
|
|
53
|
+
} catch (error) {
|
|
54
|
+
console.error("Error fetching theme:", error.message);
|
|
55
|
+
process.exit(1);
|
|
56
|
+
}
|
|
57
|
+
}
|