Skip to content

Commit 9af528b

Browse files
committed
setting up docs
1 parent c1d7700 commit 9af528b

18 files changed

+241
-97
lines changed

.prettierrc

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,13 @@
44
"tabWidth": 2,
55
"printWidth": 120,
66
"plugins": ["prettier-plugin-organize-imports"],
7-
"htmlWhitespaceSensitivity": "ignore"
7+
"htmlWhitespaceSensitivity": "ignore",
8+
"overrides": [
9+
{
10+
"files": "*.analog",
11+
"options": {
12+
"parser": "angular"
13+
}
14+
}
15+
]
816
}

.ws-context

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"framework": "angular",
3+
"angular-template-syntax": "V_17",
4+
"apps/**/*.analog": {
5+
"framework": "angular",
6+
"angular-template-syntax": "V_17"
7+
}
8+
}
9+

apps/docs/index.html

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,11 +2,17 @@
22
<html lang="en">
33
<head>
44
<meta charset="utf-8" />
5-
<title>MyApp</title>
5+
<title>Angular Three</title>
66
<base href="/" />
77
<meta name="viewport" content="width=device-width, initial-scale=1" />
88
<link rel="icon" type="image/x-icon" href="/favicon.ico" />
99
<link rel="stylesheet" href="/src/styles.css" />
10+
<link rel="preconnect" href="https://fonts.googleapis.com" />
11+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
12+
<link
13+
href="https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap"
14+
rel="stylesheet"
15+
/>
1016
</head>
1117
<body>
1218
<docs-root></docs-root>

apps/docs/package.json

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
11
{
2-
"type": "module"
2+
"type": "module",
3+
"web-types": [
4+
"../../node_modules/angular-three/web-types.json",
5+
"../../node_modules/angular-three-soba/web-types.json"
6+
]
37
}

apps/docs/public/ngt-logo.svg

Lines changed: 12 additions & 0 deletions
Loading

apps/docs/src/app/app.component.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { RouterOutlet } from '@angular/router';
66
standalone: true,
77
imports: [RouterOutlet],
88
template: `
9-
<router-outlet></router-outlet>
9+
<router-outlet />
1010
`,
1111
})
1212
export class AppComponent {}
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<script lang="ts">
2+
import TopNavigationBar from './(home)/top-navigation-bar.analog' with { analog: 'imports' };
3+
import Experience from './(home)/experience/experience.analog' with { analog: 'imports' };
4+
</script>
5+
6+
<template class="h-screen">
7+
<TopNavigationBar />
8+
<Experience />
9+
</template>

apps/docs/src/app/pages/(home).page.ts

