started on battery life calculator

src/routes/tools/comps/ToolButton.svelte

@@ -0,0 +1,27 @@
+<script lang="ts">
+    import type { SvelteComponent } from "svelte";
+
+    export let icon: typeof SvelteComponent | undefined = undefined;
+
+    export let title: string = "Sleeping battery life";
+    export let desc: string = "Calculates the battery life depending on sleep and non-sleep power usage.";
+    export let btnText: string = "To calculator";
+    export let btnHref: string = "/tools/battery-life-calculator";
+</script>
+
+<div class="min-w-10 min-h-10 bg-base-100 rounded-lg">
+    <div class="p-4">
+        <div class="flex">
+            <div class="font-bold text-xl">{title}</div>
+            
+        </div>
+        <div class="text-sm">{desc}</div>
+
+        <div class="flex pt-4">
+            {#if icon != undefined}
+            <svelte:component this={icon}/>
+            {/if}
+            <a href="{btnHref}" class="btn ml-auto btn-primary btn-sm">{btnText}</a>
+        </div>
+    </div>
+</div>