docs: harmonize pre and a tags for mdx

Author: maiieul

apps/website/src/components/mdx-components/index.tsx

@@ -75,6 +75,20 @@ export const components: Record<string, Component> = {
       </h5>
     );
   }),
+  a: component$<PropsOf<'a'>>(({ ...props }) => {
+    return (
+      <a
+        {...props}
+        class={[
+          cn('font-semibold underline underline-offset-4 hover:opacity-90', props.class),
+        ]}
+        target="_blank"
+        rel="noreferrer"
+      >
+        <Slot />
+      </a>
+    );
+  }),
   blockquote: component$(() => {
     return (
       <Note>

apps/website/src/global.css

@@ -1221,7 +1221,15 @@
     @apply border-border;
   }
   body {
-    @apply bg-background text-foreground;
+    @apply bg-background font-sans text-foreground;
+  }
+
+  p code {
+    @apply rounded-sm border-b-2 bg-accent px-2 py-0.5;
+  }
+
+  pre code {
+    @apply whitespace-pre-wrap;
   }
 
   *::-webkit-scrollbar {