Production Update - Nov 27, 2021

Review threads live on the whole diff, not on one commit, so none are shown here - a thread's line means something in the branch's final form, and painting it into an intermediate step would put it on code it is not about.

src/components/AppFooter.vuemodified+21-15

Changes to src/components/AppFooter.vue

		⋯146 linesShow the 146 lines above this hunk@@ -147,34 +147,40 @@
147	147	<h3 class="mb-8 text-center text-white">Connect</h3>
148	148	<div class="flex justify-center mb-4">
149	149	<ul class="grid grid-cols-3 gap-1 lg:gap-3 xl:gap-4">
150		- <li
151		- class="flex items-center justify-center border rounded-full border-gray-5 md:w-10 md:h-10 lg:w-12 lg:h-12"
152		- >
153		- <a :href="social.discord" target="_blank" class="block">
	150	+ <li class="flex items-center justify-center">
	151	+ <a
	152	+ :href="social.discord"
	153	+ target="_blank"
	154	+ class="block w-8 h-8 p-2 transition duration-150 ease-in-out border rounded-full lg:w-12 lg:h-12 lg:p-4 hover:bg-gray-4 border-gray-5"
	155	+ >
154	156	<img
155		- class="w-4"
	157	+ class="w-full h-full"
156	158	src="/images/discord.svg"
157	159	alt="Discord"
158	160	/>
159	161	</a>
160	162	</li>
161		- <li
162		- class="flex items-center justify-center border rounded-full border-gray-5 md:w-10 md:h-10 lg:w-12 lg:h-12"
163		- >
164		- <a :href="social.twitter" target="_blank" class="block">
	163	+ <li class="flex items-center justify-center">
	164	+ <a
	165	+ :href="social.twitter"
	166	+ target="_blank"
	167	+ class="block w-8 h-8 p-2 transition duration-150 ease-in-out border rounded-full lg:w-12 lg:h-12 lg:p-4 hover:bg-gray-4 border-gray-5"
	168	+ >
165	169	<img
166		- class="w-4"
	170	+ class="w-full h-full"
167	171	src="/images/twitter.svg"
168	172	alt="Twitter"
169	173	/>
170	174	</a>
171	175	</li>
172		- <li
173		- class="flex items-center justify-center border rounded-full border-gray-5 md:w-10 md:h-10 lg:w-12 lg:h-12"
174		- >
175		- <a :href="social.instagram" target="_blank" class="block">
	176	+ <li class="flex items-center justify-center">
	177	+ <a
	178	+ :href="social.instagram"
	179	+ target="_blank"
	180	+ class="block w-8 h-8 p-2 transition duration-150 ease-in-out border rounded-full lg:w-12 lg:h-12 lg:p-4 hover:bg-gray-4 border-gray-5"
	181	+ >
176	182	<img
177		- class="w-4"
	183	+ class="w-full h-full"
178	184	src="/images/insta.svg"
179	185	alt="Instagram"
180	186	/>

src/components/AppHeader.vuemodified+26-0

Changes to src/components/AppHeader.vue

		⋯84 linesShow the 84 lines above this hunk@@ -85,6 +85,25 @@
85	85	></div>
86	86	</router-link>
87	87	</li>
	88	+ <li class="relative flex flex-col items-center mx-2">
	89	+ <router-link
	90	+ to="/faq"
	91	+ custom
	92	+ v-slot="{ href, route, navigate, isActive, isExactActive }"
	93	+ >
	94	+ <a
	95	+ @click="navigate"
	96	+ :class="{ 'text-pink-3': isActive }"
	97	+ class="transition duration-150 ease-in-out rounded-md lg:px-2 hover:text-pink-3 focus:outline-none focus:bg-pink-custom-2"
	98	+ :href="href"
	99	+ >FAQ</a
	100	+ >
	101	+ <div
	102	+ v-if="isActive"
	103	+ class="absolute bottom-0 w-2 h-2 -mb-3 rounded bg-pink-gradient"
	104	+ ></div>
	105	+ </router-link>
	106	+ </li>
88	107	<li class="mx-2 cursor-wait">
89	108	Rarity
90	109	<span
		⋯37 linesShow the 37 lines above this hunk@@ -128,6 +147,13 @@
128	147	>Roadmap</router-link
129	148	>
130	149	</li>
	150	+ <li>
	151	+ <router-link
	152	+ to="/faq"
	153	+ class="block px-3 py-6 text-lg font-medium transition duration-150 ease-in-out rounded-md text-gray-8 hover:text-pink-3"
	154	+ >FAQ</router-link
	155	+ >
	156	+ </li>
131	157	<li>
132	158	<a
133	159	href="#"

