website refactor

apps/website/ui/Logo.tsx

@@ -24,29 +24,39 @@ export const Logo = ({
   variant = 'muted',
   border = true,
 }: LogoProps) => {
+  const finalSize = typeof size === 'number' ? `${size}px` : size;
+
   return (
     <Surface
       variant={variant}
       rounded={rounded}
       border={border}
       style={{ 
-        width: size, 
-        height: size, 
+        width: finalSize, 
+        height: finalSize, 
+        minWidth: finalSize,
+        minHeight: finalSize,
         display: 'flex', 
         alignItems: 'center', 
         justifyContent: 'center', 
         overflow: 'hidden',
-        flexShrink: 0
+        flexShrink: 0,
+        position: 'relative',
+        backgroundColor: 'var(--ui-color-bg-base)',
       }}
     >
       {src ? (
         <Image
           src={src}
           alt={alt}
-          style={{ width: '100%', height: '100%', objectFit: 'contain', padding: '10%' }}
+          style={{ 
+            width: '100%', 
+            height: '100%', 
+            objectFit: 'cover',
+          }}
         />
       ) : icon ? (
-        <Icon icon={icon} size={typeof size === 'number' ? (size > 32 ? 5 : 4) : 5} intent="low" />
+        <Icon icon={icon} size={typeof size === 'number' ? (size > 32 ? 6 : 4) : 6} intent="low" />
       ) : null}
     </Surface>
   );