Skip to content

Commit 34b8985

Browse files
evesteraevestera
committed
Website tweaks
1 parent e39fa64 commit 34b8985

9 files changed

+80
-13
lines changed

‎json_typegen_web/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
66
<link rel="stylesheet"
77
href="https://fonts.googleapis.com/css2?family=Petrona:wght@200..900&family=Ubuntu:wght@300;400;700&family=Ubuntu+Mono:wght@400">
8-
<title>json_typegen</title>
8+
<title>json_typegen - Generate types (Rust, TS, Kotlin, Python, ...) from JSON samples or SQL</title>
99
</head>
1010
<body>
1111
<div id="app"></div>

‎json_typegen_web/package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
"build": "rsw build && vite build",
1111
"preview": "vite build && vite preview",
1212
"deploy": "npm run build && firebase deploy",
13-
"format": "prettier --write src --plugin prettier-plugin-svelte",
13+
"format": "prettier --write src",
1414
"check": "svelte-check --tsconfig ./tsconfig.json"
1515
},
1616
"devDependencies": {

‎json_typegen_web/src/App.svelte

+5-2
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@
2323
import FileInputButton from "./components/FileInputButton.svelte";
2424
import ClipboardDocumentIcon from "./icons/ClipboardDocumentIcon.svelte";
2525
import HighlightedCode from "./components/HighlightedCode.svelte";
26+
import GithubCorner from "./components/GithubCorner.svelte";
2627
2728
const worker = new Worker(new URL("./lib/worker.ts", import.meta.url), {
2829
type: "module",
@@ -77,7 +78,7 @@
7778
downloadLink = getDownloadLinkProps(
7879
output,
7980
message.typename,
80-
message.options["output_mode"],
81+
message.options["output_mode"] as string,
8182
);
8283
isLoading = false;
8384
} else if (message.type === WorkerMessage.LOAD_FILE_COMPLETE) {
@@ -223,7 +224,7 @@
223224
</script>
224225

225226
<Container>
226-
<h1>typegen</h1>
227+
<h1>json_typegen</h1>
227228
<p>
228229
Generate types (Rust, TS, Kotlin, Python, ...) from JSON samples or SQL
229230
</p>
@@ -407,3 +408,5 @@
407408
</Column>
408409
</Row>
409410
</Container>
411+
412+
<GithubCorner />

‎json_typegen_web/src/app.css

+2-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,8 @@ html {
3030
--c2: #a5f3be;
3131
--c3: #8ff0ad;
3232

33-
--_g: var(--c1) 10%, var(--c2) 10.5% 19%, #0000 19.5% 80.5%,
33+
--_g:
34+
var(--c1) 10%, var(--c2) 10.5% 19%, #0000 19.5% 80.5%,
3435
var(--c2) 81% 89.5%, var(--c3) 90%;
3536
--_c: from -90deg at 37.5% 50%, #0000 75%;
3637
--_l1: linear-gradient(145deg, var(--_g));

‎json_typegen_web/src/components/GithubCorner.svelte

+63
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
<a
2+
href="https://github.com/evestera/json_typegen"
3+
class="github-corner"
4+
aria-label="View source on GitHub"
5+
>
6+
<svg
7+
width="80"
8+
height="80"
9+
viewBox="0 0 250 250"
10+
fill="#151513"
11+
style="position: absolute; top: 0; right: 0"
12+
xmlns="http://www.w3.org/2000/svg"
13+
>
14+
<defs>
15+
<clipPath id="octo-arm-clip">
16+
<path
17+
style="-webkit-transform-origin: 130px 104px; transform-origin: 130px 104px"
18+
d="M 130.5481,-165.77759 A 270.05054,270.05054 0 0 0 -139.50195,104.27246 270.05054,270.05054 0 0 0 130.5481,374.3225 270.05054,270.05054 0 0 0 400.59812,104.27246 270.05054,270.05054 0 0 0 130.5481,-165.77759 Z M 120.42236,72.766113 c 0.93743,-0.0063 2.26441,1.324462 2.26441,1.324462 4.05178,4.625078 2.17285,11.053469 2.17285,11.053469 -2.75131,10.431043 5.29968,14.758393 8.93555,16.101076 5.19351,1.3916 1.84837,10.58498 -6.30494,5.87768 -14.52942,-9.369731 -9.27734,-19.598387 -9.27734,-19.598387 3.0951,-6.935854 1.53809,-11.071776 1.53809,-11.071776 -0.55126,-2.870943 -0.0577,-3.681671 0.67138,-3.686524 z"
19+
class="octo-arm"
20+
/>
21+
</clipPath>
22+
</defs>
23+
<path
24+
fill-rule="evenodd"
25+
clip-rule="evenodd"
26+
d="M 250,0 H 0 l 114.46087,114.46086 c 2.33873,2.33874 3.92868,1.90279 5.0744,0.75707 1.00327,-1.00327 4.37184,-4.51252 7.95495,-8.09564 6.30277,-5.87719 0,0 6.30277,-5.87719 3.14963,-2.43916 6.22275,-3.234915 8.50628,-3.100385 -8.52737,-10.53392 -14.82926,-24.286929 1.79375,-40.909948 4.72883,-4.728834 10.30355,-6.891897 16.01543,-7.197887 0.64804,-1.500951 3.59718,-7.437935 11.89155,-11.036879 0,0 4.77368,2.480486 7.36319,16.247564 4.44872,2.554126 8.54157,5.683184 12.17292,9.306429 3.62708,3.627081 6.82243,7.826577 9.30555,12.172039 13.76795,2.590399 16.24844,7.364073 16.24844,7.364073 -3.59894,8.294366 -9.5368,11.24263 -11.03775,11.890669 -0.23476,5.783105 -2.46817,11.287475 -7.19701,16.016305 -16.62302,16.62303 -30.30393,10.24904 -40.98117,1.72254 0.20399,2.92628 -1.02437,6.85583 -5.10869,10.94015 -5.80333,5.80333 -10.53128,10.3906 -11.96365,11.82297 -1.1466,1.1466 -1.5754,2.74368 0.75619,5.07527 L 250,250 Z"
27+
clip-path="url(#octo-arm-clip)"
28+
/>
29+
</svg>
30+
</a>
31+
32+
<style>
33+
.github-corner:hover .octo-arm {
34+
animation: octocat-wave 560ms ease-in-out;
35+
}
36+
37+
@keyframes octocat-wave {
38+
0%,
39+
100% {
40+
transform: rotate(0);
41+
}
42+
43+
20%,
44+
60% {
45+
transform: rotate(-25deg);
46+
}
47+
48+
40%,
49+
80% {
50+
transform: rotate(10deg);
51+
}
52+
}
53+
54+
@media (max-width: 500px) {
55+
.github-corner:hover .octo-arm {
56+
animation: none;
57+
}
58+
59+
.github-corner .octo-arm {
60+
animation: octocat-wave 560ms ease-in-out;
61+
}
62+
}
63+
</style>

‎json_typegen_web/src/components/HighlightedCode.svelte

+3-3
Original file line numberDiff line numberDiff line change
@@ -15,10 +15,10 @@
1515
highlighter.then((highlighter) => {
1616
highlighted = highlighter.codeToHtml(code, {
1717
lang: language,
18-
theme: 'github-light',
18+
theme: "github-light",
1919
colorReplacements: {
20-
'#fff': "rgba(255, 255, 255, 0.8)"
21-
}
20+
"#fff": "rgba(255, 255, 255, 0.8)",
21+
},
2222
});
2323
});
2424
}

‎json_typegen_web/src/components/Textarea.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -27,7 +27,7 @@
2727
on:keyup
2828
bind:this={ref}
2929
{rows}
30-
/>
30+
></textarea>
3131

3232
<style>
3333
textarea {

‎json_typegen_web/src/lib/WorkerMessage.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -13,13 +13,13 @@ export type WorkerMessageType =
1313
type: WorkerMessage.CODEGEN;
1414
input: string;
1515
typename: string;
16-
options: object;
16+
options: Record<string, unknown>;
1717
}
1818
| {
1919
type: WorkerMessage.CODEGEN_COMPLETE;
2020
result: string;
2121
typename: string;
22-
options: object;
22+
options: Record<string, unknown>;
2323
}
2424
| { type: WorkerMessage.LOAD_FILE; file: File }
2525
| { type: WorkerMessage.LOAD_FILE_COMPLETE }

‎json_typegen_web/src/main.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
import "./app.css";
22
import App from "./App.svelte";
3-
import { mount } from 'svelte';
3+
import { mount } from "svelte";
44

55
const app = mount(App, {
6-
target: document.getElementById("app"),
6+
target: document.getElementById("app")!,
77
});
88

99
export default app;

0 commit comments

Comments
 (0)