Skip to content

Commit 09b9881

Browse files
feat: update legal page content and styles
- Adjust font sizes for headings and subheadings - Modify breadcrumb margin for better spacing - Add links for Legal Notice, Privacy Policy, and Transparency sections - Enhance disclaimer and analytics descriptions - Update monthly costs section with accurate figures - Improve overall layout and styling for better readability
1 parent c114092 commit 09b9881

1 file changed

Lines changed: 134 additions & 46 deletions

File tree

app/src/pages/LegalPage.tsx

Lines changed: 134 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -23,15 +23,15 @@ export function LegalPage() {
2323
const headingStyle = {
2424
fontFamily: '"MonoLisa", monospace',
2525
fontWeight: 600,
26-
fontSize: '1rem',
26+
fontSize: '1.25rem',
2727
color: '#1f2937',
2828
mb: 2,
2929
};
3030

3131
const subheadingStyle = {
3232
fontFamily: '"MonoLisa", monospace',
3333
fontWeight: 600,
34-
fontSize: '1.1rem',
34+
fontSize: '1rem',
3535
color: '#374151',
3636
mt: 3,
3737
mb: 1,
@@ -57,7 +57,7 @@ export function LegalPage() {
5757
'& .MuiTableCell-root:first-of-type': {
5858
fontWeight: 500,
5959
color: '#374151',
60-
width: '40%',
60+
width: '25%',
6161
},
6262
};
6363

@@ -70,7 +70,19 @@ export function LegalPage() {
7070
<meta property="og:description" content="Legal notice, privacy policy, and transparency information" />
7171
</Helmet>
7272

73-
<Breadcrumb items={[{ label: 'pyplots.ai', to: '/' }, { label: 'legal' }]} sx={{ mb: 4 }} />
73+
<Breadcrumb items={[{ label: 'pyplots.ai', to: '/' }, { label: 'legal' }]} sx={{ mb: 2 }} />
74+
75+
<Box sx={{ mb: 3, display: 'flex', gap: 2, flexWrap: 'wrap', justifyContent: 'center' }}>
76+
<Link href="#legal-notice" sx={{ color: '#3776AB', fontFamily: '"MonoLisa", monospace', fontSize: '0.9rem' }}>
77+
Legal Notice
78+
</Link>
79+
<Link href="#privacy" sx={{ color: '#3776AB', fontFamily: '"MonoLisa", monospace', fontSize: '0.9rem' }}>
80+
Privacy Policy
81+
</Link>
82+
<Link href="#transparency" sx={{ color: '#3776AB', fontFamily: '"MonoLisa", monospace', fontSize: '0.9rem' }}>
83+
Transparency
84+
</Link>
85+
</Box>
7486

7587
<Box sx={{ pb: 4, maxWidth: 1100, mx: 'auto' }}>
7688
{/* Legal Notice */}
@@ -99,9 +111,11 @@ export function LegalPage() {
99111
<Typography sx={textStyle}>
100112
<strong>Disclaimer</strong>
101113
<br />
102-
This is a personal portfolio project, not a commercial service. The content is provided &quot;as is&quot;
103-
without warranty of any kind. Code examples are for educational purposes and should be reviewed before use
104-
in production environments.
114+
This is a personal portfolio project showcasing Python visualization examples, generated and maintained
115+
through AI-powered workflows. All code examples are meant for inspiration and learning – take them as a
116+
starting point, adapt them to your data and requirements, or use AI tools to customize them for your
117+
specific needs. Code is provided &quot;as is&quot; under the MIT License and should be reviewed before
118+
production use.
105119
</Typography>
106120
</Paper>
107121

@@ -116,13 +130,29 @@ export function LegalPage() {
116130

117131
<Typography sx={subheadingStyle}>What We Collect</Typography>
118132
<Typography sx={textStyle}>
119-
<strong>Anonymized Analytics</strong>: We use Plausible Analytics, a privacy-focused analytics tool. It
120-
collects no personal data, uses no cookies, and does not track you across websites. All data is aggregated
121-
and anonymous.
133+
<strong>Anonymized Analytics</strong>: We use{' '}
134+
<Link href="https://plausible.io" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
135+
Plausible Analytics
136+
</Link>
137+
, a privacy-focused analytics tool. It collects no personal data, uses no cookies, and does not track you
138+
across websites. We track: page views, navigation patterns, code copies, image downloads, search queries,
139+
filter usage, and UI interactions. When you share a link, we detect which platform requests the preview
140+
(e.g., LinkedIn, WhatsApp). All data is aggregated and anonymous.
141+
</Typography>
142+
<Typography sx={textStyle}>
143+
<strong>Public Dashboard</strong>: Our analytics are{' '}
144+
<Link href="https://plausible.io/pyplots.ai" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
145+
fully public
146+
</Link>{' '}
147+
– see exactly what we see.
122148
</Typography>
123149
<Typography sx={textStyle}>
124-
<strong>Server Logs</strong>: Temporary technical logs (anonymized IP addresses) are retained for up to 30
125-
days for security and debugging purposes.
150+
<strong>Server Logs</strong>: Technical server logs including IP addresses, request URLs, and user agents
151+
are retained for 30 days via{' '}
152+
<Link href="https://cloud.google.com/logging" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
153+
Google Cloud Logging
154+
</Link>{' '}
155+
for security and debugging purposes.
126156
</Typography>
127157

128158
<Typography sx={subheadingStyle}>What We Do NOT Collect</Typography>
@@ -131,15 +161,10 @@ export function LegalPage() {
131161
<br />
132162
• No personal data (names, emails, etc.)
133163
<br />
134-
• No cookies (except technically necessary session cookies)
164+
• No cookies at all (we use localStorage for UI preferences only)
135165
<br /><strong>No AI training</strong>: Your interactions are not used to train AI models
136166
</Typography>
137167

138-
<Typography sx={textStyle}>
139-
<strong>Analytics</strong>: Filter selections and search terms are tracked anonymously via Plausible
140-
Analytics for usage statistics. This data is aggregated and cannot be linked to individual users.
141-
</Typography>
142-
143168
<Typography sx={textStyle}>
144169
<strong>Contributors</strong>: If you suggest a plot type via GitHub, your GitHub username may be credited
145170
in the specification metadata. This is public information from your GitHub profile.
@@ -193,41 +218,109 @@ export function LegalPage() {
193218
<Table sx={tableStyle}>
194219
<TableBody>
195220
<TableRow>
196-
<TableCell>Typography</TableCell>
221+
<TableCell>Editor</TableCell>
197222
<TableCell>
198-
<Link href="https://www.monolisa.dev/" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
199-
MonoLisa
200-
</Link>{' '}
201-
by Marcus Sterz
223+
<Link href="https://www.jetbrains.com/pycharm/" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
224+
JetBrains PyCharm
225+
</Link>
202226
</TableCell>
203227
</TableRow>
204228
<TableRow>
205229
<TableCell>Frontend</TableCell>
206-
<TableCell>React 19, Vite, MUI 7, TypeScript</TableCell>
230+
<TableCell>
231+
<Link href="https://react.dev" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
232+
React
233+
</Link>{' '}
234+
19,{' '}
235+
<Link href="https://vite.dev" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
236+
Vite
237+
</Link>
238+
,{' '}
239+
<Link href="https://mui.com" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
240+
MUI
241+
</Link>{' '}
242+
7,{' '}
243+
<Link href="https://typescriptlang.org" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
244+
TypeScript
245+
</Link>
246+
</TableCell>
207247
</TableRow>
208248
<TableRow>
209249
<TableCell>Backend</TableCell>
210-
<TableCell>Python 3.13, FastAPI, SQLAlchemy</TableCell>
250+
<TableCell>
251+
<Link href="https://python.org" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
252+
Python
253+
</Link>{' '}
254+
3.13,{' '}
255+
<Link href="https://fastapi.tiangolo.com" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
256+
FastAPI
257+
</Link>
258+
,{' '}
259+
<Link href="https://sqlalchemy.org" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
260+
SQLAlchemy
261+
</Link>
262+
</TableCell>
211263
</TableRow>
212264
<TableRow>
213265
<TableCell>Database</TableCell>
214-
<TableCell>PostgreSQL</TableCell>
266+
<TableCell>
267+
<Link href="https://postgresql.org" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
268+
PostgreSQL
269+
</Link>{' '}
270+
18
271+
</TableCell>
215272
</TableRow>
216273
<TableRow>
217274
<TableCell>Hosting</TableCell>
218-
<TableCell>Google Cloud Run (Netherlands)</TableCell>
275+
<TableCell>
276+
<Link href="https://cloud.google.com/run" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
277+
Google Cloud Run
278+
</Link>{' '}
279+
(Netherlands)
280+
</TableCell>
219281
</TableRow>
220282
<TableRow>
221283
<TableCell>Storage</TableCell>
222-
<TableCell>Google Cloud Storage</TableCell>
284+
<TableCell>
285+
<Link href="https://cloud.google.com/storage" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
286+
Google Cloud Storage
287+
</Link>
288+
</TableCell>
223289
</TableRow>
224290
<TableRow>
225291
<TableCell>Analytics</TableCell>
226-
<TableCell>Plausible (privacy-friendly, no cookies)</TableCell>
292+
<TableCell>
293+
<Link href="https://plausible.io" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
294+
Plausible
295+
</Link>{' '}
296+
(privacy-friendly, no cookies,{' '}
297+
<Link href="https://plausible.io/pyplots.ai" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
298+
public dashboard
299+
</Link>
300+
)
301+
</TableCell>
302+
</TableRow>
303+
<TableRow>
304+
<TableCell>Code Generation</TableCell>
305+
<TableCell>
306+
<Link href="https://anthropic.com" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
307+
Anthropic Claude
308+
</Link>{' '}
309+
(code generation &amp; review),{' '}
310+
<Link href="https://github.com/features/copilot" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
311+
GitHub Copilot
312+
</Link>{' '}
313+
(PR reviews)
314+
</TableCell>
227315
</TableRow>
228316
<TableRow>
229-
<TableCell>AI</TableCell>
230-
<TableCell>Anthropic Claude via Claude Max (code generation &amp; review)</TableCell>
317+
<TableCell>Typography</TableCell>
318+
<TableCell>
319+
<Link href="https://www.monolisa.dev/" target="_blank" rel="noopener" sx={{ color: '#3776AB' }}>
320+
MonoLisa
321+
</Link>{' '}
322+
by Marcus Sterz
323+
</TableCell>
231324
</TableRow>
232325
</TableBody>
233326
</Table>
@@ -241,7 +334,7 @@ export function LegalPage() {
241334
</Link>
242335
</Typography>
243336

244-
<Typography sx={subheadingStyle}>Monthly Costs (approximate)</Typography>
337+
<Typography sx={subheadingStyle}>Monthly Hosting Costs (approximate)</Typography>
245338
<Table sx={tableStyle}>
246339
<TableBody>
247340
<TableRow>
@@ -250,40 +343,35 @@ export function LegalPage() {
250343
</TableRow>
251344
<TableRow>
252345
<TableCell>Cloud SQL</TableCell>
253-
<TableCell>~$40</TableCell>
346+
<TableCell>~$10</TableCell>
254347
</TableRow>
255348
<TableRow>
256349
<TableCell>Cloud Storage</TableCell>
257-
<TableCell>~$5</TableCell>
258-
</TableRow>
259-
<TableRow>
260-
<TableCell>Plausible Analytics</TableCell>
261-
<TableCell>~$9</TableCell>
350+
<TableCell>~$1</TableCell>
262351
</TableRow>
263352
<TableRow>
264353
<TableCell>Domain (.ai)</TableCell>
265354
<TableCell>~$8</TableCell>
266355
</TableRow>
267-
<TableRow>
268-
<TableCell>Claude Max</TableCell>
269-
<TableCell>~$100 (shared)</TableCell>
270-
</TableRow>
271356
<TableRow>
272357
<TableCell>
273358
<strong>Total</strong>
274359
</TableCell>
275360
<TableCell>
276-
<strong>~$177/month</strong>
361+
<strong>~$34/month</strong>
277362
</TableCell>
278363
</TableRow>
279364
</TableBody>
280365
</Table>
281366
<Typography sx={{ ...textStyle, fontSize: '0.8rem', color: '#9ca3af', mt: 1 }}>
282-
Claude Max subscription is shared across projects.
283-
<br />
284-
All costs are currently covered privately. Last updated: January 2026.
367+
Direct hosting costs only. Subscriptions (GitHub Pro, Plausible, Claude MAX, PyCharm, etc.) are shared
368+
across projects. All costs are currently covered privately.
285369
</Typography>
286370
</Paper>
371+
372+
<Typography sx={{ textAlign: 'center', fontSize: '0.8rem', color: '#9ca3af', mt: 2 }}>
373+
Last updated: January 2026
374+
</Typography>
287375
</Box>
288376

289377
<Footer onTrackEvent={trackEvent} />

0 commit comments

Comments
 (0)