privacy policy

Co-Authored-By: Bloxs <[email protected]>
Wave-Studio · Mar 14, 2024 · 5a6a187 · 5a6a187
1 parent 64bbe11
commit 5a6a187
Show file tree

Hide file tree

Showing 7 changed files with 48 additions and 11 deletions.
diff --git a/emails/event.tsx b/emails/event.tsx
@@ -18,7 +18,7 @@ import {
 import * as React from "react";
 import config from "../tailwind.config.ts";
 
-export default function LoginEmail({ otp = "123456" }: { otp: string }) {
+export default function LoginEmail() {
   return (
     <Html>
       <Head>
@@ -64,7 +64,6 @@ export default function LoginEmail({ otp = "123456" }: { otp: string }) {
                 width={232}
                 className="mb-4"
               />
-							{`{{QR-VALUE}}`}
             </Container>
           </Container>
           <Container className="my-8">
@@ -81,6 +80,7 @@ export default function LoginEmail({ otp = "123456" }: { otp: string }) {
             >
               View Event
             </a>
+						<p className="mt-8 text-sm">Buttons not working? Copy and paste this in your browser: {`{{TICKET-LINK}}`}</p>
           </Container>
         </Body>
       </Tailwind>

diff --git a/islands/components/pieces/acceptCookies.tsx b/islands/components/pieces/acceptCookies.tsx
@@ -3,13 +3,36 @@ import Deletion from "@/islands/events/components/delete.tsx";
 import { useSignal } from "@preact/signals";
 
 const Cookies = () => {
-  const open = useSignal(false);
+  const accepted = useSignal(false);
 
-  return (
-    <div class="absolute z-50 bottom-4 right-4 bg-white shadow-lg rounded-md p-4">
-			Test
-		</div>
-  );
+  if (!accepted.value) {
+    return (
+      <div class="fixed z-50 bottom-4 right-4 bg-gray-100 shadow-xl rounded-md p-4 ml-4 flex flex-col">
+        <h2 class="font-semibold">This Website Uses Cookies</h2>
+        <p class="text-sm">
+          Visit the{" "}
+          <a class="underline font-medium" href="/privacy-policy">
+            privacy policy
+          </a>{" "}
+          to learn more
+        </p>
+        <CTA
+          btnType="secondary"
+          btnSize="xs"
+          className="ml-auto mt-2"
+          onClick={() => {
+            accepted.value = true;
+            document.cookie =
+              "accepted-privacy=true; expires=Thu, 18 Dec 2049 12:00:00 UTC; path=/";
+          }}
+        >
+          Got it!
+        </CTA>
+      </div>
+    );
+  }
+
+	return null;
 };
 
 export default Cookies;
diff --git a/out/event.html b/out/event.html
@@ -10,4 +10,4 @@
     * {
       font-family: 'Inter', sans-serif;
     }
-  </style></head><body style="background-color:rgb(255,255,255);color:rgb(31,41,55);text-align:center"><div style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Tickets for the {{EVENT-NAME}} event!<div> ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏</div></div><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;margin-top:2rem;margin-bottom:2rem"><tbody><tr style="width:100%"><td><img alt="Events Logo" height="40" src="https://events.deno.dev/orange-logo.png" style="display:block;outline:none;border:none;text-decoration:none;margin-left:auto;margin-right:auto" width="40"/><h1 class="text" style="margin-top:0.5rem;font-size:1.5rem;line-height:2rem;font-weight:700">Events</h1><h1 style="margin-top:2.5rem;margin-bottom:0px">Your Tickets!</h1><p style="font-size:14px;line-height:24px;margin:16px 0;margin-top:0px">{{EVENT-NAME}}</p><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;background-color:rgb(243,244,246);width:20rem"><tbody><tr style="width:100%"><td><p class="" style="border-width:1px;font-weight:600;color:rgb(55,65,81);font-size:0.875rem;line-height:1.25rem;border-radius:0.375rem;margin-bottom:0.5rem;margin-left:auto;margin-right:auto;margin-top:1rem;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.25rem;padding-bottom:0.25rem">{{TICKETS}} ticket(s)</p><img src="{{QR-VALUE}}" alt="QR Code" width="232" style="margin-bottom:1rem"/>{{QR-VALUE}}</td></tr></tbody></table></td></tr></tbody></table><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;margin-top:2rem;margin-bottom:2rem"><tbody><tr style="width:100%"><td><a href="{{TICKET-LINK}}" class="peer hover:brightness-95 hover:focus:ring-1 hover:focus:brightness-100 disabled:brightness-90 disabled:cursor-not-allowed ring-[#da7351]" style="margin-right:0.75rem;border-radius:0.375rem;font-weight:600;z-index:10;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;background-color:rgb(220,104,67);color:rgb(255,255,255);padding-left:1rem;padding-right:1rem;padding-top:0.5rem;padding-bottom:0.5rem;line-height:100%;text-decoration:none;display:inline-block;max-width:100%;padding:8px 16px 8px 16px" target="_blank"><span><!--[if mso]><i style="letter-spacing: 16px;mso-font-width:-100%;mso-text-raise:12" hidden>&nbsp;</i><![endif]--></span><span style="max-width:100%;display:inline-block;line-height:120%;mso-padding-alt:0px;mso-text-raise:6px">View Ticket</span><span><!--[if mso]><i style="letter-spacing: 16px;mso-font-width:-100%" hidden>&nbsp;</i><![endif]--></span></a><a href="{{EVENT-LINK}}" rel="_blank" class="peer hover:brightness-95 hover:focus:ring-1 hover:focus:brightness-100 disabled:brightness-90 disabled:cursor-not-allowed ring-gray-400/50" style="margin-left:0.75rem;border-radius:0.375rem;font-weight:600;z-index:10;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;background-color:rgb(209,213,219);color:rgb(31,41,55);padding-left:1rem;padding-right:1rem;padding-top:0.5rem;padding-bottom:0.5rem">View Event</a></td></tr></tbody></table></body></html>
+  </style></head><body style="background-color:rgb(255,255,255);color:rgb(31,41,55);text-align:center"><div style="display:none;overflow:hidden;line-height:1px;opacity:0;max-height:0;max-width:0">Tickets for the {{EVENT-NAME}} event!<div> ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏ ‌‍‎‏</div></div><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;margin-top:2rem;margin-bottom:2rem"><tbody><tr style="width:100%"><td><img alt="Events Logo" height="40" src="https://events.deno.dev/orange-logo.png" style="display:block;outline:none;border:none;text-decoration:none;margin-left:auto;margin-right:auto" width="40"/><h1 class="text" style="margin-top:0.5rem;font-size:1.5rem;line-height:2rem;font-weight:700">Events</h1><h1 style="margin-top:2.5rem;margin-bottom:0px">Your Tickets!</h1><p style="font-size:14px;line-height:24px;margin:16px 0;margin-top:0px">{{EVENT-NAME}}</p><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;background-color:rgb(243,244,246);width:20rem"><tbody><tr style="width:100%"><td><p class="" style="border-width:1px;font-weight:600;color:rgb(55,65,81);font-size:0.875rem;line-height:1.25rem;border-radius:0.375rem;margin-bottom:0.5rem;margin-left:auto;margin-right:auto;margin-top:1rem;padding-left:0.5rem;padding-right:0.5rem;padding-top:0.25rem;padding-bottom:0.25rem">{{TICKETS}} ticket(s)</p><img src="{{QR-VALUE}}" alt="QR Code" width="232" style="margin-bottom:1rem"/></td></tr></tbody></table></td></tr></tbody></table><table align="center" width="100%" border="0" cellPadding="0" cellSpacing="0" role="presentation" style="max-width:37.5em;margin-top:2rem;margin-bottom:2rem"><tbody><tr style="width:100%"><td><a href="{{TICKET-LINK}}" class="peer hover:brightness-95 hover:focus:ring-1 hover:focus:brightness-100 disabled:brightness-90 disabled:cursor-not-allowed ring-[#da7351]" style="margin-right:0.75rem;border-radius:0.375rem;font-weight:600;z-index:10;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;background-color:rgb(220,104,67);color:rgb(255,255,255);padding-left:1rem;padding-right:1rem;padding-top:0.5rem;padding-bottom:0.5rem;line-height:100%;text-decoration:none;display:inline-block;max-width:100%;padding:8px 16px 8px 16px" target="_blank"><span><!--[if mso]><i style="letter-spacing: 16px;mso-font-width:-100%;mso-text-raise:12" hidden>&nbsp;</i><![endif]--></span><span style="max-width:100%;display:inline-block;line-height:120%;mso-padding-alt:0px;mso-text-raise:6px">View Ticket</span><span><!--[if mso]><i style="letter-spacing: 16px;mso-font-width:-100%" hidden>&nbsp;</i><![endif]--></span></a><a href="{{EVENT-LINK}}" rel="_blank" class="peer hover:brightness-95 hover:focus:ring-1 hover:focus:brightness-100 disabled:brightness-90 disabled:cursor-not-allowed ring-gray-400/50" style="margin-left:0.75rem;border-radius:0.375rem;font-weight:600;z-index:10;transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;background-color:rgb(209,213,219);color:rgb(31,41,55);padding-left:1rem;padding-right:1rem;padding-top:0.5rem;padding-bottom:0.5rem">View Event</a><p style="margin-top:2rem;font-size:0.875rem;line-height:1.25rem">Buttons not working? Copy and paste this in your browser: {{TICKET-LINK}}</p></td></tr></tbody></table></body></html>
diff --git a/routes/_layout.tsx b/routes/_layout.tsx
@@ -4,6 +4,7 @@ import Navbar from "../components/layout/navbar.tsx";
 import { Partial } from "$fresh/runtime.ts";
 import { getUser } from "@/utils/db/kv.ts";
 import Cookies from "@/islands/components/pieces/acceptCookies.tsx";
+import { getCookies } from "$std/http/cookie.ts";
 
 export default defineLayout(async (req, { Component }) => {
   const user = await getUser(req);
@@ -13,11 +14,12 @@ export default defineLayout(async (req, { Component }) => {
       <Navbar /*f-client-nav*/ user={user} />
       {/* <Partial name="navbar"> */}
       <div className="flex flex-col grow">
+        {!getCookies(req.headers)["accepted-privacy"] && 
+        <Cookies />}
         <Component />
       </div>
       {/* </Partial> */}
       <Footer />
-      <Cookies />
     </div>
   );
 });
diff --git a/routes/api/qr.ts b/routes/api/qr.ts
@@ -16,7 +16,11 @@ export const handler: Handlers = {
     }
 
     if (isTicketUUID(ticket)) {
-      const qrcode = await qr.toBuffer(ticket)
+      const qrcode = await qr.toBuffer(ticket, {
+        color: {
+          light: "#f3f4f6"
+        }
+      })
 
       return new Response(qrcode, {
         headers: {

diff --git a/routes/events/[id]/(no-layout)/index.tsx b/routes/events/[id]/(no-layout)/index.tsx
@@ -15,6 +15,8 @@ import { ClientDate } from "@/islands/events/viewing/dates.tsx";
 import NavbarDropDown from "@/islands/components/pieces/navDropDown.tsx";
 import { Contact } from "@/islands/events/viewing/contact.tsx";
 import MarkdownIt from "npm:markdown-it";
+import Cookies from "@/islands/components/pieces/acceptCookies.tsx";
+import { getCookies } from "$std/http/cookie.ts";
 
 export default defineRoute((req, ctx: RouteContext<void, EventContext>) => {
   const { event, eventID, user } = ctx.state.data;
@@ -276,6 +278,8 @@ export default defineRoute((req, ctx: RouteContext<void, EventContext>) => {
         </p>
         <Footer includeWave={false} />
       </div>
+      {!getCookies(req.headers)["accepted-privacy"] && 
+        <Cookies />}
     </>
   );
 });
diff --git a/routes/events/[id]/(no-layout)/tickets/[tixid].tsx b/routes/events/[id]/(no-layout)/tickets/[tixid].tsx
@@ -11,6 +11,8 @@ import TicketComponent from "../../../../../islands/components/pieces/ticket.tsx
 import CTA from "@/components/buttons/cta.tsx";
 import TicketActions from "@/islands/events/viewing/ticketActions.tsx";
 import NavbarDropDown from "@/islands/components/pieces/navDropDown.tsx";
+import Cookies from "@/islands/components/pieces/acceptCookies.tsx";
+import { getCookies } from "$std/http/cookie.ts";
 
 export default defineRoute(
   async (req, ctx: RouteContext<void, EventContext>) => {
@@ -129,6 +131,8 @@ export default defineRoute(
           <Footer includeWave={false} />
         </div>
         {/* Print buttons and whatnot */}
+        {!getCookies(req.headers)["accepted-privacy"] && 
+        <Cookies />}
       </>
     );
   },