docs: update user guide introduction page (#11474)

* docs: update user guide introduction page

* chore: run yarn prep automatically

www/packages/docs-ui/src/components/AiAssistant/ChatWindow/Footer/index.tsx

@@ -16,10 +16,10 @@ export const AiAssistantChatWindowFooter = () => {
       <div className="flex items-center gap-docs_0.5">
         <span className="text-medusa-fg-subtle">Line break</span>
         <div className="flex items-center gap-[5px]">
-          <Kbd className="bg-medusa-bg-field-component border-medusa-border-strong w-[18px] h-[18px] inline-block">
+          <Kbd className="bg-medusa-bg-field-component border-medusa-border-strong w-[18px] h-[18px] inline-block p-0">
             ⇧
           </Kbd>
-          <Kbd className="bg-medusa-bg-field-component border-medusa-border-strong w-[18px] h-[18px] inline-block">
+          <Kbd className="bg-medusa-bg-field-component border-medusa-border-strong w-[18px] h-[18px] inline-block p-0">
             ↵
           </Kbd>
         </div>

www/packages/docs-ui/src/components/InlineIcon/index.tsx

@@ -11,7 +11,10 @@ export const InlineIcon = ({ Icon, alt, ...props }: InlineIconProps) => {
   return (
     <Icon
       {...props}
-      className={clsx("text-medusa-fg-subtle inline", props.className)}
+      className={clsx(
+        "text-medusa-fg-subtle inline-block align-middle",
+        props.className
+      )}
       aria-label={alt}
     />
   )

www/packages/docs-ui/src/components/Kbd/index.tsx

@@ -16,7 +16,7 @@ export const Kbd = ({
       className={clsx(
         "rounded-docs_xs border-solid border border-medusa-border-base",
         "inline-flex items-center justify-center",
-        "p-0",
+        "px-docs_0.25",
         "bg-medusa-bg-field",
         "text-medusa-fg-base",
         "font-base shadow-none",