fix(docs): replace twitter logo/links with x logo/links (#3815)

* fix(docs): replace Twitter logo/links with X logo/links * docs: update twitter references to x * docs: update changeset for twitter to x changes * docs: update twitter references to x * docs: update twitter references to x * chore(docs): undo .sponsorsrc since it's generated * refactor(docs): remove unnecessary classes * chore(docs): undo .sponsorsrc since it's generated --------- Co-authored-by: WK Wong <wingkwong.code@gmail.com>
nextui-org · Sep 29, 2024 · e308198 · e308198
1 parent 5d9f338
commit e308198
Show file tree

Hide file tree

Showing 16 changed files with 38 additions and 34 deletions.
diff --git a/.changeset/slimy-cats-brush.md b/.changeset/slimy-cats-brush.md
@@ -0,0 +1,4 @@
+---
+---
+
+Update Twitter logo, links, and named references to X. Removed Twitter logo from social based on review feedback.
diff --git a/.github/ISSUE_TEMPLATE/config.yml b/.github/ISSUE_TEMPLATE/config.yml
@@ -6,6 +6,6 @@ contact_links:
   - name: 💬 Discord Community Chat
     url: https://discord.gg/9b6yyZKmH4
     about: Ask quick questions or simply chat on the `NextUI` community Discord server.
-  - name: 💬 New Updates (Twitter)
-    url: https://twitter.com/getnextui
-    about: Link to our twitter account if you want to follow us and stay up to date with NextUI news
+  - name: 💬 New Updates (X)
+    url: https://x.com/getnextui
+    about: Link to our X account if you want to follow us and stay up to date with NextUI news
diff --git a/apps/docs/components/icons/social.tsx b/apps/docs/components/icons/social.tsx
@@ -58,11 +58,11 @@ const DiscordIcon: React.FC<IconSvgProps> = ({size = 24, width, height, ...props
   );
 };
 
-const TwitterIcon: React.FC<IconSvgProps> = ({size = 24, width, height, ...props}) => {
+const XIcon: React.FC<IconSvgProps> = ({size = 20, width, height, ...props}) => {
   return (
     <svg height={size || height} viewBox="0 0 24 24" width={size || width} {...props}>
       <path
-        d="M19.633 7.997c.013.175.013.349.013.523 0 5.325-4.053 11.461-11.46 11.461-2.282 0-4.402-.661-6.186-1.809.324.037.636.05.973.05a8.07 8.07 0 0 0 5.001-1.721 4.036 4.036 0 0 1-3.767-2.793c.249.037.499.062.761.062.361 0 .724-.05 1.061-.137a4.027 4.027 0 0 1-3.23-3.953v-.05c.537.299 1.16.486 1.82.511a4.022 4.022 0 0 1-1.796-3.354c0-.748.199-1.434.548-2.032a11.457 11.457 0 0 0 8.306 4.215c-.062-.3-.1-.611-.1-.923a4.026 4.026 0 0 1 4.028-4.028c1.16 0 2.207.486 2.943 1.272a7.957 7.957 0 0 0 2.556-.973 4.02 4.02 0 0 1-1.771 2.22 8.073 8.073 0 0 0 2.319-.624 8.645 8.645 0 0 1-2.019 2.083z"
+        d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"
         fill="currentColor"
       />
     </svg>
@@ -454,7 +454,7 @@ const TypescriptIcon: React.FC<IconSvgProps> = ({width = "1em", height = "1em",
 };
 
 export {
-  TwitterIcon,
+  XIcon,
   DiscordIcon,
   GithubIcon,
   OpenCollectiveIcon,

diff --git a/apps/docs/components/marketing/features-grid.tsx b/apps/docs/components/marketing/features-grid.tsx
@@ -72,7 +72,7 @@ export const FeaturesGrid: React.FC<FeaturesGridProps> = ({features, classNames,
           <CardHeader className={slots.header({class: classNames?.header})}>
             <div className={slots.iconWrapper({class: classNames?.iconWrapper})}>{feat.icon}</div>
             <p className={slots.title({class: classNames?.title})}>{feat.title}</p>
-            {feat.isExternal && <LinkIcon className="text-white" height={18} width={18} />}
+            {feat.isExternal && <LinkIcon height={18} width={18} />}
           </CardHeader>
           {feat.description ? (
             <CardBody className={slots.body({class: classNames?.body})}>

diff --git a/apps/docs/components/navbar.tsx b/apps/docs/components/navbar.tsx
@@ -34,7 +34,7 @@ import {currentVersion} from "@/utils/version";
 import {siteConfig} from "@/config/site";
 import {Route} from "@/libs/docs/page";
 import {LargeLogo, SmallLogo, ThemeSwitch} from "@/components";
-import {TwitterIcon, GithubIcon, DiscordIcon, SearchLinearIcon} from "@/components/icons";
+import {XIcon, GithubIcon, DiscordIcon, SearchLinearIcon} from "@/components/icons";
 import {useIsMounted} from "@/hooks/use-is-mounted";
 import {DocsSidebar} from "@/components/docs/sidebar";
 import {useCmdkStore} from "@/components/cmdk";
@@ -325,12 +325,12 @@ export const Navbar: FC<NavbarProps> = ({children, routes, mobileRoutes = [], sl
         <NavbarItem className="hidden sm:flex">
           <Link
             isExternal
-            aria-label="Twitter"
+            aria-label="X"
             className="p-1"
             href={siteConfig.links.twitter}
             onPress={() => handlePressNavbarItem("Twitter", siteConfig.links.twitter)}
           >
-            <TwitterIcon className="text-default-600 dark:text-default-500" />
+            <XIcon className="text-default-600 dark:text-default-500" />
           </Link>
           <Link
             isExternal

diff --git a/apps/docs/config/site.ts b/apps/docs/config/site.ts
@@ -32,7 +32,7 @@ export const siteConfig = {
   },
   links: {
     github: "https://github.com/nextui-org/nextui",
-    twitter: "https://twitter.com/getnextui",
+    twitter: "https://x.com/getnextui",
     docs: "https://nextui-docs-v2.vercel.app",
     discord: "https://discord.gg/9b6yyZKmH4",
     sponsor: "https://patreon.com/jrgarciadev",

diff --git a/apps/docs/content/blog/nextui-v2.mdx b/apps/docs/content/blog/nextui-v2.mdx
@@ -7,7 +7,7 @@ tags: ["nextui", "tailwindcss", "react", "nextjs", "react-server-components"]
 author:
   name: "Junior Garcia"
   username: "@jrgarciadev"
-  link: "https://twitter.com/jrgarciadev"
+  link: "https://x.com/jrgarciadev"
   avatar: "/avatars/junior-garcia.jpeg"
 ---
 
@@ -91,7 +91,7 @@ Thanks to the switch to TailwindCSS, **NextUI v2.0** now supports React Server C
 improves performance and allows you to use it with the latest versions of [React](https://reactjs.org/) and
 [Next.js](https://nextjs.org/).
 
-NextUI components already include the `use client;` directive so you can import them directly 
+NextUI components already include the `use client;` directive so you can import them directly
 in your React Server Components (RSC).
 
 ```jsx

diff --git a/apps/docs/content/blog/v2.1.0.mdx b/apps/docs/content/blog/v2.1.0.mdx
@@ -7,7 +7,7 @@ tags: ["nextui", "select", "listbox", "scroll-shadow", "multi-select"]
 author:
   name: "Junior Garcia"
   username: "@jrgarciadev"
-  link: "https://twitter.com/jrgarciadev"
+  link: "https://x.com/jrgarciadev"
   avatar: "/avatars/junior-garcia.jpeg"
 ---
 
@@ -124,7 +124,7 @@ The new **Listbox** component includes:
 
 ### Custom Styles
 
-The Listbox components offers multiple customization options. 
+The Listbox components offers multiple customization options.
 
 <CodeDemo title="Custom Styles" files={listboxContent.customStyles} />
 

diff --git a/apps/docs/content/blog/v2.2.0.mdx b/apps/docs/content/blog/v2.2.0.mdx
@@ -7,7 +7,7 @@ tags: ["nextui", "autocomplete", "breadcrumbs", "client side router", "slider"]
 author:
   name: "Junior Garcia"
   username: "@jrgarciadev"
-  link: "https://twitter.com/jrgarciadev"
+  link: "https://x.com/jrgarciadev"
   avatar: "/avatars/junior-garcia.jpeg"
 ---
 

diff --git a/apps/docs/content/blog/v2.3.0.mdx b/apps/docs/content/blog/v2.3.0.mdx
@@ -7,7 +7,7 @@ tags: ["nextui", "cli", "date picker", "time input", "date input", "calendar"]
 author:
   name: "Junior Garcia"
   username: "@jrgarciadev"
-  link: "https://twitter.com/jrgarciadev"
+  link: "https://x.com/jrgarciadev"
   avatar: "/avatars/junior-garcia.jpeg"
 ---
 
@@ -209,7 +209,7 @@ Go to the [DateRangePicker documentation](/docs/components/date-range-picker) to
 
 ### Calendar Presets
 
-`Calendar` and `RangeCalendar` components support adding custom content at the top and bottom of the calendar, this is useful for adding presets or 
+`Calendar` and `RangeCalendar` components support adding custom content at the top and bottom of the calendar, this is useful for adding presets or
 custom actions to the calendar.
 
 Here's an example of how to add presets to the `Calendar` component:
@@ -299,7 +299,7 @@ export function Providers({children}: ProvidersProps) {
 
 ### Removal of the `units` creation
 
-To improve performance and reduce bundle size, we have removed the `units` creation from the 
+To improve performance and reduce bundle size, we have removed the `units` creation from the
 `nextui` plugin. [TailwindCSS v3.4](https://tailwindcss.com/blog/tailwindcss-v3-4) added support for `min-h-*` and `min-w-*` classes, so it is no longer needed.
 
 How to upgrade:
@@ -339,7 +339,7 @@ export const MyButton = () => {
 
 ### Separation for `errorMessage` and `isInvalid`
 
-We are currently working on supporting multiple types of validation, including native HTML constraint validation, custom validation, and real-time validation. 
+We are currently working on supporting multiple types of validation, including native HTML constraint validation, custom validation, and real-time validation.
 Due to this reason, the requirements for displaying error messages have become more varied, and it is necessary to handle validation conditions separately from the `errorMessage`.
 
 How to upgrade:
@@ -381,7 +381,7 @@ That's it! Your project should now be using the latest version of TailwindCSS an
 **Improvements**
 - Framer Motion was updated to the latest version, improving performance and reducing bundle size. [Docs](https://www.framer.com/motion/guide-reduce-bundle-size/) [PR](https://github.com/nextui-org/nextui/pull/2464) - [@mezotv](https://github.com/mezotv)
 - `LazyMotion` was added to all components that use Framer Motion, improving performance by only loading the required motion components.
-- We removed the custom `units` creation from the `nextui` plugin, it is no longer needed with TailwindCSS v3.4 and above. [PR](https://github.com/nextui-org/nextui/pull/2713) - [@jrgarciadev](https://github.com/jrgarciadev) 
+- We removed the custom `units` creation from the `nextui` plugin, it is no longer needed with TailwindCSS v3.4 and above. [PR](https://github.com/nextui-org/nextui/pull/2713) - [@jrgarciadev](https://github.com/jrgarciadev)
 - Updated `framer-motion` package across various components and utilities to version `11.0.22` for enhanced performance and consistency. [PR](https://github.com/nextui-org/nextui/pull/2596) - [@wingkwong](https://github.com/wingkwong)
 - Ensured compatibility with `react@18.2.0` and `react-dom@18.2.0` across the board. [PR](https://github.com/nextui-org/nextui/pull/2596) - [@wingkwong](https://github.com/wingkwong)
 - Introduced patches for NextUI components to improve animations, including support for keyframes with spring and inertia animations. [PR](https://github.com/nextui-org/nextui/pull/2596) - [@wingkwong](https://github.com/wingkwong)
@@ -402,8 +402,8 @@ That's it! Your project should now be using the latest version of TailwindCSS an
 - Layout docs updated to remove the `units` configuration from the `tailwind.config.(js|ts)` file.
 
 
-Special thanks to NextUI Team members [@kuri-sun](https://github.com/kuri-sun), [@ryo-manba](https://github.com/ryo-manba), 
-[@sudongyuer](https://github.com/sudongyuer), [@winchesHe](https://github.com/winchesHe), [@wingkwong](https://github.com/wingkwong), 
+Special thanks to NextUI Team members [@kuri-sun](https://github.com/kuri-sun), [@ryo-manba](https://github.com/ryo-manba),
+[@sudongyuer](https://github.com/sudongyuer), [@winchesHe](https://github.com/winchesHe), [@wingkwong](https://github.com/wingkwong),
 [@tianenpang](https://github.com/tianenpang), [@smultar](https://github.com/smultar) and contributors for their contributions to this release.
 
 For a full list of changes, please refer to the [release notes](https://github.com/nextui-org/nextui/releases/tag/%40nextui-org%2Freact%402.3.0).

diff --git a/apps/docs/content/components/checkbox-group/custom-styles.ts b/apps/docs/content/components/checkbox-group/custom-styles.ts
@@ -58,7 +58,7 @@ export default function App() {
             name: "Junior Garcia",
             avatar: "https://avatars.githubusercontent.com/u/30373425?v=4",
             username: "jrgarciadev",
-            url: "https://twitter.com/jrgarciadev",
+            url: "https://x.com/jrgarciadev",
             role: "Software Developer",
             status: "Active",
           }}

diff --git a/apps/docs/content/components/checkbox/custom-styles.ts b/apps/docs/content/components/checkbox/custom-styles.ts
@@ -7,13 +7,13 @@ export default function App() {
     name: "Junior Garcia",
     avatar: "https://avatars.githubusercontent.com/u/30373425?v=4",
     username: "jrgarciadev",
-    url: "https://twitter.com/jrgarciadev",
+    url: "https://x.com/jrgarciadev",
     role: "Software Developer",
     status: "Active",
   }
 
   return (
-    <Checkbox       
+    <Checkbox
       aria-label={user.name}
       classNames={{
         base: cn(

diff --git a/apps/docs/content/components/user/link-description.ts b/apps/docs/content/components/user/link-description.ts
@@ -2,10 +2,10 @@ const App = `import {User, Link} from "@nextui-org/react";
 
 export default function App() {
   return (
-    <User   
+    <User
       name="Junior Garcia"
       description={(
-        <Link href="https://twitter.com/jrgarciadev" size="sm" isExternal>
+        <Link href="https://x.com/jrgarciadev" size="sm" isExternal>
           @jrgarciadev
         </Link>
       )}

diff --git a/apps/docs/libs/constants.tsx b/apps/docs/libs/constants.tsx
@@ -1,14 +1,14 @@
-import {DiscordIcon, GithubIcon, TwitterIcon} from "@/components/icons";
+import {DiscordIcon, GithubIcon, XIcon} from "@/components/icons";
 
 export const TWITTER_USER_NAME = "getnextui";
 export const SITE_URL = "https://nextui.org";
 
 export const communityAccounts = [
   {
-    title: "Twitter",
+    title: "X",
     description: "For announcements, tips and general information.",
-    icon: <TwitterIcon className="text-[#00ACEE]" size={32} />,
-    href: "https://twitter.com/getnextui",
+    icon: <XIcon className="text-[#333] dark:text-[#E7E7E7]" size={28} />,
+    href: "https://x.com/getnextui",
     isExternal: true,
   },
   {

diff --git a/packages/components/user/stories/user.stories.tsx b/packages/components/user/stories/user.stories.tsx
@@ -58,7 +58,7 @@ export const WithLinkDescription = {
   args: {
     name: "Junior Garcia",
     description: (
-      <Link href="https://twitter.com/jrgarciadev" size="sm">
+      <Link href="https://x.com/jrgarciadev" size="sm">
         @jrgarciadev
       </Link>
     ),

diff --git a/packages/core/react/README.md b/packages/core/react/README.md
@@ -47,7 +47,7 @@ We're excited to see the community adopt NextUI, raise issues, and provide feedb
 Whether it's a feature request, bug report, or a project to showcase, please get involved!
 
 - [Discord](https://discord.gg/9b6yyZKmH4)
-- [Twitter](https://twitter.com/getnextui)
+- [X](https://x.com/getnextui)
 - [GitHub Discussions](https://github.com/nextui-org/nextui/discussions)
 
 ## Contributing