windmill-components 1.35.42 → 1.36.0

package/components/icons/HatIcon.svelte.d.ts

@@ -0,0 +1,16 @@
+import { SvelteComponentTyped } from "svelte";
+declare const __propDef: {
+    props: {
+        class?: string | undefined;
+    };
+    events: {
+        [evt: string]: CustomEvent<any>;
+    };
+    slots: {};
+};
+export declare type HatIconProps = typeof __propDef.props;
+export declare type HatIconEvents = typeof __propDef.events;
+export declare type HatIconSlots = typeof __propDef.slots;
+export default class HatIcon extends SvelteComponentTyped<HatIconProps, HatIconEvents, HatIconSlots> {
+}
+export {};

package/components/icons/MastodonIcon.svelte

@@ -9,7 +9,7 @@ export let width = '24px';
 	{width}
 	{height}
 	viewBox="0 0 32 32"
-	style=" fill:#000000;"
+	style="fill:currentcolor;"
 	><path
 		d="M 15.9375 4.03125 C 12.917 4.0435 9.9179219 4.4269844 8.3574219 5.1464844 C 8.3574219 5.1464844 5 6.6748594 5 11.880859 C 5 18.077859 4.9955 25.860234 10.5625 27.365234 C 12.6945 27.938234 14.527953 28.061562 16.001953 27.976562 C 18.676953 27.825562 20 27.005859 20 27.005859 L 19.910156 25.029297 C 19.910156 25.029297 18.176297 25.640313 16.029297 25.570312 C 13.902297 25.495313 11.6615 25.335688 11.3125 22.679688 C 11.2805 22.432688 11.264625 22.182594 11.265625 21.933594 C 15.772625 23.052594 19.615828 22.420969 20.673828 22.292969 C 23.627828 21.933969 26.199344 20.081672 26.527344 18.388672 C 27.041344 15.720672 26.998047 11.880859 26.998047 11.880859 C 26.998047 6.6748594 23.646484 5.1464844 23.646484 5.1464844 C 22.000984 4.3779844 18.958 4.019 15.9375 4.03125 z M 12.705078 8.0019531 C 13.739953 8.0297031 14.762578 8.4927031 15.392578 9.4707031 L 16.001953 10.505859 L 16.609375 9.4707031 C 17.874375 7.5037031 20.709594 7.6264375 22.058594 9.1484375 C 23.302594 10.596438 23.025391 11.531 23.025391 18 L 23.025391 18.001953 L 20.578125 18.001953 L 20.578125 12.373047 C 20.578125 9.7380469 17.21875 9.6362812 17.21875 12.738281 L 17.21875 16 L 14.787109 16 L 14.787109 12.738281 C 14.787109 9.6362812 11.429688 9.7360938 11.429688 12.371094 L 11.429688 18 L 8.9765625 18 C 8.9765625 11.526 8.7043594 10.585438 9.9433594 9.1484375 C 10.622859 8.3824375 11.670203 7.9742031 12.705078 8.0019531 z"
 	/></svg

package/components/icons/MatrixIcon.svelte

@@ -9,7 +9,7 @@ export let width = '24px';
 	{width}
 	{height}
 	viewBox="0 0 50 50"
-	style=" fill:#000000;"
+	style="fill:currentcolor;"
 	><path
 		d="M 5 5 A 1.0001 1.0001 0 0 0 4 6 L 4 44 A 1.0001 1.0001 0 0 0 5 45 L 8 45 A 1.0001 1.0001 0 1 0 8 43 L 6 43 L 6 7 L 8 7 A 1.0001 1.0001 0 1 0 8 5 L 5 5 z M 42 5 A 1.0001 1.0001 0 1 0 42 7 L 44 7 L 44 43 L 42 43 A 1.0001 1.0001 0 1 0 42 45 L 45 45 A 1.0001 1.0001 0 0 0 46 44 L 46 6 A 1.0001 1.0001 0 0 0 45 5 L 42 5 z M 31.074219 17.509766 C 29.975744 17.487506 28.868391 17.760297 27.978516 18.373047 C 27.407516 18.767047 26.915609 19.272813 26.349609 19.757812 C 25.488609 18.039813 23.929344 17.580781 22.152344 17.550781 C 20.351344 17.519781 18.920922 18.341797 17.669922 19.841797 L 17.669922 18 L 14 18 L 14 32 L 17.664062 32 C 17.664062 32 17.657969 26.766016 17.667969 24.166016 C 17.669969 23.704016 17.689203 23.23225 17.783203 22.78125 C 18.073203 21.39225 19.538031 20.534437 20.957031 20.648438 C 22.309031 20.757437 23.100016 21.495656 23.166016 23.097656 C 23.177016 23.376656 23.166016 32 23.166016 32 L 26.832031 32 L 26.832031 24.228516 C 26.838031 23.629516 26.901875 23.0175 27.046875 22.4375 C 27.372875 21.1375 28.590531 20.49825 30.019531 20.65625 C 31.279531 20.79525 32.239031 21.474609 32.332031 22.849609 L 32.332031 32 L 36 32 L 36 22 C 36 21 35.746359 20.490859 35.443359 19.880859 C 34.710859 18.405234 32.90501 17.546865 31.074219 17.509766 z"
 	/></svg

