small ui changes

website/src/lib/components/ButtonWithTooltip.svelte

@@ -26,7 +26,7 @@
     <Tooltip.Root>
         <Tooltip.Trigger>
             {#snippet child({ props })}
-                <Button {...props} {variant} class={className} {onclick}>
+                <Button {...props} {variant} class="bg-inherit {className}" {onclick}>
                     {@render children()}
                 </Button>
             {/snippet}

website/src/lib/components/Footer.svelte

@@ -9,7 +9,7 @@
 </script>
 
 <footer class="w-full">
-    <div class="mx-6 border-t">
+    <div class="px-6 border-t">
         <div class="mx-12 py-10 flex flex-row flex-wrap justify-between gap-x-10 gap-y-6">
             <div class="grow flex flex-col items-start">
                 <Logo class="h-8" width="153" />

website/src/lib/components/GPXStatistics.svelte

@@ -32,7 +32,7 @@
 <Card.Root
     class="h-full {orientation === 'vertical'
         ? 'min-w-40 sm:min-w-44'
-        : 'w-full h-10'} border-none shadow-none p-0 text-sm sm:text-base"
+        : 'w-full h-10'} border-none shadow-none p-0 text-sm sm:text-base bg-inherit"
 >
     <Card.Content
         class="h-full flex {orientation === 'vertical'

website/src/lib/components/Nav.svelte

@@ -7,10 +7,10 @@
 </script>
 
 <nav class="w-full sticky top-0 bg-background z-50">
-    <div class="mx-6 py-2 flex flex-row items-center border-b gap-4 sm:gap-8">
+    <div class="px-12 py-2 flex flex-row items-center border-b gap-4 sm:gap-8">
         <a
             href={getURLForLanguage(i18n.lang, '/')}
-            class="shrink-0 translate-y-0.5 justify-self-start"
+            class="shrink-0 translate-y-0.25 justify-self-start"
         >
             <Logo class="h-8 xs:hidden" iconOnly={true} width="26" />
             <Logo class="h-8 hidden xs:block" width="153" />