Updated more components

exceptionless · Dec 3, 2023 · 15a2bd9 · 15a2bd9
1 parent 424befd
commit 15a2bd9
Show file tree

Hide file tree

Showing 11 changed files with 47 additions and 40 deletions.
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/EventErrorSummary.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/EventErrorSummary.svelte
@@ -28,7 +28,7 @@
 </div>
 
 {#if source.data.Path}
-	<div class="hidden sm:block ml-6 text-sm text-gray-500 dark:text-gray-400">
+	<div class="hidden ml-6 text-sm sm:block text-muted-foreground">
 		<IconChevronRight class="inline" />
 		<span class="inline line-clamp-1">{source.data.Path}</span>
 	</div>

diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/EventSimpleSummary.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/EventSimpleSummary.svelte
@@ -12,7 +12,7 @@
 </div>
 
 {#if source.data.Path}
-	<div class="hidden sm:block ml-6 text-sm text-gray-500 dark:text-gray-400">
+	<div class="hidden ml-6 text-sm sm:block text-muted-foreground">
 		<IconChevronRight class="inline" />
 		<span class="inline line-clamp-1">{source.data.Path}</span>
 	</div>

diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/StackErrorSummary.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/StackErrorSummary.svelte
@@ -36,7 +36,7 @@
 </div>
 
 {#if source.data.Path}
-	<div class="hidden sm:block ml-6 text-sm text-gray-500 dark:text-gray-400">
+	<div class="hidden ml-6 text-sm sm:block text-muted-foreground">
 		<IconChevronRight class="inline" />
 		<span class="inline line-clamp-1">{source.data.Path}</span>
 	</div>

diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/StackSimpleSummary.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/events/summary/StackSimpleSummary.svelte
@@ -26,7 +26,7 @@
 </div>
 
 {#if source.data.Path}
-	<div class="hidden sm:block ml-6 text-sm text-gray-500 dark:text-gray-400">
+	<div class="hidden ml-6 text-sm sm:block text-muted-foreground">
 		<IconChevronRight class="inline" />
 		<span class="inline line-clamp-1">{source.data.Path}</span>
 	</div>

diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/events/table/EventsTailLogTable.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/events/table/EventsTailLogTable.svelte
@@ -165,7 +165,7 @@
 		{loading}
 		{lastUpdated}
 	>
-		<p class="py-2 text-center text-sm text-gray-700 dark:text-white">
+		<p class="py-2 text-sm text-center text-muted-foreground">
 			{#if $loading}
 				<Loading></Loading>
 			{:else if response?.problem?.errors.general}

diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/table/Pager.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/table/Pager.svelte
@@ -3,30 +3,36 @@
 	import NavigateBeforeIcon from '~icons/mdi/navigate-before';
 	import NavigateNextIcon from '~icons/mdi/navigate-next';
 	import { createEventDispatcher } from 'svelte';
+	import { Button } from '$comp/ui/button';
 
 	export let canNavigateToFirstPage: boolean;
 	export let hasPrevious: boolean;
 	export let hasNext: boolean;
 
 	const dispatch = createEventDispatcher();
+
+	function navigateToFirstPage(e: Event) {
+		e.preventDefault();
+		dispatch('navigatetofirstpage');
+	}
+
+	function navigateToPreviousPage(e: Event) {
+		e.preventDefault();
+		dispatch('previous');
+	}
+
+	function navigateToNextPage(e: Event) {
+		e.preventDefault();
+		dispatch('next');
+	}
 </script>
 
-<div class="join text-gray-900 dark:text-white">
-	{#if canNavigateToFirstPage}
-		<button
-			class="btn btn-square btn-outline join-item btn-sm"
-			on:click|preventDefault={() => dispatch('navigatetofirstpage')}
-			><FirstPageIcon /></button
-		>
-	{/if}
-	<button
-		class="btn btn-square btn-outline join-item btn-sm"
-		disabled={!hasPrevious}
-		on:click|preventDefault={() => dispatch('previous')}><NavigateBeforeIcon /></button
-	>
-	<button
-		class="btn btn-square btn-outline join-item btn-sm"
-		disabled={!hasNext}
-		on:click|preventDefault={() => dispatch('next')}><NavigateNextIcon /></button
-	>
-</div>
+{#if canNavigateToFirstPage}
+	<Button on:click={navigateToFirstPage} variant="outline" size="icon"><FirstPageIcon /></Button>
+{/if}
+<Button disabled={!hasPrevious} on:click={navigateToPreviousPage} variant="outline" size="icon"
+	><NavigateBeforeIcon /></Button
+>
+<Button disabled={!hasNext} on:click={navigateToNextPage} variant="outline" size="icon"
+	><NavigateNextIcon /></Button
+>
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/table/PagerSummary.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/table/PagerSummary.svelte
@@ -12,17 +12,16 @@
 </script>
 
 {#if pageTotal !== 0 && total !== 0}
-	<p class="text-sm text-gray-900 dark:text-white">
-		Showing
-		<span class="font-medium"> <NumberFormatter value={start}></NumberFormatter></span>
-		to
-		<span class="font-medium">
+	<p class="text-sm">
+		<span class="text-muted-foreground">Showing</span>
+		<span class="font-bold"><NumberFormatter value={start}></NumberFormatter></span>-<span
+			class="font-bold"
+		>
 			<NumberFormatter value={end}></NumberFormatter>
 		</span>
-		of
-		<span class="font-medium">
+		<span class="text-muted-foreground">of</span>
+		<span class="font-bold">
 			<NumberFormatter value={total}></NumberFormatter>
 		</span>
-		results
 	</p>
 {/if}
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/table/TableColumnPicker.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/table/TableColumnPicker.svelte
@@ -39,8 +39,8 @@
 					<div class="flex items-center space-x-2">
 						<Checkbox
 							id={getColumnId(column)}
-							checked={$table.getIsAllColumnsVisible()}
-							on:click={(e) => $table.getToggleAllColumnsVisibilityHandler()(e)}
+							checked={column.getIsVisible()}
+							on:click={column.getToggleVisibilityHandler()}
 							>{column.columnDef.header}</Checkbox
 						>
 					</div>

diff --git a/src/Exceptionless.Web/ClientApp/src/lib/components/table/TableWithPagingFooter.svelte b/src/Exceptionless.Web/ClientApp/src/lib/components/table/TableWithPagingFooter.svelte
@@ -23,7 +23,7 @@
 	export let onNextPage: () => void;
 </script>
 
-<div class="flex flex-1 items-center justify-between text-xs text-gray-900 dark:text-white">
+<div class="flex items-center justify-between flex-1 text-sm text-muted-foreground">
 	<div class="py-2">
 		{#if loading}
 			<Loading></Loading>

diff --git a/src/Exceptionless.Web/ClientApp/src/lib/layouts/Footer.svelte b/src/Exceptionless.Web/ClientApp/src/lib/layouts/Footer.svelte
@@ -5,6 +5,8 @@
 	import IconGitHub from '~icons/mdi/github';
 	import IconTwitter from '~icons/mdi/twitter';
 	import IconWeb from '~icons/mdi/web';
+
+	const currentYear = new Date().getFullYear();
 </script>
 
 <Card.Root class="mx-4 my-6">
@@ -77,8 +79,8 @@
 		</div>
 	</Card.Content>
 </Card.Root>
-<p class="my-10 text-sm text-center text-gray-500">
-	&copy; 2023 <a href="https://exceptionless.com" class="hover:underline" target="_blank"
-		>Exceptionless</a
-	>. All rights reserved.
+<p class="my-10 text-sm text-center text-muted-foreground">
+	&copy; {currentYear}
+	<a href="https://exceptionless.com" class="hover:underline" target="_blank">Exceptionless</a>.
+	All rights reserved.
 </p>
diff --git a/src/Exceptionless.Web/ClientApp/src/lib/layouts/Sidebar.svelte b/src/Exceptionless.Web/ClientApp/src/lib/layouts/Sidebar.svelte
@@ -70,7 +70,7 @@
 	class="fixed inset-0 z-10 bg-gray-900/50 dark:bg-gray-900/90 {!$isLargeScreen && $isSidebarOpen
 		? ''
 		: 'hidden'}"
-    title="Close sidebar"
+	title="Close sidebar"
 	aria-label="Close sidebar"
 	on:click={onBackdropClick}
 ></button>