package/components/icons/PostgresIcon.svelte

@@ -9,7 +9,7 @@ export let width = '24px';
 	{width}
 	{height}
 	viewBox="0 0 50 50"
-	style=" fill:#000000;"
+	style="fill:currentcolor;"
 	><path
 		d="M 34.902344 2 C 32.863281 2 31.097656 2.550781 29.875 3.09375 C 28.675781 2.691406 26.6875 2.003906 24.300781 2.5 C 22.910156 2.742188 21.632813 3.316406 20.460938 4.195313 C 18.53125 3.265625 16.515625 2.695313 14.402344 2.601563 C 13.101563 2.5 7.800781 3.101563 5.898438 5.898438 C 5.199219 7 4.5 8.398438 4.199219 10.097656 C 3.898438 11.597656 3.898438 13.300781 4.398438 16.800781 C 4.699219 19.199219 5.101563 20.800781 6 24.097656 C 6.101563 24.398438 6.601563 26 8.101563 30.402344 C 8.398438 31.199219 9 32.699219 10.199219 34.097656 C 11 35.097656 11.800781 35.699219 12.800781 35.699219 C 14.101563 35.699219 15 34.800781 15.800781 33.800781 C 15.859375 33.734375 15.921875 33.660156 15.980469 33.59375 C 15.90625 33.710938 15.839844 33.839844 15.800781 34 C 15.601563 35 16.800781 35.800781 17.800781 36.199219 C 18.601563 36.597656 19.5 36.699219 20.199219 36.699219 C 21.097656 36.699219 21.800781 36.5 22.199219 36.402344 C 22.542969 36.285156 23.285156 35.964844 24.078125 35.4375 C 24.113281 37.992188 24.136719 41.007813 24.199219 41.699219 C 24.5 44.300781 25.199219 46.097656 26.5 47.097656 C 27.5 47.898438 29.300781 48 29.402344 48 C 31.199219 48 34 46.800781 35.199219 44.902344 C 35.800781 44 36 43.199219 36.199219 42.097656 C 36.398438 41.5 36.597656 38 36.699219 37.300781 C 36.835938 36.195313 36.941406 35.105469 37.046875 34.046875 C 37.707031 34.21875 38.519531 34.402344 39.402344 34.402344 C 41 34.402344 43.101563 33.300781 43.5 33.097656 C 44.300781 32.5 45.898438 31.101563 45.199219 29.902344 C 44.800781 29.199219 44.199219 29.199219 42.699219 29.402344 C 42.699219 29.402344 40.300781 29.699219 40.097656 29.597656 C 39.953125 29.542969 39.730469 29.402344 39.480469 29.21875 C 40 28.414063 40.460938 27.617188 41 26.902344 C 42.199219 24.601563 42.902344 22.800781 43.402344 21.402344 C 44.300781 18.902344 44.800781 16.898438 45.097656 15.5 C 45.800781 12.5 46 11.101563 45.597656 9.5 C 44.800781 6.699219 41.898438 4.300781 40.699219 3.601563 C 39.898438 3.199219 37.902344 2 34.902344 2 Z M 34.902344 4 C 37.402344 4 39.101563 5 40 5.398438 C 41.101563 6 43.601563 8 43.800781 9.898438 C 43.902344 11 44 12.101563 43.300781 15 C 42.902344 16.398438 42.5 18.199219 41.597656 20.699219 C 41.097656 22.097656 40.5 23.800781 39.300781 25.902344 C 39.269531 25.953125 39.234375 26.007813 39.203125 26.0625 C 39.320313 25.640625 39.402344 25.300781 39.402344 25.300781 C 39.601563 24.300781 39.601563 23.5 39.5 22.300781 C 39.398438 21.699219 39.300781 20.199219 39.300781 19.597656 C 39.300781 19.300781 39.597656 16.199219 39.699219 15.097656 C 39.800781 13.300781 38.699219 11.097656 38.402344 10.699219 C 36.902344 8.398438 36.101563 7.101563 34.5 5.800781 C 34.101563 5.460938 33.417969 4.894531 32.488281 4.324219 C 33.222656 4.144531 34.035156 4 34.902344 4 Z M 26.066406 4.410156 C 27.371094 4.441406 28.476563 4.800781 29.300781 5.101563 C 31.402344 5.800781 32.699219 6.898438 33.300781 7.398438 C 34.601563 8.5 35.300781 9.601563 36.800781 11.902344 C 36.910156 12.121094 37.195313 12.585938 37.421875 13.234375 C 35.375 13.046875 34.015625 13.765625 33.199219 14.5 C 32 15.5 32.097656 17 32.199219 18.097656 C 32.199219 18.898438 32.402344 19.902344 33.902344 23.300781 C 34.5 24.800781 35.097656 26.398438 35.699219 27.5 C 36.011719 28.121094 36.394531 28.691406 36.804688 29.199219 C 36.566406 29.320313 36.324219 29.476563 36.097656 29.699219 C 35.5 30.398438 35.398438 31.101563 35.199219 32.402344 C 35 33.402344 34.800781 35.5 34.699219 37.199219 C 34.699219 37.898438 34.402344 41.300781 34.300781 41.800781 C 34 42.800781 33.898438 43.300781 33.5 43.902344 C 32.800781 45 30.601563 45.902344 29.300781 45.800781 C 28.902344 45.800781 28.300781 45.800781 27.800781 45.402344 C 26.699219 44.601563 26.300781 42.800781 26.199219 41.402344 C 26.097656 40.402344 26.199219 33.199219 26 31.597656 C 25.898438 31.199219 25.800781 30.199219 25 29.5 C 24.664063 29.21875 23.96875 29.074219 23.3125 28.976563 C 23.320313 28.640625 23.339844 28.304688 23.402344 28 C 23.5 27.398438 23.699219 27.097656 23.902344 26.597656 C 24 26.300781 24.199219 25.902344 24.402344 25.402344 C 25.300781 22.601563 25.097656 18.898438 24.597656 16.597656 C 24.5 16.398438 24.097656 14.800781 22.699219 13.902344 C 21.199219 13 19.597656 13.5 18.699219 13.800781 C 18.328125 13.902344 17.960938 14.0625 17.59375 14.25 C 17.65625 13.832031 17.710938 13.410156 17.800781 13 C 18.199219 11 18.601563 9.300781 19.902344 7.601563 C 21.300781 5.898438 22.898438 4.800781 24.699219 4.5 C 25.175781 4.425781 25.632813 4.398438 26.066406 4.410156 Z M 13.71875 4.585938 C 13.953125 4.582031 14.152344 4.585938 14.300781 4.601563 C 15.863281 4.683594 17.359375 5.050781 18.84375 5.675781 C 18.660156 5.878906 18.476563 6.082031 18.300781 6.300781 C 16.601563 8.300781 16.199219 10.398438 15.800781 12.5 C 15.300781 15 15.199219 17.597656 15.597656 20.199219 L 15.402344 22.097656 C 15.300781 23.097656 15.097656 25 16.199219 27 C 16.585938 27.664063 17.011719 28.226563 17.480469 28.707031 C 16.464844 30.050781 15.386719 31.320313 14.300781 32.5 C 13.699219 33.199219 13.199219 33.699219 12.800781 33.699219 C 12.699219 33.699219 12.300781 33.5 11.699219 32.800781 C 10.597656 31.601563 10.199219 30.300781 10 29.800781 C 8.800781 26.199219 8.101563 23.898438 8 23.597656 C 7.199219 20.398438 6.800781 18.800781 6.398438 16.5 C 5.898438 13.300781 5.898438 11.699219 6.199219 10.402344 C 6.5 9 7 7.898438 7.5 7.101563 C 8.726563 5.175781 12.09375 4.628906 13.71875 4.585938 Z M 36.664063 15.125 C 36.984375 15.125 37.332031 15.164063 37.699219 15.242188 C 37.6875 16.175781 37.300781 19.105469 37.300781 19.5 C 37.300781 20.300781 37.5 21.898438 37.5 22.5 C 37.601563 23.601563 37.601563 24.199219 37.5 25 C 37.5 25 37.351563 25.714844 37.199219 26.222656 C 36.734375 25.171875 36.21875 23.917969 35.597656 22.5 C 34.097656 19.101563 34 18.402344 34 17.902344 C 34 17.199219 34 16.300781 34.597656 15.902344 C 35.160156 15.402344 35.84375 15.132813 36.664063 15.125 Z M 21.140625 15.417969 C 21.339844 15.441406 21.523438 15.5 21.699219 15.597656 C 22.5 16 22.699219 17 22.699219 17 C 23.199219 19.199219 23.398438 22.5 22.597656 24.699219 C 22.5 25.097656 22.300781 25.398438 22.199219 25.699219 C 22 26.199219 21.800781 26.699219 21.597656 27.597656 C 21.546875 27.96875 21.523438 28.335938 21.511719 28.703125 C 20.820313 28.558594 20.167969 28.3125 19.699219 28 C 18.898438 27.601563 18.300781 26.898438 17.902344 26.097656 C 17.199219 24.597656 17.300781 23.199219 17.402344 22.402344 L 17.597656 20.097656 C 17.457031 18.972656 17.390625 17.84375 17.40625 16.722656 C 17.867188 16.328125 18.46875 15.925781 19.300781 15.699219 C 19.902344 15.550781 20.558594 15.34375 21.140625 15.417969 Z M 35.886719 16.089844 C 35.625 16.101563 35.347656 16.148438 35.199219 16.199219 C 34.800781 16.300781 34.699219 16.300781 34.597656 16.5 C 34.5 16.699219 34.800781 17 34.902344 17.199219 C 35 17.199219 35.300781 17.5 35.699219 17.402344 C 36 17.300781 36.199219 17.101563 36.300781 17 C 36.402344 16.898438 36.800781 16.398438 36.5 16.199219 C 36.398438 16.097656 36.148438 16.074219 35.886719 16.089844 Z M 20.914063 16.816406 C 20.804688 16.824219 20.699219 16.851563 20.597656 16.902344 C 20.5 16.902344 20.300781 17 20.199219 17.199219 C 20.097656 17.398438 20.199219 17.597656 20.300781 17.699219 C 20.5 18 20.800781 18.300781 21.300781 18.300781 C 21.402344 18.300781 21.800781 18.300781 22.097656 18 C 22.097656 18 22.402344 17.699219 22.402344 17.402344 C 22.300781 17.199219 22.101563 17.101563 21.800781 17 C 21.574219 16.925781 21.238281 16.792969 20.914063 16.816406 Z M 19.074219 29.902344 C 19.6875 30.230469 20.425781 30.496094 21.234375 30.679688 C 21.019531 31.109375 20.710938 31.464844 20.402344 31.699219 C 19.699219 32.199219 18.800781 32.5 17.902344 32.699219 C 17.699219 32.699219 17.601563 32.800781 17.402344 32.800781 C 16.917969 32.9375 16.449219 33.089844 16.128906 33.421875 C 17.109375 32.332031 18.09375 31.128906 19.074219 29.902344 Z M 38.355469 30.703125 C 38.792969 31.03125 39.222656 31.273438 39.597656 31.402344 C 40.199219 31.601563 40.699219 31.601563 42.5 31.402344 C 42.199219 31.699219 41.300781 32.199219 40 32.402344 C 39.164063 32.484375 38.125 32.285156 37.28125 32.042969 C 37.359375 31.476563 37.449219 31.152344 37.597656 31 C 37.652344 30.949219 37.984375 30.847656 38.355469 30.703125 Z M 23.296875 31.003906 C 23.503906 31.039063 23.667969 31.066406 23.699219 31.097656 C 23.898438 31.300781 24 31.800781 24 32 C 24.011719 32.171875 24.019531 32.605469 24.027344 32.90625 C 23.203125 33.871094 21.878906 34.40625 21.597656 34.5 C 21.199219 34.699219 20 34.898438 18.800781 34.5 C 19.800781 34.199219 20.800781 33.902344 21.597656 33.300781 C 22.296875 32.800781 22.898438 32.003906 23.296875 31.003906 Z"
 	/></svg

