From dbfaad062390b962e37789bf770e06d33282dca1 Mon Sep 17 00:00:00 2001
From: Diego Imbert <70353967+diegoimbert@users.noreply.github.com>
Date: Thu, 30 Oct 2025 16:28:04 +0100
Subject: [PATCH] fix: ui icon nit in instance settings (#7009)

* Fix Auth0 Icon

* ui migration
---
 .../src/lib/components/AutheliaSetting.svelte |  2 +-
 .../lib/components/AuthentikSetting.svelte    |  2 +-
 .../src/lib/components/KanidmSetting.svelte   |  2 +-
 .../src/lib/components/KeycloakSetting.svelte |  2 +-
 .../lib/components/NextcloudSetting.svelte    | 12 +++++-----
 .../src/lib/components/OAuthSetting.svelte    |  4 +++-
 .../src/lib/components/OktaSetting.svelte     |  2 +-
 .../src/lib/components/ZitadelSetting.svelte  |  2 +-
 .../src/lib/components/icons/Auth0Icon.svelte | 22 +++++++++----------
 9 files changed, 25 insertions(+), 25 deletions(-)

diff --git a/frontend/src/lib/components/AutheliaSetting.svelte b/frontend/src/lib/components/AutheliaSetting.svelte
index 3392b056b6..bb90894b5a 100644
--- a/frontend/src/lib/components/AutheliaSetting.svelte
+++ b/frontend/src/lib/components/AutheliaSetting.svelte
@@ -32,7 +32,7 @@
 
 <div class="flex flex-col gap-1">
 	<!-- svelte-ignore a11y-label-has-associated-control -->
-	<label class="text-sm font-medium text-primary flex gap-4 items-center"
+	<label class="text-xs font-semibold text-emphasis flex gap-4 items-center"
 		><div class="w-[120px]"><IconedResourceType name={'authelia'} after={true} /></div><Toggle
 			checked={enabled}
 			on:change={(e) => {
diff --git a/frontend/src/lib/components/AuthentikSetting.svelte b/frontend/src/lib/components/AuthentikSetting.svelte
index 8936905a16..9ddb0769f3 100644
--- a/frontend/src/lib/components/AuthentikSetting.svelte
+++ b/frontend/src/lib/components/AuthentikSetting.svelte
@@ -32,7 +32,7 @@
 
 <div class="flex flex-col gap-1">
 	<!-- svelte-ignore a11y-label-has-associated-control -->
-	<label class="text-sm font-medium text-primary flex gap-4 items-center"
+	<label class="text-xs font-semibold text-emphasis flex gap-4 items-center"
 		><div class="w-[120px]"><IconedResourceType name={'authentik'} after={true} /></div><Toggle
 			checked={enabled}
 			on:change={(e) => {
diff --git a/frontend/src/lib/components/KanidmSetting.svelte b/frontend/src/lib/components/KanidmSetting.svelte
index c15ab6e022..bec783880a 100644
--- a/frontend/src/lib/components/KanidmSetting.svelte
+++ b/frontend/src/lib/components/KanidmSetting.svelte
@@ -42,7 +42,7 @@
 
 <div class="flex flex-col gap-1">
 	<!-- svelte-ignore a11y-label-has-associated-control -->
-	<label class="text-sm font-medium text-primary flex gap-4 items-center"
+	<label class="text-xs font-semibold text-emphasis flex gap-4 items-center"
 		><div class="w-[120px]"><IconedResourceType name={'kanidm'} after={true} /></div><Toggle
 			checked={enabled}
 			on:change={(e) => {
diff --git a/frontend/src/lib/components/KeycloakSetting.svelte b/frontend/src/lib/components/KeycloakSetting.svelte
index 214b26d288..f9e8714a43 100644
--- a/frontend/src/lib/components/KeycloakSetting.svelte
+++ b/frontend/src/lib/components/KeycloakSetting.svelte
@@ -32,7 +32,7 @@
 
 <div class="flex flex-col gap-1">
 	<!-- svelte-ignore a11y-label-has-associated-control -->
-	<label class="text-sm font-medium text-primary flex gap-4 items-center"
+	<label class="text-xs font-semibold text-emphasis flex gap-4 items-center"
 		><div class="w-[120px]"><IconedResourceType name={'keycloak'} after={true} /></div><Toggle
 			checked={enabled}
 			on:change={(e) => {
diff --git a/frontend/src/lib/components/NextcloudSetting.svelte b/frontend/src/lib/components/NextcloudSetting.svelte
index 10df756941..ab30bc2917 100644
--- a/frontend/src/lib/components/NextcloudSetting.svelte
+++ b/frontend/src/lib/components/NextcloudSetting.svelte
@@ -46,7 +46,7 @@
 
 <div class="flex flex-col gap-1">
 	<!-- svelte-ignore a11y_label_has_associated_control -->
-	<label class="text-sm font-medium text-primary flex gap-4 items-center"
+	<label class="text-xs font-semibold text-emphasis flex gap-4 items-center"
 		><div class="w-[120px]"><IconedResourceType name="nextcloud" after={true} /></div><Toggle
 			checked={enabled}
 			on:change={(e) => {
@@ -70,9 +70,7 @@
 			</label>
 			<label class="block pb-2">
 				<span class="text-primary font-semibold text-sm"
-					>Client Id <Tooltip
-						>Client ID from your Nextcloud OAuth2 app configuration</Tooltip
-					></span
+					>Client Id <Tooltip>Client ID from your Nextcloud OAuth2 app configuration</Tooltip></span
 				>
 				<input type="text" placeholder="Client Id" bind:value={value['id']} />
 			</label>
@@ -87,9 +85,11 @@
 			<CollapseLink text="Instructions">
 				<div class="text-sm text-secondary border p-2">
 					1. Go to your Nextcloud instance as an administrator<br />
-					2. Navigate to <strong>Administration settings → Security → OAuth 2.0 clients</strong><br />
+					2. Navigate to <strong>Administration settings → Security → OAuth 2.0 clients</strong><br
+					/>
 					3. Click "Add client" to create a new OAuth2 application<br />
-					4. Set the redirect URI to your Windmill instance's <code>{baseUrl || 'BASE_URL'}/user/login_callback/nextcloud</code><br />
+					4. Set the redirect URI to your Windmill instance's
+					<code>{baseUrl || 'BASE_URL'}/user/login_callback/nextcloud</code><br />
 					5. Copy the Client ID and Client Secret to the fields above<br />
 				</div>
 			</CollapseLink>
diff --git a/frontend/src/lib/components/OAuthSetting.svelte b/frontend/src/lib/components/OAuthSetting.svelte
index 5d25c26ead..8e69daa269 100644
--- a/frontend/src/lib/components/OAuthSetting.svelte
+++ b/frontend/src/lib/components/OAuthSetting.svelte
@@ -65,7 +65,9 @@
 <div class="flex flex-col">
 	<!-- svelte-ignore a11y-label-has-associated-control -->
 	<label
-		class="text-sm flex gap-4 items-center font-medium text-primary {enabled ? 'rounded py-2' : ''}"
+		class="text-xs flex gap-4 items-center font-semibold text-emphasis {enabled
+			? 'rounded py-2'
+			: ''}"
 		><div class="w-[120px]"><IconedResourceType {name} after={true} /></div><Toggle
 			checked={enabled}
 			disabled={eeOnly && !$enterpriseLicense}
diff --git a/frontend/src/lib/components/OktaSetting.svelte b/frontend/src/lib/components/OktaSetting.svelte
index 7ad4cb01b4..f5a941bc30 100644
--- a/frontend/src/lib/components/OktaSetting.svelte
+++ b/frontend/src/lib/components/OktaSetting.svelte
@@ -45,7 +45,7 @@
 
 <div class="flex flex-col gap-1">
 	<!-- svelte-ignore a11y_label_has_associated_control -->
-	<label class="text-sm font-medium text-primary flex gap-4 items-center"
+	<label class="text-xs font-semibold text-emphasis flex gap-4 items-center"
 		><div class="w-[120px]"><IconedResourceType name="okta" after={true} /></div><Toggle
 			checked={enabled}
 			on:change={(e) => {
diff --git a/frontend/src/lib/components/ZitadelSetting.svelte b/frontend/src/lib/components/ZitadelSetting.svelte
index 16e15a6070..11d6e39262 100644
--- a/frontend/src/lib/components/ZitadelSetting.svelte
+++ b/frontend/src/lib/components/ZitadelSetting.svelte
@@ -32,7 +32,7 @@
 
 <div class="flex flex-col gap-1">
 	<!-- svelte-ignore a11y-label-has-associated-control -->
-	<label class="text-sm font-medium text-primary flex gap-4 items-center"
+	<label class="text-xs font-semibold text-emphasis flex gap-4 items-center"
 		><div class="w-[120px]"><IconedResourceType name={'zitadel'} after={true} /></div><Toggle
 			checked={enabled}
 			on:change={(e) => {
diff --git a/frontend/src/lib/components/icons/Auth0Icon.svelte b/frontend/src/lib/components/icons/Auth0Icon.svelte
index bf6ae23b48..2c9919f037 100644
--- a/frontend/src/lib/components/icons/Auth0Icon.svelte
+++ b/frontend/src/lib/components/icons/Auth0Icon.svelte
@@ -1,18 +1,16 @@
+<script lang="ts">
+	let { size = 24 }: { size?: number } = $props()
+</script>
+
 <svg
-	version="1.2"
+	width="{size}px"
+	height="{size}px"
+	viewBox="0 0 256 285"
+	fill="none"
 	xmlns="http://www.w3.org/2000/svg"
-	viewBox="0 0 1594 1595"
-	width="24"
-	height="24"
 >
-	<title>auth0ddd-svg</title>
-	<style>
-		.s0 {
-			fill: #000000;
-		}
-	</style>
 	<path
-		class="s0"
-		d="M160.183716,48.171844 C209.065292,32.885063 258.390625,21.436710 308.871613,15.252386 C317.292297,14.220791 325.753601,13.356311 334.222168,12.919684 C346.325989,12.295630 355.267456,21.589764 353.666168,34.529034 C349.868744,65.213501 348.537781,96.246513 341.092957,126.439857 C326.677368,184.904236 298.682648,235.976761 256.968506,279.307343 C213.326065,324.640991 160.987228,355.220551 99.454086,369.350647 C86.185066,372.397675 72.675255,374.468994 59.210712,376.568817 C48.252338,378.277832 37.322960,368.554504 37.025162,357.267883 C36.888950,352.105377 37.000465,346.936340 37.000454,341.770264 C37.000340,275.444489 37.000156,209.118698 37.000484,142.792908 C37.000629,113.734810 53.605553,87.790001 80.711502,77.096191 C106.802269,66.802895 133.414459,57.831257 160.183716,48.171844 z M473.292908,18.782619 C506.484009,23.757580 538.685669,31.232409 570.535767,40.198071 C606.031982,50.190132 640.835815,62.258595 674.995361,76.160843 C703.688293,87.838272 720.524536,113.183640 720.506226,144.306686 C720.465149,214.123505 720.485657,283.940338 720.495422,353.757172 C720.497620,369.678192 710.628052,378.153381 694.790466,376.099304 C645.966858,369.767212 600.276794,354.609619 558.938660,327.513123 C494.944519,285.566010 450.524231,228.198090 425.068176,156.124725 C416.448669,131.720474 411.208069,106.565437 408.906525,80.760696 C407.739166,67.672127 405.700104,54.662220 404.473694,41.577518 C403.999908,36.522667 403.805481,31.137602 405.026886,26.291929 C407.479736,16.560717 413.882874,12.037321 423.787903,12.980925 C440.178345,14.542362 456.506195,16.760437 473.292908,18.782619 z M578.363403,464.347748 C615.531311,446.366882 654.581116,435.908630 694.772705,429.284882 C697.708374,428.801056 700.752136,428.857452 703.745483,428.859894 C714.899902,428.868988 720.458801,434.582397 718.691895,445.492645 C716.009277,462.057404 713.484558,478.739502 709.260254,494.946198 C694.406738,551.932251 666.318115,602.423340 631.191589,649.183105 C575.914368,722.766968 508.061218,783.052307 432.927094,835.552307 C431.018921,836.885681 429.046265,838.127625 427.153870,839.482422 C422.472626,842.833557 417.533234,844.040344 412.248444,841.064758 C406.852631,838.026794 404.090637,833.218079 404.209808,827.096191 C404.527344,810.783264 404.724487,794.456909 405.573883,778.167480 C407.684601,737.688477 413.126068,697.680664 423.966522,658.536804 C436.856445,611.992310 456.846161,569.063904 488.758606,532.264648 C513.768555,503.424927 543.806946,481.217163 578.363403,464.347748 z M100.761627,612.221680 C75.728386,572.424377 56.110188,530.629822 45.663021,484.961426 C42.630875,471.706848 40.741016,458.167358 38.833408,444.686859 C37.390755,434.492065 42.754341,427.939545 52.986912,429.076324 C69.119164,430.868469 85.245743,433.507080 101.069740,437.122314 C140.869492,446.215149 178.476105,460.947479 212.772552,483.436096 C263.321442,516.581604 297.953369,562.429321 320.055481,618.236816 C334.840118,655.568054 343.272247,694.426331 348.081482,734.171936 C351.726166,764.293335 353.368927,794.520508 353.156128,824.854004 C353.142120,826.849976 353.278076,828.905640 352.863708,830.830078 C350.998230,839.494263 340.934357,847.105835 330.938843,839.874878 C313.414551,827.197754 295.720337,814.735718 278.557312,801.583313 C248.662613,778.674316 220.522430,753.696289 193.948929,727.012268 C159.090790,692.009094 127.388931,654.396790 100.761627,612.221680 z"
+		d="M220.412 0H127.997L156.559 89.006H248.975L174.205 142.083L202.775 231.594C250.903 196.534 266.629 143.474 248.983 89.006L220.412 0ZM7.01792 89.006H99.4339L127.997 0H35.5889L7.01792 89.006ZM7.01792 89.006C-10.6371 143.474 5.09792 196.535 53.2249 231.594L81.7879 142.084L7.01792 89.006ZM53.2259 231.594L127.996 284.564L202.766 231.594L127.996 177.747L53.2259 231.594Z"
+		fill="black"
 	/>
 </svg>