Skip to content
This repository was archived by the owner on Mar 26, 2026. It is now read-only.

Commit e593abc

Browse files
JasperNoBoxDevclaude
JasperNoBoxDev
and
claude
authored
Add Baseline Proposal Phase 2 (#9)
* Initial commit * Add Collins-inspired NoBoxDev website redesign (#1) Full Next.js 15 rebuild with editorial design: dark hero, capabilities grid, horizontal-scroll case studies with 3D hover effects, philosophy section, contact CTA, and page-level mouse glow effect. Psychology + AI positioning throughout, using Aeonik + Arbeit fonts with coral/purple brand palette. Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> * Add static export and GitHub Pages deployment (#3) Configure Next.js static export with unoptimized images, add GitHub Actions workflow for auto-deploy to GitHub Pages on push to main, and add CNAME for noboxdev.com custom domain. Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> * Switch deployment from GitHub Pages to Cloudflare Pages (#5) Replace GitHub Pages workflow with Cloudflare wrangler deploy. Remove CNAME file (custom domain configured in Cloudflare dashboard). Closes #4 Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> * Fix Cloudflare Pages deploy: create project before first deploy (#6) Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> * Add Baseline V2 proposal website (#7) * Fix Cloudflare Pages deploy: create project before first deploy Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * Add Baseline V2 proposal as scrolling website with inline mockups Rebuild the proposal page from a PDF-style deck into a proper scrolling website with sticky nav, section anchoring, and inline HTML/CSS app mockups. Features password gate, 7 feature sections with phone/web mockup frames, color-varied backgrounds (dark, purple, coral), timeline, pricing table (€15,000), and responsive layout. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com> * Add Baseline Proposal Phase 2 with Baseline-only branding New route at /BaselineProposalPhase2 with all NoBoxDev colors (coral, purple) replaced with Baseline brand palette. Login mockup uses dark Baseline theme. Cover and footer sections use original orange gradient. Polygon mirrored to left side on cover. Nav uses Baseline app icon instead of NoBoxDev logo. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
1 parent 20989e2 commit e593abc

114 files changed

Lines changed: 9745 additions & 0 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.github/workflows/deploy.yml‎

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
name: Deploy to Cloudflare Pages
2+
3+
on:
4+
push:
5+
branches: [main]
6+
7+
jobs:
8+
deploy:
9+
runs-on: ubuntu-latest
10+
steps:
11+
- uses: actions/checkout@v4
12+
- uses: actions/setup-node@v4
13+
with:
14+
node-version: 20
15+
cache: npm
16+
- run: npm ci
17+
- run: npm run build
18+
- name: Create Cloudflare Pages project if needed
19+
run: npx wrangler pages project create noboxdev --production-branch main 2>/dev/null || true
20+
env:
21+
CLOUDFLARE_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}
22+
CLOUDFLARE_ACCOUNT_ID: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
23+
- uses: cloudflare/wrangler-action@v3
24+
with:
25+
apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}
26+
accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}
27+
command: pages deploy out --project-name=noboxdev --commit-dirty=true