package/components/icons/S3Icon.svelte

@@ -9,7 +9,7 @@ export let width = '24px';
 	{width}
 	{height}
 	viewBox="0 0 50 50"
-	style=" fill:#000000;"
+	style="fill:currentcolor;"
 	><path
 		d="M 28 7.9453125 L 21 10.279297 L 21 18.279297 L 16 19.945312 L 10 17.945312 L 3 20.279297 L 3 29.720703 L 3.6835938 29.949219 L 9 31.720703 L 9 39.720703 L 9.6835938 39.949219 L 16 42.054688 L 23 39.720703 L 23 31.720703 L 29 29.720703 L 29 21.720703 L 34 20.054688 L 40 22.054688 L 47 19.720703 L 47 10.279297 L 40 7.9453125 L 34 9.9453125 L 28 7.9453125 z M 28 10.054688 L 32.335938 11.5 L 28 12.945312 L 23.664062 11.5 L 28 10.054688 z M 40 10.054688 L 44.335938 11.5 L 40 12.945312 L 35.664062 11.5 L 40 10.054688 z M 23 13.388672 L 27 14.720703 L 27 19.611328 L 23 18.279297 L 23 13.388672 z M 33 13.388672 L 33 18.279297 L 29 19.611328 L 29 14.720703 L 33 13.388672 z M 35 13.388672 L 39 14.720703 L 39 19.611328 L 35 18.279297 L 35 13.388672 z M 45 13.388672 L 45 18.279297 L 41 19.611328 L 41 14.720703 L 45 13.388672 z M 10 20.054688 L 14.335938 21.5 L 10 22.945312 L 5.6640625 21.5 L 10 20.054688 z M 22 20.054688 L 26.335938 21.5 L 22 22.945312 L 17.664062 21.5 L 22 20.054688 z M 5 23.388672 L 9 24.720703 L 9 29.611328 L 5 28.279297 L 5 23.388672 z M 15 23.388672 L 15 28.279297 L 11 29.611328 L 11 24.720703 L 15 23.388672 z M 17 23.388672 L 21 24.720703 L 21 29.611328 L 17 28.279297 L 17 23.388672 z M 27 23.388672 L 27 28.279297 L 23 29.611328 L 23 24.720703 L 27 23.388672 z M 16 30.054688 L 20.335938 31.5 L 16 32.945312 L 11.664062 31.5 L 16 30.054688 z M 11 33.388672 L 15 34.720703 L 15 39.611328 L 11 38.279297 L 11 33.388672 z M 21 33.388672 L 21 38.279297 L 17 39.611328 L 17 34.720703 L 21 33.388672 z"
 	/></svg

