[Chore] Update cookie preference icon (cloudflare#22683)

* [Chore] Update cookie preference icon

* Testing

* Updates

* alignment + remove testing

---------

Co-authored-by: Kian Newman-Hazel <[email protected]>

Author: 2 people

src/assets/privacyoptions.svg

@@ -1,4 +1,7 @@
 ---
+import { Image } from "astro:assets";
+import PrivacyChoicesImage from "~/assets/privacyoptions.svg";
+
 const isProduction = import.meta.env.PROD;
 
 const uuid = isProduction
@@ -17,7 +20,10 @@ const uuid = isProduction
 	function OptanonWrapper() {}
 </script>
 <!-- OneTrust Cookies Settings button start -->
-<button id="ot-sdk-btn" class="ot-sdk-show-settings">Cookie Settings</button>
+<div class="inline-flex items-center gap-2">
+	<Image src={PrivacyChoicesImage} alt="privacy options" height="12" />
+	<button id="ot-sdk-btn" class="ot-sdk-show-settings">Cookie Settings</button>
+</div>
 <!-- OneTrust Cookies Settings button end -->
 
 <style>

src/components/OneTrust.astro

@@ -90,7 +90,7 @@ if (
 }
 {!splash && <Default />}
 <div class="w-full">
-	<div class="grid grid-cols-2 gap-8 pb-10 pt-6 lg:grid-cols-5">
+	<div class="grid grid-cols-2 gap-8 pt-6 pb-10 lg:grid-cols-5">
 		{
 			groups.map(([title, items]) => (
 				<ul class="flex w-full list-none flex-col gap-3 pl-0">
@@ -114,15 +114,15 @@ if (
 	</div>
 	<div>
 		<ul
-			class="flex list-inside flex-wrap items-center justify-center gap-3 gap-y-4 pl-0 text-xs text-cl1-gray-4! dark:text-cl1-gray-7!"
+			class="text-cl1-gray-4! dark:text-cl1-gray-7! flex list-inside flex-wrap items-center justify-center gap-3 gap-y-4 pl-0 text-xs"
 		>
 			<li class="list-none">2025 Cloudflare, Inc.</li>
 			{
 				links.map(([text, href]) => (
 					<li>
 						<a
 							href={href}
-							class="text-cl1-gray-4! no-underline dark:text-cl1-gray-7!"
+							class="text-cl1-gray-4! dark:text-cl1-gray-7! no-underline"
 						>
 							{text}
 						</a>