‎.gitignore‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2+
3+
# dependencies
4+
/node_modules
5+
/.pnp
6+
.pnp.*
7+
.yarn/*
8+
!.yarn/patches
9+
!.yarn/plugins
10+
!.yarn/releases
11+
!.yarn/versions
12+
13+
# testing
14+
/coverage
15+
16+
# next.js
17+
/.next/
18+
/out/
19+
20+
# production
21+
/build
22+
23+
# misc
24+
.DS_Store
25+
*.pem
26+
27+
# debug
28+
npm-debug.log*
29+
yarn-debug.log*
30+
yarn-error.log*
31+
.pnpm-debug.log*
32+
33+
# env files (can opt-in for committing if needed)
34+
.env*
35+
36+
# vercel
37+
.vercel
38+
39+
# typescript
40+
*.tsbuildinfo
41+
next-env.d.ts

‎README.md‎

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
2+
3+
## Getting Started
4+
5+
First, run the development server:
6+
7+
```bash
8+
npm run dev
9+
# or
10+
yarn dev
11+
# or
12+
pnpm dev
13+
# or
14+
bun dev
15+
```
16+
17+
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
18+
19+
You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
20+
21+
This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
22+
23+
## Learn More
24+
25+
To learn more about Next.js, take a look at the following resources:
26+
27+
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
28+
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
29+
30+
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
31+
32+
## Deploy on Vercel
33+
34+
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
35+
36+
Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.

‎app/BaselineProposalPhase2/components/AboutSection.module.css‎

Lines changed: 141 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,141 @@
1+
.about {
2+
padding: 80px 0;
3+
background: var(--bl-cream);
4+
}
5+
6+
.container {
7+
max-width: 1200px;
8+
margin: 0 auto;
9+
padding: 0 clamp(1.25rem, 3vw, 3rem);
10+
}
11+
12+
.label {
13+
font-family: var(--font-body);
14+
font-size: 0.8rem;
15+
font-weight: 700;
16+
text-transform: uppercase;
17+
letter-spacing: 0.15em;
18+
color: var(--bl-midnight);
19+
margin-bottom: 12px;
20+
display: block;
21+
}
22+
23+
.title {
24+
font-family: var(--font-body);
25+
font-size: clamp(1.75rem, 3vw, 2.5rem);
26+
font-weight: 700;
27+
line-height: 1.15;
28+
margin-bottom: 40px;
29+
color: var(--bl-deep-inhale);
30+
}
31+
32+
.grid {
33+
display: grid;
34+
grid-template-columns: 1fr 1fr;
35+
gap: 64px;
36+
align-items: start;
37+
}
38+
39+
.text p {
40+
font-family: var(--font-body);
41+
font-size: 1rem;
42+
line-height: 1.75;
43+
color: var(--bl-serene-ash);
44+
margin-bottom: 20px;
45+
}
46+
47+
.stats {
48+
display: grid;
49+
grid-template-columns: 1fr 1fr;
50+
gap: 20px;
51+
margin-top: 32px;
52+
}
53+
54+
.stat {
55+
padding: 20px;
56+
background: white;
57+
border-radius: 10px;
58+
border: 1px solid rgba(0, 0, 0, 0.06);
59+
}
60+
61+
.statNum {
62+
font-family: var(--font-display);
63+
font-size: 1.8rem;
64+
font-weight: 400;
65+
color: var(--bl-midnight);
66+
display: block;
67+
margin-bottom: 4px;
68+
}
69+
70+
.statLabel {
71+
font-family: var(--font-body);
72+
font-size: 0.8rem;
73+
color: var(--bl-serene-ash);
74+
}
75+
76+
.imageGallery {
77+
display: grid;
78+
grid-template-columns: 1fr 1fr;
79+
grid-template-rows: 1fr 1fr;
80+
gap: 12px;
81+
}
82+
83+
.galleryImg {
84+
border-radius: 10px;
85+
object-fit: cover;
86+
width: 100%;
87+
height: 180px;
88+
}
89+
90+
.galleryImgTall {
91+
composes: galleryImg;
92+
grid-row: span 2;
93+
height: 100%;
94+
}
95+
96+
.emotions {
97+
display: flex;
98+
gap: 16px;
99+
margin-top: 24px;
100+
flex-wrap: wrap;
101+
}
102+
103+
.emotionChip {
104+
display: flex;
105+
align-items: center;
106+
gap: 8px;
107+
padding: 8px 16px;
108+
background: white;
109+
border-radius: 100px;
110+
border: 1px solid var(--bl-sandstone);
111+
}
112+
113+
.emotionChip span {
114+
font-family: var(--font-body);
115+
font-size: 0.8rem;
116+
color: var(--bl-midnight);
117+
}
118+
119+
@media (max-width: 768px) {
120+
.about {
121+
padding: 48px 0;
122+
}
123+
124+
.grid {
125+
grid-template-columns: 1fr;
126+
gap: 32px;
127+
}
128+
129+
.imageGallery {
130+
grid-template-columns: 1fr 1fr;
131+
}
132+
133+
.galleryImgTall {
134+
grid-row: auto;
135+
height: 180px;
136+
}
137+
138+
.stats {
139+
grid-template-columns: 1fr 1fr;
140+
}
141+
}

‎app/BaselineProposalPhase2/components/AboutSection.tsx‎

Lines changed: 85 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,85 @@
1+
import Image from "next/image";
2+
import styles from "./AboutSection.module.css";
3+
4+
const emotions = [
5+
{ icon: "/images/proposal/emotion-carrying.png", label: "Carrying the Day" },
6+
{ icon: "/images/proposal/emotion-winddown.png", label: "Can't Wind Down" },
7+
{ icon: "/images/proposal/emotion-overstimulated.png", label: "Overstimulated" },
8+
{ icon: "/images/proposal/emotion-restless.png", label: "Restless" },
9+
];
10+
11+
export default function AboutSection() {
12+
return (
13+
<section id="about" className={styles.about}>
14+
<div className={styles.container}>
15+
<span className={styles.label}>About</span>
16+
<h2 className={styles.title}>Baseline V1 — Where We Are</h2>
17+
<div className={styles.grid}>
18+
<div className={styles.text}>
19+
<p>
20+
Baseline is a mental wellness app helping users process emotions through
21+
guided audio meditations. Built as a native iOS app, it currently offers
22+
a library of meditations organised by emotional state.
23+
</p>
24+
<p>
25+
All content is bundled locally — no accounts, no cloud, no analytics.
26+
V1 was designed as a personal tool. V2 transforms it into a connected
27+
platform ready for scale.
28+
</p>
29+
<div className={styles.stats}>
30+
<div className={styles.stat}>
31+
<span className={styles.statNum}>60+</span>
32+
<span className={styles.statLabel}>Guided meditations</span>
33+
</div>
34+
<div className={styles.stat}>
35+
<span className={styles.statNum}>10</span>
36+
<span className={styles.statLabel}>Emotional states</span>
37+
</div>
38+
<div className={styles.stat}>
39+
<span className={styles.statNum}>iOS</span>
40+
<span className={styles.statLabel}>Native SwiftUI</span>
41+
</div>
42+
<div className={styles.stat}>
43+
<span className={styles.statNum}>Local</span>
44+
<span className={styles.statLabel}>All content bundled</span>
45+
</div>
46+
</div>
47+
</div>
48+
<div>
49+
<div className={styles.imageGallery}>
50+
<Image
51+
src="/images/proposal/meditation-1.jpg"
52+
alt="Meditation"
53+
width={400}
54+
height={400}
55+
className={styles.galleryImgTall}
56+
/>
57+
<Image
58+
src="/images/proposal/meditation-2.jpg"
59+
alt="Meditation"
60+
width={400}
61+
height={180}
62+
className={styles.galleryImg}
63+
/>
64+
<Image
65+
src="/images/proposal/meditation-3.jpg"
66+
alt="Meditation"
67+
width={400}
68+
height={180}
69+
className={styles.galleryImg}
70+
/>
71+
</div>
72+
<div className={styles.emotions}>
73+
{emotions.map((e) => (
74+
<div key={e.label} className={styles.emotionChip}>
75+
<Image src={e.icon} alt={e.label} width={24} height={24} />
76+
<span>{e.label}</span>
77+
</div>
78+
))}
79+
</div>
80+
</div>
81+
</div>
82+
</div>
83+
</section>
84+
);
85+
}

0 commit comments

Comments
 (0)