src/content/app.jsonmodified+19-0

Changes to src/content/app.json

		⋯65 linesShow the 65 lines above this hunk@@ -66,5 +66,24 @@
66	66	"twitter_url": "",
67	67	"linkedin_url": ""
68	68	}
	69	+ ],
	70	+
	71	+ "faq": [
	72	+ {
	73	+ "question": "Tempor excepteur commodo dolore qui.",
	74	+ "answer": "Consequat et adipisicing cillum mollit non occaecat fugiat ex ut. Aliquip pariatur commodo irure duis. Officia in sunt qui ut nulla in quis non qui officia laboris tempor minim. Enim irure amet reprehenderit sint id excepteur voluptate aute nisi culpa esse."
	75	+ },
	76	+ {
	77	+ "question": "In est sunt non occaecat minim.",
	78	+ "answer": "Ea pariatur pariatur labore id consectetur cupidatat quis veniam est laboris irure mollit anim. Lorem ad dolore cillum do consectetur excepteur dolor non duis ipsum mollit ad deserunt. Est aliquip consectetur duis elit culpa voluptate dolor anim anim reprehenderit voluptate Lorem duis. Labore in culpa tempor qui minim. Pariatur aliqua proident amet veniam."
	79	+ },
	80	+ {
	81	+ "question": "Reprehenderit aute exercitation minim duis.",
	82	+ "answer": "Velit do laborum excepteur eiusmod enim enim nisi labore cillum ipsum laborum ex aute. Ullamco mollit in Lorem velit proident voluptate id voluptate mollit. Nulla deserunt pariatur laboris laboris occaecat voluptate esse. Esse velit esse sunt nisi labore est veniam."
	83	+ },
	84	+ {
	85	+ "question": "Proident in est non proident dolore dolor aute commodo enim sunt labore consequat.",
	86	+ "answer": "Exercitation eu non consectetur esse dolore nostrud duis veniam et adipisicing qui. Deserunt sit adipisicing aliquip irure aute ut aliquip ullamco. Laborum et officia ex qui et. In officia elit sint deserunt anim quis ad aliqua do occaecat pariatur fugiat id."
	87	+ }
69	88	]
70	89	}

src/routes.jsmodified+7-0

Changes to src/routes.js

		⋯2 linesShow the 2 lines above this hunk@@ -3,6 +3,7 @@ import About from "./views/About.vue";
3	3	import Roadmap from "./views/Roadmap.vue";
4	4	import NotFound from "./views/NotFound.vue";
5	5	import PrivacyPolicy from "./views/PrivacyPolicy.vue";
	6	+import Faq from "./views/Faq.vue";
6	7
7	8	/** @type {import('vue-router').RouterOptions['routes']} */
8	9	export const routes = [
		⋯16 linesShow the 16 lines above this hunk@@ -25,5 +26,11 @@ export const routes = [
25	26	meta: { title: "Privacy Policy" },
26	27	component: PrivacyPolicy,
27	28	},
	29	+ {
	30	+ path: "/faq",
	31	+ name: "faq",
	32	+ meta: { title: "FAQ" },
	33	+ component: Faq,
	34	+ },
28	35	{ path: "/:path(.*)", component: NotFound },
29	36	];

src/tailwind.cssmodified+4-3

Changes to src/tailwind.css

		@@ -1,9 +1,10 @@
1		-@import url('https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght@700&display=swap');
2		-@import url('https://fonts.googleapis.com/css2?family=Sora&display=swap');
3		-@import url('https://fonts.googleapis.com/css2?family=Sora+Semibold:wght@600&display=swap');
4	1
5	2	@import 'tailwindcss/base';
6	3
7	4	@import 'tailwindcss/components';
8	5
9	6	@import 'tailwindcss/utilities';
	7	+
	8	+@import url('https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght@700&display=swap');
	9	+@import url('https://fonts.googleapis.com/css2?family=Sora&display=swap');
	10	+@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600&display=swap');

src/views/Faq.vueadded+127-0