package/components/icons/Slack.svelte

@@ -9,7 +9,7 @@ export let width = '24px';
 	{width}
 	{height}
 	viewBox="0 0 30 30"
-	style=" fill:#000000;"
+	style="fill:currentcolor;"
 >
 	<path
 		d="M 16.644531 2.0058594 C 16.365063 1.9841719 16.077422 2.0168281 15.794922 2.1113281 C 14.664922 2.4893281 14.053641 3.71375 14.431641 4.84375 L 15.324219 7.5117188 L 10.236328 9.2128906 L 9.3828125 6.6601562 C 9.0048125 5.5301563 7.7803906 4.9208281 6.6503906 5.2988281 C 5.5193906 5.6768281 4.9110625 6.8992969 5.2890625 8.0292969 L 6.1425781 10.582031 L 3.4746094 11.474609 C 2.3446094 11.852609 1.7333281 13.075078 2.1113281 14.205078 C 2.4893281 15.335078 3.71375 15.946359 4.84375 15.568359 L 7.5117188 14.675781 L 9.2128906 19.763672 L 6.6601562 20.617188 C 5.5301563 20.995187 4.9208281 22.219609 5.2988281 23.349609 C 5.6768281 24.480609 6.8992969 25.088938 8.0292969 24.710938 L 10.582031 23.857422 L 11.474609 26.525391 C 11.852609 27.655391 13.075078 28.266672 14.205078 27.888672 C 15.335078 27.510672 15.945359 26.28625 15.568359 25.15625 L 14.675781 22.488281 L 19.763672 20.785156 L 20.617188 23.339844 C 20.995187 24.469844 22.219609 25.079172 23.349609 24.701172 C 24.480609 24.323172 25.089891 23.100703 24.712891 21.970703 L 23.857422 19.416016 L 26.525391 18.523438 C 27.655391 18.145437 28.266672 16.922969 27.888672 15.792969 C 27.510672 14.662969 26.28625 14.053641 25.15625 14.431641 L 22.488281 15.324219 L 20.787109 10.236328 L 23.339844 9.3828125 C 24.469844 9.0048125 25.079172 7.7803906 24.701172 6.6503906 C 24.323172 5.5203906 23.100703 4.9110625 21.970703 5.2890625 L 19.417969 6.1425781 L 18.525391 3.4746094 C 18.241891 2.6271094 17.482937 2.0709219 16.644531 2.0058594 z M 16.693359 11.605469 L 18.394531 16.693359 L 13.306641 18.394531 L 11.605469 13.306641 L 16.693359 11.605469 z"

