@myxo-victor/chexjs 6.0.0
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/ChexJs/.htaccess +9 -0
- package/ChexJs/Chex.js +712 -0
- package/ChexJs/Chex.php +354 -0
- package/ChexJs/Chex_notify.php +68 -0
- package/ChexJs/LICENSE +22 -0
- package/ChexJs/README.md +121 -0
- package/ChexJs/api/read.txt +4 -0
- package/ChexJs/app/api/api.txt +4 -0
- package/ChexJs/app/components/main.js +4 -0
- package/ChexJs/app/index.css +12 -0
- package/ChexJs/app/index.html +28 -0
- package/ChexJs/app/logic/app.js +4 -0
- package/ChexJs/components/demo.js +45 -0
- package/ChexJs/components/main.js +609 -0
- package/ChexJs/images/logo.png +0 -0
- package/ChexJs/index.css +118 -0
- package/ChexJs/index.html +44 -0
- package/ChexJs/libs/modal.js +617 -0
- package/ChexJs/libs/orbit.js +217 -0
- package/ChexJs/libs/racket.js +374 -0
- package/ChexJs/libs/rinx.js +88 -0
- package/ChexJs/libs/scrollEcho.js +212 -0
- package/ChexJs/libs/skeleton.js +341 -0
- package/ChexJs/libs/smooth.js +647 -0
- package/ChexJs/logic/app.js +36 -0
- package/ChexJs/notification_handler.txt +1 -0
- package/ChexJs/sw.js +67 -0
- package/package.json +12 -0
package/ChexJs/index.css
ADDED
|
@@ -0,0 +1,118 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Chex — global stylesheet
|
|
3
|
+
Load this before main.js runs. Page-specific styles (the welcome page)
|
|
4
|
+
are injected by main.js itself and reference the tokens defined here.
|
|
5
|
+
|
|
6
|
+
Recommended fonts — add these to your <head> rather than @import,
|
|
7
|
+
so they aren't render-blocking:
|
|
8
|
+
|
|
9
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
10
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
11
|
+
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=Inter:wght@400;500;600&family=JetBrains+Mono:wght@400;500;600&display=swap" rel="stylesheet">
|
|
12
|
+
*/
|
|
13
|
+
|
|
14
|
+
:root {
|
|
15
|
+
/* surfaces */
|
|
16
|
+
--chex-bg: #0a0a0c;
|
|
17
|
+
--chex-surface: #131316;
|
|
18
|
+
--chex-surface-2: #1a1a1f;
|
|
19
|
+
--chex-border: rgba(255, 255, 255, 0.08);
|
|
20
|
+
--chex-border-strong: rgba(255, 255, 255, 0.16);
|
|
21
|
+
|
|
22
|
+
/* text */
|
|
23
|
+
--chex-text: #f4f4f2;
|
|
24
|
+
--chex-text-dim: #a3a3ab;
|
|
25
|
+
--chex-text-faint: #5c5c66;
|
|
26
|
+
|
|
27
|
+
/* brand */
|
|
28
|
+
--chex-accent: rgb(47, 47, 248);
|
|
29
|
+
--chex-accent-dim: #9fd132;
|
|
30
|
+
--chex-accent-ink: white;
|
|
31
|
+
--chex-accent-2: #ff6b57;
|
|
32
|
+
|
|
33
|
+
/* type */
|
|
34
|
+
--chex-font-display: 'Space Grotesk', 'Inter', system-ui, sans-serif;
|
|
35
|
+
--chex-font-body: 'Inter', system-ui, -apple-system, sans-serif;
|
|
36
|
+
--chex-font-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, Consolas, monospace;
|
|
37
|
+
|
|
38
|
+
--chex-radius-sm: 8px;
|
|
39
|
+
--chex-radius-md: 14px;
|
|
40
|
+
--chex-radius-lg: 24px;
|
|
41
|
+
}
|
|
42
|
+
|
|
43
|
+
*, *::before, *::after {
|
|
44
|
+
box-sizing: border-box;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
html {
|
|
48
|
+
-webkit-text-size-adjust: 100%;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
body {
|
|
52
|
+
margin: 0;
|
|
53
|
+
min-width: 320px;
|
|
54
|
+
background: var(--chex-bg);
|
|
55
|
+
color: var(--chex-text);
|
|
56
|
+
font-family: var(--chex-font-body);
|
|
57
|
+
line-height: 1.6;
|
|
58
|
+
-webkit-font-smoothing: antialiased;
|
|
59
|
+
text-rendering: optimizeLegibility;
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
h1, h2, h3, h4 {
|
|
63
|
+
margin: 0;
|
|
64
|
+
font-family: var(--chex-font-display);
|
|
65
|
+
color: var(--chex-text);
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
p {
|
|
69
|
+
margin: 0;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
a {
|
|
73
|
+
color: inherit;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
img {
|
|
77
|
+
max-width: 100%;
|
|
78
|
+
display: block;
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
button {
|
|
82
|
+
font-family: inherit;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
code, pre {
|
|
86
|
+
font-family: var(--chex-font-mono);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
::selection {
|
|
90
|
+
background: rgba(201, 255, 63, 0.28);
|
|
91
|
+
color: var(--chex-text);
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
:focus-visible {
|
|
95
|
+
outline: 2px solid var(--chex-accent);
|
|
96
|
+
outline-offset: 2px;
|
|
97
|
+
}
|
|
98
|
+
|
|
99
|
+
::-webkit-scrollbar {
|
|
100
|
+
width: 10px;
|
|
101
|
+
height: 10px;
|
|
102
|
+
}
|
|
103
|
+
::-webkit-scrollbar-track {
|
|
104
|
+
background: var(--chex-bg);
|
|
105
|
+
}
|
|
106
|
+
::-webkit-scrollbar-thumb {
|
|
107
|
+
background: var(--chex-border-strong);
|
|
108
|
+
border-radius: 999px;
|
|
109
|
+
}
|
|
110
|
+
::-webkit-scrollbar-thumb:hover {
|
|
111
|
+
background: var(--chex-text-faint);
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
.logo{
|
|
115
|
+
width: 40px;
|
|
116
|
+
height: auto;
|
|
117
|
+
border-radius: 6px;
|
|
118
|
+
}
|
|
@@ -0,0 +1,44 @@
|
|
|
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, maximum-scale=1.0, user-scalable=no">
|
|
6
|
+
|
|
7
|
+
<meta name="title" content="Chex — Fast JavaScript UI">
|
|
8
|
+
<meta name="description" content="Chex is a lightweight JavaScript UI engine with a fast, concise component API.">
|
|
9
|
+
<meta name="keywords" content="Chex, ChexJs, JavaScript framework, reactive UI, components, frontend">
|
|
10
|
+
|
|
11
|
+
<meta property="og:title" content="Chex — Fast JavaScript UI">
|
|
12
|
+
<meta property="og:description" content="Build reactive UI faster with Chex.">
|
|
13
|
+
<meta property="og:image:width" content="1200">
|
|
14
|
+
<meta property="og:image:height" content="630">
|
|
15
|
+
|
|
16
|
+
<title>Chex — Fast JavaScript UI</title>
|
|
17
|
+
<link rel="stylesheet" href="index.css">
|
|
18
|
+
<script src="./Chex.js"></script>
|
|
19
|
+
<!-- Chex stand-alone libraries -->
|
|
20
|
+
<script src="./libs/scrollEcho.js"></script>
|
|
21
|
+
<script src="./libs/racket.js"></script>
|
|
22
|
+
<script src="./libs/orbit.js"></script>
|
|
23
|
+
<script src="./libs/rinx.js"></script>
|
|
24
|
+
<script src="./libs/smooth.js"></script>
|
|
25
|
+
<script src="./libs/modal.js"></script>
|
|
26
|
+
<script src="./libs/skeleton.js"></script>
|
|
27
|
+
|
|
28
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
29
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
30
|
+
<link href="https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100..700;1,100..700&display=swap" rel="stylesheet">
|
|
31
|
+
<link rel="icon" href="./images/logo.png" type="image/png">
|
|
32
|
+
<meta name="theme-color" content="#0f766e">
|
|
33
|
+
|
|
34
|
+
<style>
|
|
35
|
+
h1, h2, h3, h4, h5, h6, p, span, li, a, button {
|
|
36
|
+
font-family: "IBM Plex Sans", sans-serif;
|
|
37
|
+
}
|
|
38
|
+
</style>
|
|
39
|
+
</head>
|
|
40
|
+
<body>
|
|
41
|
+
<div id="app"></div>
|
|
42
|
+
<script src="./components/main.js"></script>
|
|
43
|
+
</body>
|
|
44
|
+
</html>
|