[docs] Replace Twitter with X (#40193)

mui · Dec 15, 2023 · 33f16fb · 33f16fb
1 parent c06b102
commit 33f16fb
Show file tree

Hide file tree

Showing 37 changed files with 90 additions and 67 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -269,7 +269,7 @@ module.exports = {
       rules: {
         'material-ui/no-hardcoded-labels': [
           'error',
-          { allow: ['MUI', 'Twitter', 'GitHub', 'Stack Overflow'] },
+          { allow: ['MUI', 'X', 'GitHub', 'Stack Overflow'] },
         ],
       },
     },

diff --git a/README.md b/README.md
@@ -23,7 +23,7 @@
 [![npm downloads](https://img.shields.io/npm/dm/@mui/material.svg)](https://www.npmjs.com/package/@mui/material)
 [![CircleCI](https://circleci.com/gh/mui/material-ui/tree/master.svg?style=shield)](https://app.circleci.com/pipelines/github/mui/material-ui?branch=master)
 [![Coverage Status](https://img.shields.io/codecov/c/github/mui/material-ui/master.svg)](https://codecov.io/gh/mui/material-ui/branch/master)
-[![Follow on Twitter](https://img.shields.io/twitter/follow/MUI_hq.svg?label=follow+MUI)](https://twitter.com/MUI_hq)
+[![Follow on X](https://img.shields.io/twitter/follow/MUI_hq.svg?label=follow+MUI)](https://twitter.com/MUI_hq)
 [![Renovate status](https://img.shields.io/badge/renovate-enabled-brightgreen.svg)](https://github.com/mui/material-ui/issues/27062)
 [![Average time to resolve an issue](https://isitmaintained.com/badge/resolution/mui/material-ui.svg)](https://isitmaintained.com/project/mui/material-ui 'Average time to resolve an issue')
 [![Open Collective backers and sponsors](https://img.shields.io/opencollective/all/mui-org)](https://opencollective.com/mui-org)

diff --git a/docs/data/joy/components/tabs/TabsBrowserExample.js b/docs/data/joy/components/tabs/TabsBrowserExample.js
@@ -42,9 +42,9 @@ export default function TabsBrowserExample() {
         </Tab>
         <Tab indicatorPlacement="top">
           <ListItemDecorator>
-            <TwitterIcon />
+            <XIcon />
           </ListItemDecorator>
-          Twitter
+          X
         </Tab>
         <Tab indicatorPlacement="top">
           <ListItemDecorator>
@@ -103,13 +103,27 @@ function GoogleIcon() {
     </SvgIcon>
   );
 }
-function TwitterIcon() {
+function XIcon() {
   return (
     <SvgIcon>
-      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 248 204">
+      <svg
+        width="350"
+        height="321"
+        viewBox="0 0 350 321"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          id="Rectangle"
+          fill="#000000"
+          fillRule="evenodd"
+          stroke="none"
+          d="M 0 321 L 350 321 L 350 0 L 0 0 Z"
+        />
         <path
-          fill="#1d9bf0"
-          d="M221.95 51.29c.15 2.17.15 4.34.15 6.53 0 66.73-50.8 143.69-143.69 143.69v-.04c-27.44.04-54.31-7.82-77.41-22.64 3.99.48 8 .72 12.02.73 22.74.02 44.83-7.61 62.72-21.66-21.61-.41-40.56-14.5-47.18-35.07 7.57 1.46 15.37 1.16 22.8-.87-23.56-4.76-40.51-25.46-40.51-49.5v-.64c7.02 3.91 14.88 6.08 22.92 6.32C11.58 63.31 4.74 33.79 18.14 10.71c25.64 31.55 63.47 50.73 104.08 52.76-4.07-17.54 1.49-35.92 14.61-48.25 20.34-19.12 52.33-18.14 71.45 2.19 11.31-2.23 22.15-6.38 32.07-12.26-3.77 11.69-11.66 21.62-22.2 27.93 10.01-1.18 19.79-3.86 29-7.95-6.78 10.16-15.32 19.01-25.2 26.16z"
+          id="Path"
+          fill="#ffffff"
+          stroke="none"
+          d="M 261 25 L 307 25 L 206 140 L 324 296 L 231.399994 296 L 158.899994 201.199997 L 75.900002 296 L 29.9 296 L 136.900009 173 L 23.9 25 L 118.800003 25 L 184.300003 111.600006 Z M 244.899994 269 L 270.399994 269 L 105.400002 51 L 78 51 Z"
         />
       </svg>
     </SvgIcon>

diff --git a/docs/data/joy/components/tabs/TabsBrowserExample.tsx b/docs/data/joy/components/tabs/TabsBrowserExample.tsx
@@ -42,9 +42,9 @@ export default function TabsBrowserExample() {
         </Tab>
         <Tab indicatorPlacement="top">
           <ListItemDecorator>
-            <TwitterIcon />
+            <XIcon />
           </ListItemDecorator>
-          Twitter
+          X
         </Tab>
         <Tab indicatorPlacement="top">
           <ListItemDecorator>
@@ -103,13 +103,27 @@ function GoogleIcon() {
     </SvgIcon>
   );
 }
-function TwitterIcon() {
+function XIcon() {
   return (
     <SvgIcon>
-      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 248 204">
+      <svg
+        width="350"
+        height="321"
+        viewBox="0 0 350 321"
+        xmlns="http://www.w3.org/2000/svg"
+      >
+        <path
+          id="Rectangle"
+          fill="#000000"
+          fillRule="evenodd"
+          stroke="none"
+          d="M 0 321 L 350 321 L 350 0 L 0 0 Z"
+        />
         <path
-          fill="#1d9bf0"
-          d="M221.95 51.29c.15 2.17.15 4.34.15 6.53 0 66.73-50.8 143.69-143.69 143.69v-.04c-27.44.04-54.31-7.82-77.41-22.64 3.99.48 8 .72 12.02.73 22.74.02 44.83-7.61 62.72-21.66-21.61-.41-40.56-14.5-47.18-35.07 7.57 1.46 15.37 1.16 22.8-.87-23.56-4.76-40.51-25.46-40.51-49.5v-.64c7.02 3.91 14.88 6.08 22.92 6.32C11.58 63.31 4.74 33.79 18.14 10.71c25.64 31.55 63.47 50.73 104.08 52.76-4.07-17.54 1.49-35.92 14.61-48.25 20.34-19.12 52.33-18.14 71.45 2.19 11.31-2.23 22.15-6.38 32.07-12.26-3.77 11.69-11.66 21.62-22.2 27.93 10.01-1.18 19.79-3.86 29-7.95-6.78 10.16-15.32 19.01-25.2 26.16z"
+          id="Path"
+          fill="#ffffff"
+          stroke="none"
+          d="M 261 25 L 307 25 L 206 140 L 324 296 L 231.399994 296 L 158.899994 201.199997 L 75.900002 296 L 29.9 296 L 136.900009 173 L 23.9 25 L 118.800003 25 L 184.300003 111.600006 Z M 244.899994 269 L 270.399994 269 L 105.400002 51 L 78 51 Z"
         />
       </svg>
     </SvgIcon>

diff --git a/docs/data/joy/main-features/color-inversion/ColorInversionAnyParent.js b/docs/data/joy/main-features/color-inversion/ColorInversionAnyParent.js
@@ -61,7 +61,7 @@ export default function ColorInversionAnyParent() {
         <Stat value="4M" description="Weekly downloads" />
         <Stat value="87k" description="Stars on GitHub" />
         <Stat value="2.7k" description="Open source contributors" />
-        <Stat value="18.4k" description="Followers on Twitter" />
+        <Stat value="18.4k" description="Followers on X" />
       </Box>
     </Box>
   );

diff --git a/docs/data/joy/main-features/color-inversion/ColorInversionAnyParent.tsx b/docs/data/joy/main-features/color-inversion/ColorInversionAnyParent.tsx
@@ -61,7 +61,7 @@ export default function ColorInversionAnyParent() {
         <Stat value="4M" description="Weekly downloads" />
         <Stat value="87k" description="Stars on GitHub" />
         <Stat value="2.7k" description="Open source contributors" />
-        <Stat value="18.4k" description="Followers on Twitter" />
+        <Stat value="18.4k" description="Followers on X" />
       </Box>
     </Box>
   );

diff --git a/docs/data/joy/main-features/color-inversion/ColorInversionAnyParentStyled.js b/docs/data/joy/main-features/color-inversion/ColorInversionAnyParentStyled.js
@@ -61,7 +61,7 @@ export default function ColorInversionAnyParentStyled() {
         <Stat value="4M" description="Weekly downloads" />
         <Stat value="87k" description="Stars on GitHub" />
         <Stat value="2.7k" description="Open source contributors" />
-        <Stat value="18.4k" description="Followers on Twitter" />
+        <Stat value="18.4k" description="Followers on X" />
       </Box>
     </StyledBox>
   );

diff --git a/docs/data/joy/main-features/color-inversion/ColorInversionAnyParentStyled.tsx b/docs/data/joy/main-features/color-inversion/ColorInversionAnyParentStyled.tsx
@@ -61,7 +61,7 @@ export default function ColorInversionAnyParentStyled() {
         <Stat value="4M" description="Weekly downloads" />
         <Stat value="87k" description="Stars on GitHub" />
         <Stat value="2.7k" description="Open source contributors" />
-        <Stat value="18.4k" description="Followers on Twitter" />
+        <Stat value="18.4k" description="Followers on X" />
       </Box>
     </StyledBox>
   );

diff --git a/docs/data/material/components/material-icons/synonyms.js b/docs/data/material/components/material-icons/synonyms.js
@@ -2948,6 +2948,7 @@ const synonyms = {
     'cancel close destination direction exit maps no pin place quit remove stop',
   Wysiwyg:
     'composer mode screen software system text view visibility website window',
+  X: 'twitter brand logo social',
   Yard: 'backyard flower garden home house nature pettle plants',
   YouTube: 'brand logo social video',
   YoutubeSearchedFor:

diff --git a/docs/data/material/getting-started/faq/faq.md b/docs/data/material/getting-started/faq/faq.md
@@ -9,7 +9,7 @@ If you still can't find what you're looking for, you can refer to our [support p
 There are many ways to support MUI:
 
 - **Spread the word**. Evangelize MUI's products by [linking to mui.com](https://mui.com/) on your website—every backlink matters.
-  Follow us on [Twitter](https://twitter.com/MUI_hq), like and retweet the important news. Or just talk about us with your friends.
+  Follow us on [X](https://twitter.com/MUI_hq), like and retweet the important news. Or just talk about us with your friends.
 - **Give us feedback**. Tell us what we're doing well or where we can improve. Please upvote (👍) the issues that you are the most interested in seeing solved.
 - **Help new users**. You can answer questions on
   [Stack Overflow](https://stackoverflow.com/questions/tagged/material-ui).

diff --git a/docs/data/material/getting-started/support/support.md b/docs/data/material/getting-started/support/support.md
@@ -38,7 +38,7 @@ If you think you've found a bug in the codebase, or you have an idea for a new f
 
 ### Social media
 
-The MUI community is active on both [Twitter](https://twitter.com/MUI_hq) and [LinkedIn](https://www.linkedin.com/company/mui/).
+The MUI community is active on both [X](https://twitter.com/MUI_hq) and [LinkedIn](https://www.linkedin.com/company/mui/).
 These are great platforms to share what you're working on and connect with other developers.
 
 Please keep in mind that we don't actively monitor direct messages on the company's social media accounts, so this is _not_ a good way to get in touch with us directly.

diff --git a/docs/data/material/getting-started/templates/blog/Blog.js b/docs/data/material/getting-started/templates/blog/Blog.js
@@ -4,7 +4,7 @@ import Grid from '@mui/material/Grid';
 import Container from '@mui/material/Container';
 import GitHubIcon from '@mui/icons-material/GitHub';
 import FacebookIcon from '@mui/icons-material/Facebook';
-import TwitterIcon from '@mui/icons-material/Twitter';
+import XIcon from '@mui/icons-material/X';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import Header from './Header';
 import MainFeaturedPost from './MainFeaturedPost';
@@ -78,7 +78,7 @@ const sidebar = {
   ],
   social: [
     { name: 'GitHub', icon: GitHubIcon },
-    { name: 'Twitter', icon: TwitterIcon },
+    { name: 'X', icon: XIcon },
     { name: 'Facebook', icon: FacebookIcon },
   ],
 };

diff --git a/docs/data/material/getting-started/templates/blog/Blog.tsx b/docs/data/material/getting-started/templates/blog/Blog.tsx
@@ -4,7 +4,7 @@ import Grid from '@mui/material/Grid';
 import Container from '@mui/material/Container';
 import GitHubIcon from '@mui/icons-material/GitHub';
 import FacebookIcon from '@mui/icons-material/Facebook';
-import TwitterIcon from '@mui/icons-material/Twitter';
+import XIcon from '@mui/icons-material/X';
 import { createTheme, ThemeProvider } from '@mui/material/styles';
 import Header from './Header';
 import MainFeaturedPost from './MainFeaturedPost';
@@ -78,7 +78,7 @@ const sidebar = {
   ],
   social: [
     { name: 'GitHub', icon: GitHubIcon },
-    { name: 'Twitter', icon: TwitterIcon },
+    { name: 'X', icon: XIcon },
     { name: 'Facebook', icon: FacebookIcon },
   ],
 };

diff --git a/docs/pages/blog.tsx b/docs/pages/blog.tsx
@@ -13,7 +13,7 @@ import Pagination from '@mui/material/Pagination';
 import Button from '@mui/material/Button';
 import KeyboardArrowRightRoundedIcon from '@mui/icons-material/KeyboardArrowRightRounded';
 import Chip from '@mui/material/Chip';
-import TwitterIcon from '@mui/icons-material/Twitter';
+import XIcon from '@mui/icons-material/X';
 import GitHubIcon from '@mui/icons-material/GitHub';
 import LinkedInIcon from '@mui/icons-material/LinkedIn';
 import YouTubeIcon from '@mui/icons-material/YouTube';
@@ -459,8 +459,7 @@ export default function Blog(props: InferGetStaticPropsType<typeof getStaticProp
                   GitHub
                 </Link>
                 <Link href="https://twitter.com/MUI_hq" target="_blank" fontSize={14}>
-                  <TwitterIcon fontSize="small" />
-                  Twitter
+                  <XIcon fontSize="small" />X
                 </Link>
                 <Link href="https://mui.com/r/discord/" target="_blank" fontSize={14}>
                   <DiscordIcon fontSize="small" />

diff --git a/docs/pages/blog/2020-introducing-sketch.md b/docs/pages/blog/2020-introducing-sketch.md
@@ -22,7 +22,7 @@ This new product brings you one step closer to this long term goal. It enables d
 ### Frequent requests
 
 Over the last few months, we have seen a growing number of designers asking for these Sketch symbols.
-For instance, there is a [Stack Overflow question](https://stackoverflow.com/questions/38834629/material-ui-sketch-files) with over 4,000 views. It has been a common request on Twitter: [one](https://twitter.com/TimoMajerski/status/1144503789619224578), [two](https://twitter.com/jonminori/status/1141121330156310528), [three](https://twitter.com/ProfessorXavior/status/1196522875706056705), [etc](https://twitter.com/JeffreyKaine/status/1133435042259120132).
+For instance, there is a [Stack Overflow question](https://stackoverflow.com/questions/38834629/material-ui-sketch-files) with over 4,000 views. It has been a common request on X: [one](https://twitter.com/TimoMajerski/status/1144503789619224578), [two](https://twitter.com/jonminori/status/1141121330156310528), [three](https://twitter.com/ProfessorXavior/status/1196522875706056705), [etc](https://twitter.com/JeffreyKaine/status/1133435042259120132).
 
 ### No great alternatives
 

diff --git a/docs/pages/blog/2023-toolpad-beta-announcement.md b/docs/pages/blog/2023-toolpad-beta-announcement.md
@@ -105,6 +105,6 @@ We plan to continue to iterate on our vision of helping you as a developer to in
 
 The best places to stay up-to-date about what we're currently working on are [GitHub issues](https://github.com/mui/mui-toolpad) and our [public roadmap](https://github.com/orgs/mui/projects/9/views/1).
 
-If you have any questions or would like to share feedback, you can directly contact the team at toolpad@mui.com or reach us on [Twitter](https://twitter.com/MUI_Toolpad). You can also engage in conversation in our [Discord](https://mui.com/r/discord/) server.
+If you have any questions or would like to share feedback, you can directly contact the team at toolpad@mui.com or reach us on [X](https://twitter.com/MUI_Toolpad). You can also engage in conversation in our [Discord](https://mui.com/r/discord/) server.
 
 If you'd like an in-depth demo and to discuss your use case, please feel free to [schedule a meeting with me on Calendly](https://calendly.com/prakhar-mui).
diff --git a/docs/pages/blog/danail-hadjiatanasov-joining.md b/docs/pages/blog/danail-hadjiatanasov-joining.md
@@ -23,4 +23,4 @@ He's now actively working on new features for the data grid.
 
 The enterprise team will continue developing the data grid component, and progressively extend to new advanced components as we grow the team. Here's a quick view of [the enterprise roadmap](https://github.com/mui/mui-x/projects/1).
 
-We couldn't be more excited to have Danail on the team! You can follow him on [Twitter](https://twitter.com/danail_h).
+We couldn't be more excited to have Danail on the team! You can follow him on [X](https://twitter.com/danail_h).
diff --git a/docs/pages/blog/discord-announcement.md b/docs/pages/blog/discord-announcement.md
@@ -10,7 +10,7 @@ card: true
 <a href="https://mui.com/r/discord/"><img src="/static/blog/discord-announcement/discord.png" width="1280" height="640" style="margin-bottom: 16px;" alt="Discord banner with link" /></a>
 
 This year, one of our highest priorities has been to create a central hub for the MUI community.
-Up until now, our community has been scattered across discussions and interactions on [Twitter](https://twitter.com/MUI_hq), [LinkedIn](https://linkedin.com/company/mui), [GitHub](https://github.com/mui), and [Stack Overflow](https://stackoverflow.com/questions/tagged/material-ui).
+Up until now, our community has been scattered across discussions and interactions on [X](https://twitter.com/MUI_hq), [LinkedIn](https://linkedin.com/company/mui), [GitHub](https://github.com/mui), and [Stack Overflow](https://stackoverflow.com/questions/tagged/material-ui).
 
 That's why we've officially launched our [Discord Server](https://mui.com/r/discord/)—and we'd love for you to be a part of our community!
 

diff --git a/docs/pages/blog/marija-najdova-joining.md b/docs/pages/blog/marija-najdova-joining.md
@@ -17,4 +17,4 @@ She is now actively working on the unstyled components and [the update of the st
 
 The community team will continue developing the foundations on which to build great design systems. Here's a quick view of [the community roadmap](https://github.com/orgs/mui/projects/18/views/1).
 
-We couldn't be more excited to have Marija on the team! You can follow her on [Twitter](https://twitter.com/marijanajdova).
+We couldn't be more excited to have Marija on the team! You can follow her on [X](https://twitter.com/marijanajdova).
diff --git a/docs/pages/blog/material-ui-v1-is-out.md b/docs/pages/blog/material-ui-v1-is-out.md
@@ -127,4 +127,4 @@ Material UI is an MIT-licensed open source project. It's an independent project
 ![Our gold sponsors](https://cdn-images-1.medium.com/max/2000/1*fx_BaOxYY0ZJo3n9iXI1Jg.png)<p class="blog-description">Our gold sponsors</p>
 
 - GitHub: https://github.com/mui/material-ui ⭐
-- Twitter: https://twitter.com/MUI_hq
+- X: https://twitter.com/MUI_hq
diff --git a/docs/pages/blog/matheus-wichman-joining.md b/docs/pages/blog/matheus-wichman-joining.md
@@ -23,7 +23,7 @@ Matheus is the first of a series of 5 new positions we have recently opened and
 We will cross the 10 person milestone in the coming weeks.
 We have opened these positions as our revenue growth allows.
 At the current pace, we will soon open new positions.
-You can [follow us on Twitter](https://twitter.com/MUI_hq) to hear about upcoming positions.
+You can [follow us on X](https://twitter.com/MUI_hq) to hear about upcoming positions.
 These new roles will help accelerate our mission, strengthen our existing offering, and initiate a new vertical.
 
 We couldn't be more excited to have Matheus on the team!
diff --git a/docs/pages/blog/spotlight-damien-tassone.md b/docs/pages/blog/spotlight-damien-tassone.md
@@ -17,4 +17,4 @@ Right from the start, Damien has made fast and significant progress. He has been
 
 The enterprise team will continue developing the data grid component, and progressively extend to new advanced components as we grow the team. Here's a quick view of [the enterprise roadmap](https://github.com/mui/mui-x/projects/1).
 
-You can follow Damien on [Twitter](https://twitter.com/madKakoO).
+You can follow Damien on [X](https://twitter.com/madKakoO).
diff --git a/docs/pages/careers/react-community-engineer.md b/docs/pages/careers/react-community-engineer.md
@@ -65,7 +65,7 @@ You will own the following responsibilities:
 
 - **Build product knowledge**. You will continually research and learn the current and future best practices of using MUI.
 - **Resolve users' issues**. You will solve these issues at two levels:
-  - On the surface, you will answer developers on GitHub, Zendesk, Twitter, email, Slack.
+  - On the surface, you will answer developers on GitHub, Zendesk, X, email, Slack.
   - At the root, you will create/update the documentation, fix bugs in collaboration with the relevant developer, implement community driven features and more.
 - **Provide feedback**. You will work alongside product managers to define and shape the product goals, roadmap, priorities, and strategy based on your frontline knowledge of customer needs.
 - **Operations**.

diff --git a/docs/public/static/branding/companies/twitter.svg b/docs/public/static/branding/companies/twitter.svg
diff --git a/docs/public/static/branding/companies/x.svg b/docs/public/static/branding/companies/x.svg
diff --git a/docs/src/components/about/Team.tsx b/docs/src/components/about/Team.tsx
@@ -10,7 +10,7 @@ import Paper, { PaperProps } from '@mui/material/Paper';
 import Typography from '@mui/material/Typography';
 import Tooltip from '@mui/material/Tooltip';
 import KeyboardArrowRightRounded from '@mui/icons-material/KeyboardArrowRightRounded';
-import TwitterIcon from '@mui/icons-material/Twitter';
+import XIcon from '@mui/icons-material/X';
 import GitHubIcon from '@mui/icons-material/GitHub';
 import LinkedInIcon from '@mui/icons-material/LinkedIn';
 import Link from 'docs/src/modules/components/Link';
@@ -155,13 +155,13 @@ function Person(props: Profile & { sx?: PaperProps['sx'] }) {
           )}
           {props.twitter && (
             <IconButton
-              aria-label={`${props.name} Twitter profile`}
+              aria-label={`${props.name} X profile`}
               component="a"
               href={`https://twitter.com/${props.twitter}`}
               target="_blank"
               rel="noreferrer noopener"
             >
-              <TwitterIcon fontSize="small" sx={{ color: 'grey.500' }} />
+              <XIcon fontSize="small" sx={{ color: 'grey.500' }} />
             </IconButton>
           )}
           {props.linkedin && (

diff --git a/docs/src/components/home/CompaniesGrid.tsx b/docs/src/components/home/CompaniesGrid.tsx
@@ -128,11 +128,11 @@ export const DESIGNKITS_CUSTOMERS: Array<IconImageProps> = [
     height: 52,
   },
   {
-    alt: 'Twitter logo',
-    name: 'companies/twitter',
+    alt: 'X logo',
+    name: 'companies/x',
     mode: '',
-    width: 31,
-    height: 52,
+    width: 30,
+    height: 30,
   },
   {
     alt: 'Salesforce logo',