package/components/icons/TogglIcon.svelte

@@ -9,51 +9,13 @@ export let width = '24px';
 	{width}
 	{height}
 	viewBox="0 0 60 60"
-	style=" fill:#000000;"
-	><linearGradient
-		id="2R_xNhRC2gDYhp_e6bogba"
-		x1="32"
-		x2="32"
-		y1="7"
-		y2="57"
-		gradientUnits="userSpaceOnUse"
-		><stop offset="0" stop-color="#000000" /><stop
-			offset="1"
-			stop-color="#000000"
-		/></linearGradient
-	><path
-		fill="url(#2R_xNhRC2gDYhp_e6bogba)"
+	style="fill:currentcolor;"
+>
+	<path
 		d="M32,9c12.682,0,23,10.318,23,23S44.682,55,32,55S9,44.682,9,32S19.318,9,32,9 M32,7	C18.193,7,7,18.193,7,32s11.193,25,25,25s25-11.193,25-25S45.807,7,32,7L32,7z"
-	/><linearGradient
-		id="2R_xNhRC2gDYhp_e6bogbb"
-		x1="32.001"
-		x2="32.001"
-		y1="16.294"
-		y2="45.473"
-		gradientUnits="userSpaceOnUse"
-		><stop offset="0" stop-color="#000000" /><stop
-			offset="1"
-			stop-color="#000000"
-		/></linearGradient
-	><rect
-		width="3.999"
-		height="17.995"
-		x="30.001"
-		y="16.005"
-		fill="url(#2R_xNhRC2gDYhp_e6bogbb)"
-	/><linearGradient
-		id="2R_xNhRC2gDYhp_e6bogbc"
-		x1="32.001"
-		x2="32.001"
-		y1="16.294"
-		y2="45.473"
-		gradientUnits="userSpaceOnUse"
-		><stop offset="0" stop-color="#000000" /><stop
-			offset="1"
-			stop-color="#000000"
-		/></linearGradient
-	><path
-		fill="url(#2R_xNhRC2gDYhp_e6bogbc)"
+	/>
+	<rect width="3.999" height="17.995" x="30.001" y="16.005" />
+	<path
 		d="M35.5,20.043v3.713c3.35,1.379,5.714,4.67,5.714,8.518c0,5.087-4.126,9.214-9.213,9.214	c-5.087,0-9.212-4.126-9.212-9.214c0-3.847,2.36-7.137,5.712-8.517v-3.714c-5.324,1.525-9.223,6.418-9.223,12.23	C19.277,39.3,24.976,45,32,45c7.026,0,12.724-5.7,12.724-12.725C44.724,26.461,40.822,21.567,35.5,20.043z"