Lines changed: 0 additions & 13 deletions
This file was deleted.
Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
<script lang="ts">
2+
let count = 0;
3+
4+
function increment() {
5+
count++;
6+
}
7+
</script>
8+
9+
<template class="flex min-h-screen flex-col text-zinc-900 bg-zinc-50 px-4 pt-8 pb-32">
10+
<main class="flex-1 mx-auto">
11+
<section class="space-y-6 pb-8 pt-6 md:pb-12 md:pt-10 lg:py-32">
12+
<div class="flex max-w-[64rem] flex-col items-center gap-4 text-center">
13+
<img
14+
class="h-12 w-12"
15+
src="https://analogjs.org/img/logos/analog-logo.svg"
16+
alt="AnalogJs logo. Two red triangles and a white analog wave in front"
17+
/>
18+
<a
19+
class="rounded-2xl bg-zinc-200 px-4 py-1.5 text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2"
20+
target="_blank"
21+
href="https://twitter.com/analogjs"
22+
>
23+
Follow along on Twitter
24+
</a>
25+
<h1 class="font-heading font-medium text-3xl sm:text-5xl md:text-6xl lg:text-7xl">
26+
<span class="text-[#DD0031]">Analog.</span>
27+
The fullstack Angular meta-framework
28+
</h1>
29+
<p class="max-w-[42rem] leading-normal text-muted-foreground sm:text-xl sm:leading-8">
30+
Analog is for building applications and websites with Angular.
31+
<br />
32+
Powered by Vite.
33+
</p>
34+
<div class="space-x-4">
35+
<a
36+
class="inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background bg-zinc-950 text-zinc-50 hover:bg-zinc-950/90 h-11 px-8 rounded-md"
37+
href="https://analogjs.org"
38+
>
39+
Read the docs
40+
</a>
41+
<a
42+
target="_blank"
43+
rel="noreferrer"
44+
class="inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background border border-input hover:bg-zinc-100 hover:text-zinc-950 h-11 px-8 rounded-md"
45+
href="https://github.com/analogjs/analog"
46+
>
47+
Star on GitHub
48+
</a>
49+
</div>
50+
</div>
51+
</section>
52+
<section id="counter-demo" class="container py-8 md:py-12 lg:py-24">
53+
<div class="mx-auto flex max-w-[58rem] flex-col items-center justify-center gap-4 text-center">
54+
<h2 class="text-[#DD0031] font-medium text-3xl leading-[1.1]">Counter</h2>
55+
<p class="max-w-[85%] leading-normal text-muted-foreground sm:text-lg sm:leading-7">
56+
This is a simple interactive counter. Powered by Angular.
57+
</p>
58+
<button
59+
(click)="increment()"
60+
class="inline-flex items-center justify-center text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:opacity-50 disabled:pointer-events-none ring-offset-background border border-input hover:bg-zinc-100 hover:text-zinc-950 h-11 px-8 rounded-md"
61+
>
62+
Count:
63+
<span class="ml-1 font-mono">{{ count }}</span>
64+
</button>
65+
</div>
66+
</section>
67+
</main>
68+
</template>
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<script lang="ts">
2+
import { NgtCanvas } from 'angular-three' with { analog: 'imports' };
3+
import Scene from './scene.analog';
4+
5+
defineMetadata({
6+
exposes: [Scene],
7+
});
8+
</script>
9+
10+
<template>
11+
<ngt-canvas [sceneGraph]="Scene" />
12+
</template>
Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
<script lang="ts">
2+
import { CUSTOM_ELEMENTS_SCHEMA, ElementRef, viewChild } from '@angular/core';
3+
import { extend, injectBeforeRender } from 'angular-three';
4+
import * as THREE from 'three';
5+
6+
import { NgtsSky } from 'angular-three-soba/staging' with { analog: 'imports' };
7+
8+
defineMetadata({
9+
schemas: [CUSTOM_ELEMENTS_SCHEMA],
10+
});
11+
12+
extend(THREE);
13+
14+
const meshRef = viewChild.required<ElementRef<THREE.Mesh>>('mesh');
15+
16+
injectBeforeRender(() => {
17+
const mesh = meshRef().nativeElement;
18+
mesh.rotation.x += 0.01;
19+
mesh.rotation.y += 0.01;
20+
});
21+
</script>
22+
23+
<template>
24+
<ngts-sky />
25+
</template>
Lines changed: 58 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,58 @@
1+
<script lang="ts"></script>
2+
3+
<template>
4+
<header class="fixed w-full p-4 z-20 bg-white">
5+
<nav class="flex items-center justify-between mx-auto max-w-full md:max-w-screen-md lg:max-w-screen-lg">
6+
<!-- logo -->
7+
<a class="flex-grow basis-0 inline-flex items-center gap-2 p-2">
8+
<img src="./ngt-logo.svg" class="w-8 h-8" />
9+
<span class="font-light">Angular Three</span>
10+
</a>
11+
12+
<ul class="inline-flex items-center justify-between gap-4 py-1 px-6 border border-slate-800 rounded-full">
13+
<li
14+
class="font-light text-sm cursor-pointer hover:bg-slate-700 hover:text-white transition-colors rounded-full py-2 px-4"
15+
>
16+
<a>Docs</a>
17+
</li>
18+
<li
19+
class="font-light text-sm cursor-pointer hover:bg-slate-700 hover:text-white transition-colors rounded-full py-2 px-4"
20+
>
21+
<a>Blog</a>
22+
</li>
23+
<li
24+
class="font-light text-sm cursor-pointer hover:bg-slate-700 hover:text-white transition-colors rounded-full py-2 px-4"
25+
>
26+
<a>Showcase</a>
27+
</li>
28+
<li
29+
class="font-light text-sm cursor-pointer hover:bg-slate-700 hover:text-white transition-colors rounded-full py-2 px-4"
30+
>
31+
<a>Stackblitz</a>
32+
</li>
33+
</ul>
34+
35+
<section class="flex-grow basis-0 inline-flex items-center justify-end gap-4">
36+
<a class="cursor-pointer" href="https://twitter.com" target="_blank" rel="noreferrer">
37+
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 512 512">
38+
<path
39+
d="M313.8 303.9L469 32H365L209.4 303.8a1.35 1.35 0 000 1.7l98.9 173.8c.4.7.8.7 1.6.7H413l-99.3-174.7a1.74 1.74 0 01.1-1.4zM221.9 216.2L163 113a2 2 0 00-2-1H65l58.9 104.4a1.13 1.13 0 01.1.8L43 352h96.8a1.54 1.54 0 001.6-.9l80.5-133.7a2.44 2.44 0 000-1.2z"
40+
/>
41+
</svg>
42+
</a>
43+
<a
44+
class="cursor-pointer"
45+
href="https://github.com/angular-threejs/angular-three"
46+
target="_blank"
47+
rel="noreferrer"
48+
>
49+
<svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6" viewBox="0 0 512 512">
50+
<path
51+
d="M256 32C132.3 32 32 134.9 32 261.7c0 101.5 64.2 187.5 153.2 217.9a17.56 17.56 0 003.8.4c8.3 0 11.5-6.1 11.5-11.4 0-5.5-.2-19.9-.3-39.1a102.4 102.4 0 01-22.6 2.7c-43.1 0-52.9-33.5-52.9-33.5-10.2-26.5-24.9-33.6-24.9-33.6-19.5-13.7-.1-14.1 1.4-14.1h.1c22.5 2 34.3 23.8 34.3 23.8 11.2 19.6 26.2 25.1 39.6 25.1a63 63 0 0025.6-6c2-14.8 7.8-24.9 14.2-30.7-49.7-5.8-102-25.5-102-113.5 0-25.1 8.7-45.6 23-61.6-2.3-5.8-10-29.2 2.2-60.8a18.64 18.64 0 015-.5c8.1 0 26.4 3.1 56.6 24.1a208.21 208.21 0 01112.2 0c30.2-21 48.5-24.1 56.6-24.1a18.64 18.64 0 015 .5c12.2 31.6 4.5 55 2.2 60.8 14.3 16.1 23 36.6 23 61.6 0 88.2-52.4 107.6-102.3 113.3 8 7.1 15.2 21.1 15.2 42.5 0 30.7-.3 55.5-.3 63 0 5.4 3.1 11.5 11.4 11.5a19.35 19.35 0 004-.4C415.9 449.2 480 363.1 480 261.7 480 134.9 379.7 32 256 32z"
52+
/>
53+
</svg>
54+
</a>
55+
</section>
56+
</nav>
57+
</header>
58+
</template>

