From 84e0d2b944ca354459db0292d0f3bb4eaec0de5c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?David=20Majdand=C5=BEi=C4=87?=
 <david.majdandzic@hotmail.com>
Date: Thu, 13 Jun 2024 18:15:19 +0200
Subject: [PATCH] Format tables properly

---
 .../Energy/AggregatedFood/AggregatedFoodTable.svelte |  6 +++---
 src/lib/components/Energy/Food/EmptyFoodComp.svelte  |  2 --
 src/lib/components/Energy/Food/FoodTable.svelte      | 12 ++++++------
 src/lib/components/Weight/EmptyWeightComp.svelte     |  5 ++---
 src/lib/components/Weight/WeightTable.svelte         |  4 ++--
 5 files changed, 13 insertions(+), 16 deletions(-)

diff --git a/src/lib/components/Energy/AggregatedFood/AggregatedFoodTable.svelte b/src/lib/components/Energy/AggregatedFood/AggregatedFoodTable.svelte
index 2982aa3..8a353a7 100644
--- a/src/lib/components/Energy/AggregatedFood/AggregatedFoodTable.svelte
+++ b/src/lib/components/Energy/AggregatedFood/AggregatedFoodTable.svelte
@@ -85,13 +85,13 @@
 </script>
 
 <template>
-	<Line data="{data}" />
-	<div class="relative flex flex-col h-screen" data-vaul-drawer-wrapper id="page">
+	<Line data="{data}" class="max-h-[50vh] h-[50vh]" />
+	<div class="relative flex flex-col h-[43vh]" data-vaul-drawer-wrapper id="page">
 		<div class="relative overflow-x-auto shadow-md sm:rounded-lg">
 			<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
 				<thead class="text-xs text-gray-700 uppercase dark:text-gray-400">
 				<tr>
-					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-2/12" scope="col">
 						Period
 					</th>
 					<th class="px-6 py-3" scope="col">
diff --git a/src/lib/components/Energy/Food/EmptyFoodComp.svelte b/src/lib/components/Energy/Food/EmptyFoodComp.svelte
index f607090..5b425a1 100644
--- a/src/lib/components/Energy/Food/EmptyFoodComp.svelte
+++ b/src/lib/components/Energy/Food/EmptyFoodComp.svelte
@@ -93,7 +93,5 @@
 		    contenteditable="true"
 		    on:keydown={update}>
 		</td>
-		<td class="px-6 py-4">
-		</td>
 	</tr>
 </template>
diff --git a/src/lib/components/Energy/Food/FoodTable.svelte b/src/lib/components/Energy/Food/FoodTable.svelte
index 26a920f..3b5c136 100644
--- a/src/lib/components/Energy/Food/FoodTable.svelte
+++ b/src/lib/components/Energy/Food/FoodTable.svelte
@@ -61,22 +61,22 @@
 			<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
 				<thead class="text-xs text-gray-700 uppercase dark:text-gray-400">
 				<tr>
-					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-2/12" scope="col">
 						Date
 					</th>
-					<th class="px-6 py-3" scope="col">
+					<th class="px-6 py-3 w-3/12" scope="col">
 						Food
 					</th>
-					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-4/12" scope="col">
 						Description
 					</th>
-					<th class="px-6 py-3" scope="col">
+					<th class="px-6 py-3 w-1/12" scope="col">
 						Amount
 					</th>
-					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-1/12" scope="col">
 						Cal Per 100
 					</th>
-					<th class="px-6 py-3" scope="col">
+					<th class="px-6 py-3 w-1/12" scope="col">
 						Energy
 					</th>
 				</tr>
diff --git a/src/lib/components/Weight/EmptyWeightComp.svelte b/src/lib/components/Weight/EmptyWeightComp.svelte
index 6cf3aab..8da8e67 100644
--- a/src/lib/components/Weight/EmptyWeightComp.svelte
+++ b/src/lib/components/Weight/EmptyWeightComp.svelte
@@ -7,9 +7,10 @@
 	let item: Weight = {
 		weight: 0
 	}
-	let weight: string = item.weight.toString()
+	let weight: string | null = null
 
 	async function update(event: KeyboardEvent & { currentTarget: (EventTarget & HTMLTableCellElement) }) {
+		if (!weight) return
 		weight = weight.trim()
 
 		if (event.key == 'Enter') {
@@ -44,7 +45,5 @@
 		    autofocus
 		    on:keydown={update}>
 		</td>
-		<td class="px-6 py-4">
-		</td>
 	</tr>
 </template>
diff --git a/src/lib/components/Weight/WeightTable.svelte b/src/lib/components/Weight/WeightTable.svelte
index ee29d03..2a3574f 100644
--- a/src/lib/components/Weight/WeightTable.svelte
+++ b/src/lib/components/Weight/WeightTable.svelte
@@ -28,10 +28,10 @@
 			<table class="w-full text-sm text-left rtl:text-right text-gray-500 dark:text-gray-400">
 				<thead class="text-xs text-gray-700 uppercase dark:text-gray-400">
 				<tr>
-					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800" scope="col">
+					<th class="px-6 py-3 bg-gray-50 dark:bg-gray-800 w-2/12" scope="col">
 						Date
 					</th>
-					<th class="px-6 py-3" scope="col">
+					<th class="px-6 py-3 w-10/12" scope="col">
 						Weight
 					</th>
 				</tr>