91 lines
2.4 KiB
Markdown
91 lines
2.4 KiB
Markdown
# levkin.ca
|
||
|
||
Homepage design concepts for Levkin Inc.
|
||
|
||
**Status:** active. **Production:** [levkin.ca](https://levkin.ca) (`/` → spec, `/folders/` → stack).
|
||
|
||
| Page | Path | Description |
|
||
|------|------|-------------|
|
||
| **Spec** | `/spec/` | Company story as RFC-style documentation |
|
||
| **Folder** | `/stack-folder/` | Manila folders L0–L7, sticky tab stack, site previews |
|
||
|
||
**Production** (`levkin.ca`): `/` → spec, `/folders/` → stack. Dev picker at `/` only when running `npm run dev` (not deployed).
|
||
|
||
## Develop
|
||
|
||
```bash
|
||
npm install
|
||
npm run dev
|
||
```
|
||
|
||
Dev server: `http://localhost:5175` (5173 is often taken by other apps)
|
||
|
||
| Page | URL |
|
||
|------|-----|
|
||
| Home | `/` |
|
||
| Spec | `/spec/` |
|
||
| Folders | `/stack-folder/` |
|
||
|
||
## Build
|
||
|
||
```bash
|
||
npm run build
|
||
# dist/ — Vite multi-page output
|
||
|
||
npm run build:www
|
||
# www/ — production layout for nginx (commit www/ before deploy)
|
||
```
|
||
|
||
### Deploy
|
||
|
||
Deployed to the homelab web LXC via the private ansible repo (see internal docs).
|
||
|
||
## Folder stack (`/stack-folder/`)
|
||
|
||
Eight layers with labeled tabs. Scroll pins earlier tabs on a shared rail; L7 joins last. Scroll stops when all tabs align.
|
||
|
||
- `shared/stack-scroll.js` — scroll depth, fold state, layer jump
|
||
- `stack-folder/folder-rail.js` — side rail
|
||
- `stack-folder/folder-cal.js` — Cal.com embeds
|
||
|
||
### Preview screenshots
|
||
|
||
```bash
|
||
npm run dev # separate terminal
|
||
npm run capture-previews
|
||
```
|
||
|
||
Writes PNGs used in `stack-folder/previews/` (spec, auto, caseware, iliadobkin, git-repos, cal dark/light).
|
||
|
||
### Test
|
||
|
||
```bash
|
||
npm run dev
|
||
STACK_URL=http://localhost:5175/stack-folder/ npm run test:folder
|
||
```
|
||
|
||
Playwright runs **desktop** (tab alignment at max scroll) and **mobile** (bottom tab rail, no horizontal overflow, L3 jump).
|
||
|
||
### Test on a phone
|
||
|
||
Dev server listens on your LAN (`host: true` in Vite config):
|
||
|
||
```bash
|
||
npm run dev
|
||
# open http://<your-lan-ip>:5175/stack-folder/ on the phone (same Wi‑Fi)
|
||
```
|
||
|
||
Production: [levkin.ca/folders/](https://levkin.ca/folders/) — on viewports ≤720px the side rail becomes a **bottom tab bar** (L0–L7) with safe-area padding for iOS.
|
||
|
||
## Related sites
|
||
|
||
- [auto.levkin.ca](https://auto.levkin.ca)
|
||
- [caseware.levkin.ca](https://caseware.levkin.ca)
|
||
- [github.com/Gitilia](https://github.com/Gitilia) (public mirrors)
|
||
- [cal.levkin.ca](https://cal.levkin.ca/ilia/consult)
|
||
- [iliadobkin.com](https://iliadobkin.com)
|
||
|
||
## License
|
||
|
||
Private repo.
|