apps/docs/src/app/pages/analog-welcome.component.ts

Lines changed: 0 additions & 75 deletions
This file was deleted.

apps/docs/tailwind.config.cjs

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,16 @@
11
const { createGlobPatternsForDependencies } = require('@nx/angular/tailwind');
22
const { join } = require('node:path');
3+
const defaultTheme = require('tailwindcss/defaultTheme')
34

45
/** @type {import('tailwindcss').Config} */
56
module.exports = {
6-
content: [join(__dirname, 'src/**/!(*.stories|*.spec).{ts,html}'), ...createGlobPatternsForDependencies(__dirname)],
7+
content: [join(__dirname, 'src/**/!(*.stories|*.spec).{ts,html,analog}'), ...createGlobPatternsForDependencies(__dirname)],
78
theme: {
8-
extend: {},
9+
fontFamily: {
10+
sans: [ 'Noto Sans', ...defaultTheme.fontFamily.sans],
11+
},
12+
extend: {
13+
},
914
},
1015
plugins: [],
1116
};

apps/docs/vite.config.ts

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,19 @@ export default defineConfig(({ mode }) => {
1919
allow: ['.'],
2020
},
2121
},
22-
plugins: [analog(), nxViteTsPaths(), splitVendorChunkPlugin()],
22+
plugins: [
23+
analog({
24+
ssr: false,
25+
vite: {
26+
experimental: {
27+
supportAnalogFormat: true,
28+
},
29+
},
30+
}),
31+
nxViteTsPaths({
32+
debug: true,
33+
}),
34+
splitVendorChunkPlugin(),
35+
],
2336
};
2437
});

apps/kitchen-sink/src/app/cannon/chain/experience.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,7 @@ export class StaticHandle {
211211
<app-pointer-handle [size]="1.5">
212212
<app-chain [length]="7" />
213213
</app-pointer-handle>
214+
214215
@for (maxMultiplier of maxMultiplierExamples(); track maxMultiplier.key) {
215216
<app-static-handle [radius]="1.5" [position]="maxMultiplier.position">
216217
<app-chain [maxMultiplier]="maxMultiplier.value" [length]="8" />

libs/soba/src/abstractions/grid.stories.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,6 @@ type SuzanneGLTF = GLTF & {
3030
</ngt-mesh>
3131
}
3232
`,
33-
3433
schemas: [CUSTOM_ELEMENTS_SCHEMA],
3534
changeDetection: ChangeDetectionStrategy.OnPush,
3635
})

0 commit comments

Comments
 (0)