-	/></svg
->
+	/>
+</svg>

package/components/jobs/JobDetail.svelte

@@ -93,7 +93,7 @@ export let job;
 			</div>
 		</div>
 		<div class="bg-white grid grid-cols-2 gap-x-2 col-span-2">
-			<div class="w-full text-gray-500 text-xs text-left flex flex-col gap-1 mx-4">
+			<div class="w-full text-gray-500 text-xs text-left flex flex-col gap-1 mx-4 overflow-hidden">
 				<div>
 					<Icon class="text-gray-700" data={faUser} scale={SMALL_ICON_SCALE} /><span class="mx-2">
 						By {job.created_by}</span

package/components/landing/FlowGettingStarted.svelte

@@ -1,25 +1,14 @@
 <script>
 	import { goto } from '$app/navigation'
+	import { faExternalLink, faFile, faPlus } from '@fortawesome/free-solid-svg-icons'
+	import Button from '../common/button/Button.svelte'
+	import HatIcon from '../icons/HatIcon.svelte'
 </script>
 
 <div class="p-4 border border-gray-300 rounded-md bg-gray-50 ">
 	<div class="flex items-center">
 		<h3 class="inline-flex items-center text-lg font-medium text-gray-700 ">
-			<svg
-				class="w-6 h-6 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path d="M12 14l9-5-9-5-9 5 9 5z" /><path
-					d="M12 14l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14z"
-				/><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M12 14l9-5-9-5-9 5 9 5zm0 0l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14zm-4 6v-7.5l4-2.222"
-				/>
-			</svg>
+			<HatIcon class="w-6 h-6 mr-2" />
 			Getting started
 		</h3>
 	</div>
@@ -29,67 +18,32 @@
 		the Hub!
 	</div>
 	<div class="inline-flex flex-wrap gap-y-2">
-		<button
-			type="button"
+		<Button
 			on:click={() => goto('flows/add')}
-			class="mr-2 inline-flex items-center text-white bg-gray-700 hover:bg-gray-800 focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
+			color="dark"
+			size="xs"
+			btnClasses="mr-2"
+			startIcon={{ icon: faPlus }}
 		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M12 6v6m0 0v6m0-6h6m-6 0H6"
-				/></svg
-			>
 			Create flow
-		</button>
-		<button
+		</Button>
+		<Button
 			on:click={() => goto('https://docs.windmill.dev/docs/getting_started/flows')}
-			type="button"
-			class="mr-2 inline-flex items-center text-white bg-blue-600 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
+			color="blue"
+			size="xs"
+			btnClasses="mr-2"
+			startIcon={{ icon: faFile }}
 		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
-				/>
-			</svg>
 			Flow documentation
-		</button>
-		<button
-			type="button"
-			class="inline-flex items-center text-gray-700 bg-transparent border border-gray-700 hover:bg-gray-800 hover:text-white focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center "
-			data-dismiss-target="#alert-additional-content-5"
-			aria-label="Close"
+		</Button>
+		<Button
 			on:click={() => goto('https://hub.windmill.dev/')}