Changes to src/views/Faq.vue

		@@ -0,0 +1,127 @@
	1	+<script setup>
	2	+import AppHeader from "@/components/AppHeader.vue";
	3	+import AppFooter from "@/components/AppFooter.vue";
	4	+</script>
	5	+
	6	+<template>
	7	+ <div class="w-screen h-full bg-gray-8 text-gray-4">
	8	+ <AppHeader />
	9	+
	10	+ <div class="container px-2 mx-auto mt-20 md:mt-24">
	11	+ <div class="mx-auto md:w-2/3">
	12	+ <div class="w-full my-4">
	13	+ <div class="flex items-center justify-center">
	14	+ <h1
	15	+ class="mt-8 -mt-2 tracking-widest uppercase text-pink-3 font-sora"
	16	+ >
	17	+ Hoodratz
	18	+ </h1>
	19	+ </div>
	20	+ </div>
	21	+
	22	+ <div class="mx-4 text-center">
	23	+ <div class="mb-20">
	24	+ <h2
	25	+ class="mb-4 -mt-6 text-3xl text-white font-kumbh-bold md:text-5xl"
	26	+ >
	27	+ Frequently Asked Questions
	28	+ </h2>
	29	+ </div>
	30	+ </div>
	31	+
	32	+ <div
	33	+ v-for="(item, index) in faq"
	34	+ class="mb-8 border rounded-md border-pink-2 bg-gray-5"
	35	+ >
	36	+ <div class="px-4 py-4 mx-auto max-w-7xl sm:py-4 sm:px-6 lg:px-8">
	37	+ <div class="max-w-3xl mx-auto divide-y-2 divide-gray-200">
	38	+ <dl class="space-y-6 divide-y divide-gray-200">
	39	+ <div>
	40	+ <dt class="text-lg">
	41	+ <!-- Expand/collapse question button -->
	42	+ <button
	43	+ @click="toggleFaqAnswer(index)"
	44	+ type="button"
	45	+ class="flex items-start justify-between w-full text-left text-gray-400 "
	46	+ aria-controls="faq-0"
	47	+ aria-expanded="false"
	48	+ >
	49	+ <span class="font-medium text-gray-100">
	50	+ {{ item.question }}
	51	+ </span>
	52	+ <span class="flex items-center ml-6 h-7">
	53	+ <svg
	54	+ v-if="!faqAnswer[index]"
	55	+ class="w-6 h-6 text-gray-100 transform rotate-0"
	56	+ xmlns="http://www.w3.org/2000/svg"
	57	+ fill="none"
	58	+ viewBox="0 0 24 24"
	59	+ stroke="currentColor"
	60	+ aria-hidden="true"
	61	+ >
	62	+ <path
	63	+ stroke-linecap="round"
	64	+ stroke-linejoin="round"
	65	+ stroke-width="2"
	66	+ d="M19 9l-7 7-7-7"
	67	+ />
	68	+ </svg>
	69	+ <svg
	70	+ v-else
	71	+ class="w-6 h-6 text-gray-100"
	72	+ fill="none"
	73	+ stroke="currentColor"
	74	+ viewBox="0 0 24 24"
	75	+ xmlns="http://www.w3.org/2000/svg"
	76	+ >
	77	+ <path
	78	+ stroke-linecap="round"
	79	+ stroke-linejoin="round"
	80	+ stroke-width="2"
	81	+ d="M5 15l7-7 7 7"
	82	+ ></path>
	83	+ </svg>
	84	+ </span>
	85	+ </button>
	86	+ </dt>
	87	+ <dd v-show="faqAnswer[index]" class="pr-12 mt-2" id="faq-0">
	88	+ <p class="text-base text-gray-300">
	89	+ {{ item.answer }}
	90	+ </p>
	91	+ </dd>
	92	+ </div>
	93	+ <!-- More questions... -->
	94	+ </dl>
	95	+ </div>
	96	+ </div>
	97	+ </div>
	98	+ </div>
	99	+ </div>
	100	+
	101	+ <div class="mb-32"></div>
	102	+
	103	+ <AppFooter />
	104	+ </div>
	105	+</template>
	106	+
	107	+<script>
	108	+import { faq } from "@/content/app.json";
	109	+export default {
	110	+ data() {
	111	+ return {
	112	+ faq,
	113	+ faqAnswer: [],
	114	+ };
	115	+ },
	116	+ mounted() {
	117	+ faq.forEach((item, index) => {
	118	+ this.faqAnswer[index] = false;
	119	+ });
	120	+ },
	121	+ methods: {
	122	+ toggleFaqAnswer(index) {
	123	+ this.faqAnswer[index] = !this.faqAnswer[index];
	124	+ },
	125	+ },
	126	+};
	127	+</script>

src/views/Home.vuemodified+4-4

Changes to src/views/Home.vue

		⋯32 linesShow the 32 lines above this hunk@@ -33,7 +33,7 @@ import AppFooter from "@/components/AppFooter.vue";
