added copy button

huncholaneauthored 1 year ago

parent 7670eeacommit 40b3ed0113db7fb370ac713eae9546f809032efdBrowse files

+5-2twench_landing_page/app/layout.tsx

		@@ -1,8 +1,10 @@
	1	+import Footer from "@/components/Footer";
	2	+import Header from "@/components/Header";
1	3	import type { Metadata } from "next";
2	4	import localFont from "next/font/local";
	5	+import { ToastContainer } from "react-toastify";
	6	+import "react-toastify/dist/ReactToastify.css";
3	7	import "./globals.css";
4		-import Footer from "@/components/Footer";
5		-import Header from "@/components/Header";
6	8
7	9	const pixellari = localFont({
8	10	src: "./fonts/Pixellari.ttf",
		@@ -26,6 +28,7 @@ export default function RootLayout({
26	28	<Header />
27	29	{children}
28	30	<Footer />
	31	+ <ToastContainer className={"text-shadow-none w-[320px] text-[8px]"} />
29	32	</body>
30	33	</html>
31	34	);

+18-1twench_landing_page/components/BuySection/BuySection.tsx

		@@ -1,7 +1,10 @@
	1	+"use client";
1	2	import React from "react";
2	3	import "./BuySection.css";
	4	+import { toast } from "react-toastify";
3	5
4	6	const BuySection: React.FC = () => {
	7	+ const ca = "GuFmsJrhxo9iVX7WpKGQ4kYg6yofMJLpWPypHM44pump";
5	8	return (
6	9	<div className="BuySection">
7	10	<div className="Content">
		@@ -42,7 +45,21 @@ const BuySection: React.FC = () => {
42	45	</div>
43	46	</div>
44	47	<div className="BackpackSoldier"></div>
45		- <div className="CopyBtn">Click To Copy CA</div>
	48	+ <div
	49	+ className="CopyBtn"
	50	+ onClick={() => {
	51	+ navigator.clipboard
	52	+ .writeText(ca)
	53	+ .then(() => {
	54	+ toast.success(`${ca} copied to clipboard!`);
	55	+ })
	56	+ .catch((err) => {
	57	+ toast.error("Failed to copy text to clipboard.");
	58	+ });
	59	+ }}
	60	+ >
	61	+ Click To Copy CA
	62	+ </div>
46	63	</div>
47	64	</div>
48	65	);

+24-1twench_landing_page/package-lock.json

		@@ -10,7 +10,8 @@
10	10	"dependencies": {
11	11	"next": "14.2.15",
12	12	"react": "^18",
13		- "react-dom": "^18"
	13	+ "react-dom": "^18",
	14	+ "react-toastify": "^10.0.6"
14	15	},
15	16	"devDependencies": {
16	17	"@tailwindcss/aspect-ratio": "^0.4.2",
		@@ -1250,6 +1251,15 @@
1250	1251	"integrity": "sha512-IV3Ou0jSMzZrd3pZ48nLkT9DA7Ag1pnPzaiQhpW7c3RbcqqzvzzVu+L8gfqMp/8IM2MQtSiqaCxrrcfu8I8rMA==",
1251	1252	"license": "MIT"
1252	1253	},
	1254	+ "node_modules/clsx": {
	1255	+ "version": "2.1.1",
	1256	+ "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
	1257	+ "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
	1258	+ "license": "MIT",
	1259	+ "engines": {
	1260	+ "node": ">=6"
	1261	+ }
	1262	+ },
1253	1263	"node_modules/color-convert": {
1254	1264	"version": "2.0.1",
1255	1265	"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
		@@ -4143,6 +4153,19 @@
4143	4153	"dev": true,
4144	4154	"license": "MIT"
4145	4155	},
	4156	+ "node_modules/react-toastify": {
	4157	+ "version": "10.0.6",
	4158	+ "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-10.0.6.tgz",
	4159	+ "integrity": "sha512-yYjp+omCDf9lhZcrZHKbSq7YMuK0zcYkDFTzfRFgTXkTFHZ1ToxwAonzA4JI5CxA91JpjFLmwEsZEgfYfOqI1A==",
	4160	+ "license": "MIT",
	4161	+ "dependencies": {
	4162	+ "clsx": "^2.1.0"
	4163	+ },
	4164	+ "peerDependencies": {
	4165	+ "react": ">=18",
	4166	+ "react-dom": ">=18"
	4167	+ }
	4168	+ },
4146	4169	"node_modules/read-cache": {
4147	4170	"version": "1.0.0",
4148	4171	"resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",

+2-1twench_landing_page/package.json

		@@ -11,7 +11,8 @@
11	11	"dependencies": {
12	12	"next": "14.2.15",
13	13	"react": "^18",
14		- "react-dom": "^18"
	14	+ "react-dom": "^18",
	15	+ "react-toastify": "^10.0.6"
15	16	},
16	17	"devDependencies": {
17	18	"@tailwindcss/aspect-ratio": "^0.4.2",