+			color="light"
+			variant="border"
+			size="xs"
+			startIcon={{ icon: faExternalLink }}
 		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
-				/>
-			</svg>
 			Explore community flows on WindmillHub
-		</button>
+		</Button>
 	</div>
 </div>

package/components/landing/FlowLandingBox.svelte

@@ -16,7 +16,7 @@ export let flow;
 		class="inline-flex space-x-2 space-x-reverse flex-row-reverse w-full bottom-4 right-4 flex-wrap"
 	>
 		<button
-			on:click|stopPropagation={() => goto(`/flows/edit/${flow.path}?step=2`)}
+			on:click|stopPropagation={() => goto(`/flows/edit/${flow.path}`)}
 			type="button"
 			class="inline-flex items-center text-gray-700 bg-transparent border border-gray-700 hover:bg-gray-800 hover:text-white focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
 			data-dismiss-target="#alert-additional-content-5"

package/components/landing/RessourceGettingStarted.svelte

@@ -1,51 +1,21 @@
 <script>
 	import { goto } from '$app/navigation'
+	import { faLink } from '@fortawesome/free-solid-svg-icons'
+	import Button from '../common/button/Button.svelte'
+	import HatIcon from '../icons/HatIcon.svelte'
 </script>
 
 <div class="p-4 border border-gray-300 rounded-md bg-gray-50 dark:border-gray-600 dark:bg-gray-700">
 	<div class="flex items-center">
 		<h3 class="inline-flex items-center text-lg font-medium text-gray-700 ">
-			<svg
-				class="w-6 h-6 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path d="M12 14l9-5-9-5-9 5 9 5z" /><path
-					d="M12 14l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14z"
-				/><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M12 14l9-5-9-5-9 5 9 5zm0 0l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14zm-4 6v-7.5l4-2.222"
-				/>
-			</svg>
+			<HatIcon class="w-6 h-6 mr-2" />
 			Getting started
 		</h3>
 	</div>
 	<div class="mt-2 mb-4 text-sm text-gray-700 dark:text-gray-300">
 		Connect to apps like Slack, Google Drive or Airtable using OAuth.
 	</div>
-	<div class="flex">
-		<button
-			on:click={() => goto('resources')}
-			type="button"
-			class="inline-flex items-center text-white bg-gray-700 hover:bg-gray-800 focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 mr-2 text-center  dark:bg-gray-600 dark:hover:bg-gray-500 dark:focus:ring-gray-600"
-		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M13.828 10.172a4 4 0 00-5.656 0l-4 4a4 4 0 105.656 5.656l1.102-1.101m-.758-4.899a4 4 0 005.656 0l4-4a4 4 0 00-5.656-5.656l-1.1 1.1"
-				/>
-			</svg>
-			Connect an API
-		</button>
-	</div>
+	<Button on:click={() => goto('resources')} color="dark" startIcon={{ icon: faLink }} size="xs">
+		Connect an API
+	</Button>
 </div>

package/components/landing/ScriptBox.svelte

@@ -1,5 +1,7 @@
 <script>import { goto } from '$app/navigation';
 import { truncateHash } from '../../utils';
+import { faPencil, faPlay } from '@fortawesome/free-solid-svg-icons';
+import { Button, Badge, ActionRow } from '../common';
 export let script;
 </script>
 
@@ -12,70 +14,41 @@ export let script;
 	<div class="inline-flex justify-between w-full">
 		<div class="text-xs">{script.path}</div>
 
-		<span class="bg-gray-100 text-gray-800 text-xs font-semibold mr-2 px-2.5 py-0.5 rounded ">
+		<Badge color="gray">
 			{truncateHash(script.hash)}
-		</span>
+		</Badge>
 	</div>
 	<div class="inline-flex space-x-1 w-full">