33	33	<a
34	34	:href="social.discord"
35	35	target="_blank"
36		- class="flex items-center justify-center w-full px-8 py-3 mt-5 text-white uppercase rounded-full md:w-3/4 lg:w-auto lg:mr-10 md:mr-10 bg-pink-gradient md:shadow-none text-a font-sora shadow-hoodratz-btn hover:bg-pink-3"
	36	+ class="flex items-center justify-center w-full px-8 py-3 mt-5 mr-4 text-white uppercase transition duration-150 ease-in-out rounded-full bg-pink-gradient md:shadow-none text-a font-sora shadow-hoodratz-btn hover:bg-pink-3 md:w-3/4 lg:w-auto text-button backdrop-blur-sm"
37	37	>
38	38	Join Discord
39	39	</a>
		⋯5 linesShow the 5 lines above this hunk@@ -45,8 +45,8 @@ import AppFooter from "@/components/AppFooter.vue";
45	45	Follow Us
46	46	<svg
47	47	class="fill-current ml-2.5"
48		- width="20"
49		- height="20"
	48	+ width="15"
	49	+ height="15"
50	50	viewBox="0 0 20 20"
51	51	fill="currentColor"
52	52	xmlns="http://www.w3.org/2000/svg"
		⋯654 linesShow the 654 lines above this hunk@@ -707,7 +707,7 @@ import AppFooter from "@/components/AppFooter.vue";
707	707	<div class="flex items-center mt-5">
708	708	<img
709	709	class="mr-5 opacity-10"
710		- src="/images/solana-logo-gray.svg"
	710	+ src="/images/home/hoodratz-solana-lg.png"
711	711	alt=""
712	712	/>
713	713	</div>

src/views/PrivacyPolicy.vuemodified+37-28

Changes to src/views/PrivacyPolicy.vue

		@@ -1,48 +1,57 @@
1	1	<script setup>
2		-import AppHeader from '@/components/AppHeader.vue'
3		-import AppFooter from '@/components/AppFooter.vue'
	2	+import AppHeader from "@/components/AppHeader.vue";
	3	+import AppFooter from "@/components/AppFooter.vue";
4	4	</script>
5	5
6	6	<template>
7		-<div class="bg-gray-8 w-screen h-full text-gray-4">
	7	+ <div class="w-screen h-full bg-gray-8 text-gray-4">
8	8	<AppHeader />
9	9
10	10	<div class="container mx-auto mt-20 md:mt-24">
11		- <div class="md:w-2/3 mx-auto">
12		- <div class="w-full my-4">
13		- <div class="flex items-center justify-center">
14		- <h1 class="text-pink-3 uppercase font-sora mt-8 tracking-widest -mt-2">Privacy</h1>
15		- </div>
16		- </div>
	11	+ <div class="mx-auto md:w-2/3">
	12	+ <div class="w-full my-4">
	13	+ <div class="flex items-center justify-center">
	14	+ <h1
	15	+ class="mt-8 -mt-2 tracking-widest uppercase text-pink-3 font-sora"
	16	+ >
	17	+ Privacy
	18	+ </h1>
	19	+ </div>
	20	+ </div>
17	21
18		- <div class="text-center mx-4">
19		- <div class="mb-20">
20		- <h2 class="text-white font-kumbh-bold text-3xl md:text-5xl mb-4 -mt-6">Hoodratz Policy</h2>
21		- <p class="font-sora leading-7">
22		- We take privacy serious.
23		- </p>
24		- </div>
25		- </div>
	22	+ <div class="mx-4 text-center">
	23	+ <div class="mb-20">
	24	+ <h2
	25	+ class="mb-4 -mt-6 text-3xl text-white font-kumbh-bold md:text-5xl"
	26	+ >
	27	+ Hoodratz Policy
	28	+ </h2>
	29	+ <p class="leading-7 font-sora">We take privacy serious.</p>
	30	+ </div>
26	31	</div>
	32	+ </div>
27	33	</div>
28	34
29	35	<!-- Content -->
30		- <div id="privacy-policy" class="mx-4 md:container md:mx-auto mt-8 mb-20 font-sora">
31		- <div class="md:w-2/3 mx-auto">
32		- <Content />
33		- </div>
34		- </div>
	36	+ <div
	37	+ id="privacy-policy"
	38	+ class="mx-4 mt-8 mb-20 md:container md:mx-auto font-sora"
	39	+ >
	40	+ <div class="mx-auto md:w-2/3">
	41	+ <Content />
	42	+ </div>
	43	+ </div>
35	44
36	45	<AppFooter />
37		-</div>
	46	+ </div>
38	47	</template>
39	48
40	49	<script>
41		-import Content from '@/content/privacy-policy.md'
	50	+import Content from "@/content/privacy-policy.md";
42	51
43	52	export default {
44		- components: {
45		- Content
46		- }
47		- }
	53	+ components: {
	54	+ Content,
	55	+ },
	56	+};
48	57	</script>