chore: server-side render partners (#8431)

Author: avivkeller

…on/Partners/PartnerLogo/index.module.css …/Partners/PartnerButton/index.module.cssapps/site/components/Common/Partners/PartnerLogo/index.module.css renamed to apps/site/components/Common/Partners/PartnerButton/index.module.css apps/site/components/Common/Partners/PartnerLogo/index.module.css renamed to apps/site/components/Common/Partners/PartnerButton/index.module.css

@@ -1,6 +1,6 @@
 @reference "../../../../styles/index.css";
 
-.partnerIcon {
+.large {
   @apply flex
     h-28
     max-h-28
@@ -17,3 +17,14 @@
       !w-auto;
   }
 }
+
+.small {
+  @apply h-9
+    w-auto
+    min-w-9;
+
+  svg {
+    @apply h-4
+      w-auto;
+  }
+}

apps/site/components/Common/Partners/PartnerButton/index.tsx

@@ -0,0 +1,26 @@
+import Button from '#site/components/Common/Button';
+
+import type { AnchorHTMLAttributes, FC } from 'react';
+
+import style from './index.module.css';
+
+type PartnerProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
+  size?: 'large' | 'small';
+};
+
+const PartnerButton: FC<PartnerProps> = ({
+  href,
+  size = 'small',
+  ...props
+}) => (
+  <Button
+    kind="secondary"
+    href={`${href}/?utm_source=nodejs-website&utm_medium=Link`}
+    rel="sponsored noopener"
+    target="_blank"
+    className={style[size]}
+    {...props}
+  />
+);
+
+export default PartnerButton;

apps/site/components/Common/Partners/PartnerIcon/index.module.css

@@ -0,0 +1,22 @@
+@reference "../../../styles/index.css";
+
+.small {
+  @apply flex
+    flex-row
+    flex-wrap
+    items-center
+    gap-2;
+}
+
+.large {
+  @apply grid
+    w-full
+    grid-cols-[repeat(auto-fill,minmax(240px,1fr))]
+    gap-4;
+}
+
+.tooltip {
+  @apply p-2
+    text-neutral-900
+    dark:text-neutral-200;
+}