-		<span class="bg-blue-100 text-blue-800 text-xs font-semibold  px-2.5 py-0.5 rounded ">
-			{String(script.language).toUpperCase()}
-		</span>
-		{#if script.is_trigger}
-			<span class="bg-red-100 text-red-800 text-xs font-semibold px-2.5 py-0.5 rounded">
-				TRIGGER
-			</span>
+		<Badge color="blue" capitalize>
+			{script.language}
+		</Badge>
+		{#if script.kind !== 'script'}
+			<Badge color="green" capitalize>
+				{script.kind}
+			</Badge>
 		{/if}
 	</div>
-	<div class="inline-flex space-x-2 space-x-reverse flex-row-reverse w-full">
-		<button
-			on:click|stopPropagation={() => goto(`/scripts/edit/${script.hash}?step=2`)}
-			type="button"
-			class="inline-flex items-center text-gray-700 bg-transparent border border-gray-700 hover:bg-gray-800 hover:text-white focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
-			data-dismiss-target="#alert-additional-content-5"
-			aria-label="Close"
-		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
-				/>
-			</svg>
-			Edit
-		</button>
+	<ActionRow>
+		<svelte:fragment slot="right">
+			<Button
+				on:click={() => goto(`/scripts/edit/${script.hash}?step=2`)}
+				color="dark"
+				size="xs"
+				variant="border"
+				startIcon={{ icon: faPencil }}
+			>
+				Edit
+			</Button>
 
-		<button
-			on:click|stopPropagation={() => goto(`/scripts/run/${script.hash}`)}
-			type="button"
-			class="inline-flex items-center text-gray-700 bg-transparent border border-gray-700 hover:bg-gray-800 hover:text-white focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
-			data-dismiss-target="#alert-additional-content-5"
-			aria-label="Close"
-		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M14.752 11.168l-3.197-2.132A1 1 0 0010 9.87v4.263a1 1 0 001.555.832l3.197-2.132a1 1 0 000-1.664z"
-				/><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M21 12a9 9 0 11-18 0 9 9 0 0118 0z"
-				/>
-			</svg>
-			Run
-		</button>
-	</div>
+			<Button
+				on:click={() => goto(`/scripts/run/${script.hash}`)}
+				color="dark"
+				size="xs"
+				variant="border"
+				startIcon={{ icon: faPlay }}
+			>
+				Run
+			</Button>
+		</svelte:fragment>
+	</ActionRow>
 </div>

package/components/landing/ScriptGettingStarted.svelte

@@ -1,93 +1,47 @@
 <script>
 	import { goto } from '$app/navigation'
+	import { faExternalLink, faFile, faPlus } from '@fortawesome/free-solid-svg-icons'
+	import Button from '../common/button/Button.svelte'
+	import HatIcon from '../icons/HatIcon.svelte'
 </script>
 
 <div class="p-4 border border-gray-300 rounded-md bg-gray-50 ">
 	<div class="flex items-center">
 		<h3 class="inline-flex items-center text-lg font-medium text-gray-700 ">
-			<svg
-				class="w-6 h-6 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path d="M12 14l9-5-9-5-9 5 9 5z" /><path
-					d="M12 14l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14z"
-				/><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M12 14l9-5-9-5-9 5 9 5zm0 0l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14zm-4 6v-7.5l4-2.222"
-				/>
-			</svg>
+			<HatIcon class="w-6 h-6 mr-2" />
 			Getting started
 		</h3>
 	</div>
 	<div class="mt-2 mb-4 text-sm text-gray-700 ">
 		Create a new script or find inspiration on the Hub!
 	</div>
-	<div class="inline-flex flex-wrap gap-y-2">
-		<button
+	<div class="inline-flex flex-wrap gap-y-2 ">
+		<Button
 			on:click={() => goto('scripts/add')}
-			type="button"
-			class="mr-2 inline-flex items-center text-white bg-gray-700 hover:bg-gray-800 focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
+			color="dark"
+			size="xs"
+			btnClasses="mr-2"
+			startIcon={{ icon: faPlus }}
 		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M12 6v6m0 0v6m0-6h6m-6 0H6"
-				/></svg
-			>
 			Create script
-		</button>
-		<button
+		</Button>
+		<Button
 			on:click={() => goto('https://docs.windmill.dev/docs/getting_started/scripts')}
-			type="button"
-			class="mr-2 inline-flex items-center text-white bg-blue-600 hover:bg-blue-800 focus:ring-4 focus:outline-none focus:ring-blue-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
+			color="blue"
+			size="xs"
+			btnClasses="mr-2"
+			startIcon={{ icon: faFile }}
 		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"
-				/>
-			</svg>
 			Script documentation
-		</button>
-		<button
+		</Button>
+		<Button
 			on:click={() => goto('https://hub.windmill.dev/')}
-			type="button"
-			class="inline-flex items-center text-gray-700 bg-transparent border border-gray-700 hover:bg-gray-800 hover:text-white focus:ring-4 focus:outline-none focus:ring-gray-300 font-medium rounded-lg text-xs px-3 py-1.5 text-center"
-			data-dismiss-target="#alert-additional-content-5"
-			aria-label="Close"
+			color="light"
+			variant="border"
+			size="xs"
+			startIcon={{ icon: faExternalLink }}
 		>
-			<svg
-				class="w-4 h-4 mr-2"
-				fill="none"
-				stroke="currentColor"
-				viewBox="0 0 24 24"
-				xmlns="http://www.w3.org/2000/svg"
-				><path
-					stroke-linecap="round"
-					stroke-linejoin="round"
-					stroke-width="2"
-					d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"
-				/>
-			</svg>
 			Explore community scripts on WindmillHub
-		</button>
+		</Button>
 	</div>
 </div>