Skip to content

Commit d7f77e9

Browse files
ArmaldioArmaldio
committed
feat: add privacy policy and terms of service pages with a new site footer
1 parent e4b4f61 commit d7f77e9

4 files changed

Lines changed: 396 additions & 1 deletion

File tree

‎src/router/index.ts‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,16 @@ const router = createRouter({
2424
name: 'Contact',
2525
component: () => import('../views/download.vue')
2626
},
27+
{
28+
path: 'privacy',
29+
name: 'Privacy',
30+
component: () => import('../views/privacy.vue')
31+
},
32+
{
33+
path: 'terms',
34+
name: 'Terms',
35+
component: () => import('../views/terms.vue')
36+
},
2737
]
2838
},
2939
{

‎src/views/index.vue‎

Lines changed: 86 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,53 @@
5656
{{ item.label }}
5757
</component>
5858
</div>
59-
<RouterView></RouterView>
59+
<main class="main-content">
60+
<RouterView></RouterView>
61+
</main>
62+
<footer class="footer">
63+
<div class="container">
64+
<div class="grid py-6">
65+
<div class="col-12 md:col-4">
66+
<div class="footer-brand">
67+
<img
68+
height="32"
69+
src="/banner.png"
70+
alt="Pipelab"
71+
class="mb-3"
72+
/>
73+
<p class="text-sm opacity-70">
74+
The visual automation tool for game developers.
75+
</p>
76+
<p class="text-sm opacity-50 mt-4">
77+
© 2026 Pipelab. All rights reserved.
78+
</p>
79+
</div>
80+
</div>
81+
<div class="col-6 md:col-4">
82+
<h4 class="footer-title mb-4">Legal</h4>
83+
<ul class="list-none p-0 m-0">
84+
<li class="mb-2">
85+
<RouterLink :to="{ name: 'Privacy' }" class="footer-link">Privacy Policy</RouterLink>
86+
</li>
87+
<li class="mb-2">
88+
<RouterLink :to="{ name: 'Terms' }" class="footer-link">Terms of Service</RouterLink>
89+
</li>
90+
</ul>
91+
</div>
92+
<div class="col-6 md:col-4">
93+
<h4 class="footer-title mb-4">Support</h4>
94+
<ul class="list-none p-0 m-0">
95+
<li class="mb-2">
96+
<a href="mailto:contact@pipelab.app" class="footer-link">Contact Us</a>
97+
</li>
98+
<li class="mb-2">
99+
<a href="//discord.gg/MzNw26cBb5" target="_blank" rel="noopener" class="footer-link">Community Discord</a>
100+
</li>
101+
</ul>
102+
</div>
103+
</div>
104+
</div>
105+
</footer>
60106
</div>
61107
</template>
62108

@@ -270,6 +316,45 @@ a[disabled="true"] {
270316
color: #666;
271317
pointer-events: none;
272318
}
319+
320+
.main-content {
321+
min-height: 60vh;
322+
}
323+
324+
.footer {
325+
background-color: var(--surface-section);
326+
border-top: 1px solid rgba(0, 0, 0, 0.05);
327+
padding: 2rem 0;
328+
color: var(--text-color);
329+
}
330+
331+
.footer-title {
332+
font-weight: 700;
333+
color: var(--text-color);
334+
text-transform: uppercase;
335+
font-size: 0.875rem;
336+
letter-spacing: 0.05em;
337+
}
338+
339+
.footer-link {
340+
color: var(--text-color);
341+
text-decoration: none;
342+
font-size: 0.95rem;
343+
transition: color 0.2s ease;
344+
opacity: 0.8;
345+
346+
&:hover {
347+
color: var(--primary-color);
348+
opacity: 1;
349+
}
350+
}
351+
352+
.footer-brand {
353+
p {
354+
margin: 0;
355+
line-height: 1.5;
356+
}
357+
}
273358
</style>
274359

275360
<style lang="scss">

‎src/views/privacy.vue‎

Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
<template>
2+
<div class="privacy-page">
3+
<section class="content-section">
4+
<div class="container">
5+
<h1 class="section-title mb-6">Privacy Policy</h1>
6+
<p class="last-updated mb-8">Last Updated: April 21, 2026</p>
7+
8+
<div class="privacy-content">
9+
<section class="mb-8">
10+
<h2 class="mb-4">1. Introduction</h2>
11+
<p>
12+
Welcome to Pipelab. We are committed to protecting your privacy and providing you with a safe automation experience. This Privacy Policy explains how we collect, use, and safeguard your information when you visit our website or use the Pipelab desktop application.
13+
</p>
14+
</section>
15+
16+
<section class="mb-8">
17+
<h2 class="mb-4">2. Information We Collect</h2>
18+
19+
<h3 class="mb-2 mt-4">Website Analytics</h3>
20+
<p>
21+
We collect anonymous website usage statistics to understand how visitors interact with our site. This information is collected in a privacy-respecting manner that does not track personally identifiable information (PII) or use cookies for tracking purposes.
22+
</p>
23+
24+
<h3 class="mb-2 mt-4">Product Analytics & Telemetry</h3>
25+
<p>
26+
To improve our services and prioritize development, we collect telemetry data regarding how you interact with the Pipelab application. This includes feature usage, performance metrics, and general technical information about your device and operating system. You may opt-out of this data collection within the application settings.
27+
</p>
28+
29+
<h3 class="mb-2 mt-4">Account & Infrastructure</h3>
30+
<p>
31+
If you choose to create an account, we collect necessary information such as your email address and authentication credentials. This data is used to provide core services, including account security and optional cloud-sync features.
32+
</p>
33+
34+
<h3 class="mb-2 mt-4">Payments & Sponsorships</h3>
35+
<p>
36+
When you contribute to Pipelab via a sponsorship or subscription, your transaction is handled by a secure third-party payment processor. We receive information about the contribution level and your account association, but we do not store sensitive payment details like credit card numbers on our infrastructure.
37+
</p>
38+
</section>
39+
40+
<section class="mb-8">
41+
<h2 class="mb-4">3. Data Residency & Security</h2>
42+
<p>
43+
Pipelab follows a local-first design philosophy. Most of your data, including automation workflows and encrypted secrets, resides primarily on your local machine.
44+
</p>
45+
<ul class="ml-4 mt-2">
46+
<li><strong>Local Storage:</strong> Your primary data remains under your control on your local device.</li>
47+
<li><strong>Encryption:</strong> Sensitive information (such as API keys or integrations) is encrypted before being stored.</li>
48+
<li><strong>Cloud Sync:</strong> If you explicitly enable synchronization features, your data is transmitted over secure channels and stored in protected environments.</li>
49+
</ul>
50+
</section>
51+
52+
<section class="mb-8">
53+
<h2 class="mb-4">4. Your Rights</h2>
54+
<p>
55+
You have the right to access, correct, or delete your personal data. If you have an account, you can manage your data within the application or by contacting us directly.
56+
</p>
57+
</section>
58+
59+
<section class="mb-8">
60+
<h2 class="mb-4">5. Contact Us</h2>
61+
<p>
62+
If you have any questions about this Privacy Policy, please contact us at:
63+
<br />
64+
<strong>Email:</strong> <a href="mailto:contact@pipelab.app">contact@pipelab.app</a>
65+
</p>
66+
</section>
67+
</div>
68+
</div>
69+
</section>
70+
</div>
71+
</template>
72+
73+
<script setup lang="ts">
74+
// No specific logic needed for the privacy page
75+
</script>
76+
77+
<style lang="scss" scoped>
78+
.privacy-page {
79+
padding-top: 4rem;
80+
padding-bottom: 6rem;
81+
background-color: var(--surface-ground);
82+
min-height: calc(100vh - 80px);
83+
}
84+
85+
.content-section {
86+
.container {
87+
max-width: 800px;
88+
margin: 0 auto;
89+
padding: 0 1.5rem;
90+
}
91+
}
92+
93+
.section-title {
94+
font-size: 3rem;
95+
font-weight: 800;
96+
color: var(--text-color);
97+
}
98+
99+
.last-updated {
100+
color: #666;
101+
font-style: italic;
102+
}
103+
104+
.privacy-content {
105+
line-height: 1.6;
106+
color: var(--text-color);
107+
108+
h2 {
109+
font-size: 1.75rem;
110+
font-weight: 700;
111+
color: var(--primary-color);
112+
}
113+
114+
h3 {
115+
font-size: 1.25rem;
116+
font-weight: 600;
117+
}
118+
119+
p {
120+
margin-bottom: 1rem;
121+
}
122+
123+
ul {
124+
list-style-type: disc;
125+
margin-bottom: 1rem;
126+
127+
li {
128+
margin-bottom: 0.5rem;
129+
}
130+
}
131+
132+
a {
133+
color: var(--primary-color);
134+
text-decoration: none;
135+
font-weight: 500;
136+
137+
&:hover {
138+
text-decoration: underline;
139+
}
140+
}
141+
}
142+
</style>

0 commit comments

Comments
 (0)