diff --git a/apps/docs/public/sponsored-by-vercel.svg b/apps/docs/public/sponsored-by-vercel.svg
new file mode 100644
index 000000000..0969a0fa9
--- /dev/null
+++ b/apps/docs/public/sponsored-by-vercel.svg
@@ -0,0 +1,11 @@
+
diff --git a/apps/docs/src/components/icons/vercel.tsx b/apps/docs/src/components/icons/vercel.tsx
index 0d9331069..ebe68b530 100644
--- a/apps/docs/src/components/icons/vercel.tsx
+++ b/apps/docs/src/components/icons/vercel.tsx
@@ -1,39 +1,42 @@
import * as React from 'react';
import withDefaults from '@utils/with-defaults';
+import { Icon } from './index';
interface Props {
width?: number;
height?: number;
+ fill?: string;
className?: string;
}
const defaultProps = {
- width: 212,
height: 44,
+ fill: 'currentColor',
className: ''
};
-const Vercel: React.FC = ({ width, height, className, ...props }) => {
+const Vercel: React.FC = ({
+ fill,
+ width,
+ height,
+ className,
+ ...props
+}) => {
return (
-
+
);
};
-const MemoVercel = React.memo(Vercel);
-
-export default withDefaults(MemoVercel, defaultProps);
+export default withDefaults(Vercel, defaultProps);
diff --git a/apps/docs/src/components/vercel-callout/vercel-callout.tsx b/apps/docs/src/components/vercel-callout/vercel-callout.tsx
index c51b99d4b..d3cf2c616 100644
--- a/apps/docs/src/components/vercel-callout/vercel-callout.tsx
+++ b/apps/docs/src/components/vercel-callout/vercel-callout.tsx
@@ -1,6 +1,7 @@
import React from 'react';
import { VercelLogo } from '@components';
-import { Link } from '@nextui-org/react';
+import { Link, Text } from '@nextui-org/react';
+import { darkTheme, lightTheme } from '@theme/shared';
const VercelCallout: React.FC = () => {
return (
@@ -8,9 +9,25 @@ const VercelCallout: React.FC = () => {
target="_blank"
rel="noopener noreferrer"
href="https://www.vercel.com?utm_source=nextui&utm_marketing=oss"
- css={{ mt: '$6', d: 'flex', jc: 'flex-end' }}
+ css={{
+ mt: '$6',
+ d: 'flex',
+ jc: 'flex-end',
+ ai: 'center',
+ '& svg': {
+ [`.${darkTheme} &`]: {
+ color: '$white'
+ },
+ [`.${lightTheme} &`]: {
+ color: '$black'
+ }
+ }
+ }}
>
-
+
+ Sponsored by
+
+
);
};
diff --git a/packages/react/README.md b/packages/react/README.md
index 51ff754c6..68180f9bb 100644
--- a/packages/react/README.md
+++ b/packages/react/README.md
@@ -22,7 +22,7 @@
- 
+ 