fix: copy

www/index.html

@@ -15,8 +15,8 @@
 				<div
 					class="h-1/4 flex order-2 sm:order-1 justify-center items-center w-full"
 				>
-				<form method="GET" action="javascript:void 0">
-					<div class="w-3/4 sm:w-1/2 mx-auto">
+				<form class="w-full" method="GET" action="javascript:void 0">
+					<div class="w-3/4 sm:w-1/2 mx-auto md:mx-0">
 						<label class="relative w-full">
 							<input
 								id="color-input"
@@ -27,7 +27,7 @@
 							<button
                 id="color-input-button"
 								type="submit"
-								class="absolute inline-block top-1/2 right-1 px-4 py-2 rounded-md -translate-y-1/2 bg-accent text-on-accent"
+								class="absolute inline-block top-1/2 right-2 px-4 py-2 rounded-md -translate-y-1/2 bg-accent text-on-accent"
 							>
 								&rarr;
 							</button>

www/js/copy.js

@@ -1,22 +1,18 @@
 export function copyToClipboard(strToCopy) {
-	if (!navigator?.permissions?.query) {
+	if (!navigator?.clipboard) {
 		return fallBackCopy(strToCopy)
 	}
 
-	navigator?.permissions?.query({name: 'clipboard-write'}).then(result => {
-		if (result.state == 'granted' || result.state == 'prompt') {
-			navigator.clipboard.writeText(strToCopy).then(
-				function () {
-					// ignore and digest
-				},
-				function () {
-					return fallBackCopy(strToCopy)
-				},
-			)
-		} else {
-			return fallBackCopy(strToCopy)
-		}
-	})
+	if (navigator.clipboard) {
+		navigator.clipboard.writeText(strToCopy).then(
+			function () {
+				// ignore and digest
+			},
+			function () {
+				return fallBackCopy(strToCopy)
+			},
+		)
+	}
 }
 
 function fallBackCopy(strToCopy) {
@@ -29,4 +25,4 @@ function fallBackCopy(strToCopy) {
 	el.select()
 	document.execCommand('copy')
 	document.body.removeChild(el)
-}
+}

www/package.json

@@ -9,7 +9,7 @@
 		"autoprefixer": "^10.4.7",
 		"parcel": "^2.6.0",
 		"postcss": "^8.4.14",
-		"tailwindcss": "^3.0.24"
+		"tailwindcss": "3.0.24"
 	},
 	"dependencies": {
 		"toastify-js": "^1.11.2"