refac: styling

src/lib/components/chat/MessageInput.svelte

@@ -70,6 +70,7 @@
 	import InputVariablesModal from './MessageInput/InputVariablesModal.svelte';
 	import Voice from '../icons/Voice.svelte';
 	import { getSessionUser } from '$lib/apis/auths';
+	import Terminal from '../icons/Terminal.svelte';
 	const i18n = getContext('i18n');
 
 	export let onChange: Function = () => {};
@@ -1848,7 +1849,7 @@
 																? 'm-1'
 																: 'focus:outline-hidden rounded-full'}"
 														>
-															<CommandLine className="size-4" strokeWidth="1.75" />
+															<Terminal className="size-3.5" strokeWidth="2" />
 															<span
 																class="hidden @xl:block whitespace-nowrap text-ellipsis leading-none normal-case pr-0.5"
 																>{$i18n.t('Code Interpreter')}</span

src/lib/components/icons/Photo.svelte

@@ -4,18 +4,25 @@
 </script>
 
 <svg
-	class={className}
-	stroke-width={strokeWidth}
-	aria-hidden="true"
 	xmlns="http://www.w3.org/2000/svg"
 	fill="none"
 	viewBox="0 0 24 24"
->
-	<path
-		stroke="currentColor"
+	stroke-width={strokeWidth}
+	stroke="currentColor"
+	class={className}
+	aria-hidden="true"
+	><path
+		d="M21 7.6V20.4C21 20.7314 20.7314 21 20.4 21H7.6C7.26863 21 7 20.7314 7 20.4V7.6C7 7.26863 7.26863 7 7.6 7H20.4C20.7314 7 21 7.26863 21 7.6Z"
 		stroke-linecap="round"
 		stroke-linejoin="round"
-		stroke-width="2"
-		d="m3 16 5-7 6 6.5m6.5 2.5L16 13l-4.286 6M14 10h.01M4 19h16a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1Z"
-	/>
-</svg>
+	></path><path
+		d="M18 4H4.6C4.26863 4 4 4.26863 4 4.6V18"
+		stroke-linecap="round"
+		stroke-linejoin="round"
+	></path><path d="M7 16.8L12.4444 15L21 18" stroke-linecap="round" stroke-linejoin="round"
+	></path><path
+		d="M16.5 13C15.6716 13 15 12.3284 15 11.5C15 10.6716 15.6716 10 16.5 10C17.3284 10 18 10.6716 18 11.5C18 12.3284 17.3284 13 16.5 13Z"
+		stroke-linecap="round"
+		stroke-linejoin="round"
+	></path></svg
+>

src/lib/components/icons/Terminal.svelte

@@ -0,0 +1,23 @@
+<script lang="ts">
+	export let className = 'w-4 h-4';
+	export let strokeWidth = '1.5';
+</script>
+
+<svg
+	xmlns="http://www.w3.org/2000/svg"
+	fill="none"
+	viewBox="0 0 24 24"
+	stroke-width={strokeWidth}
+	stroke="currentColor"
+	class={className}
+	aria-hidden="true"
+	><path d="M13 16H18" stroke-linecap="round" stroke-linejoin="round"></path><path
+		d="M6 8L10 12L6 16"
+		stroke-linecap="round"
+		stroke-linejoin="round"
+	></path><path
+		d="M2 18V6C2 4.89543 2.89543 4 4 4H20C21.1046 4 22 4.89543 22 6V18C22 19.1046 21.1046 20 20 20H4C2.89543 20 2 19.1046 2 18Z"
+		stroke-linecap="round"
+		stroke-linejoin="round"
+	></path></svg
+>