Update tailwindcss to v3

Author: MrDogeBro

package.json

@@ -50,7 +50,7 @@
     "postcss-loader": "^4.2.0",
     "sass": "^1.34.1",
     "sass-loader": "^10.1.1",
-    "tailwindcss": "^2.1.4",
+    "tailwindcss": "^3.1.7",
     "tsconfig-paths-webpack-plugin": "^3.5.1",
     "typescript": "4.3.2"
   }

src/pages/about.tsx

@@ -44,11 +44,11 @@ tagline: **the future starts with you**.
         <h1 className="text-brand-gradient font-brand text-4xl text-center mt-10 mb-5 uppercase">
           About
         </h1>
-        <div className="flex-grow">
+        <div className="grow">
           <p className="font-sans text-white text-md mt-4 mx-6 sm:mx-10 md:mx-20 lg:w-7/12 lg:mx-auto">
             <ReactMarkdown
               children={aboutContent}
-              className="text-white font-sans unreset markdown flex-grow"
+              className="text-white font-sans unreset markdown grow"
               remarkPlugins={[remarkGfm, remarkSlug]}
               rehypePlugins={[rehypeRaw]}
             />

src/pages/contact.tsx

@@ -278,7 +278,7 @@ export default class Contact extends Component<Props, States> {
           <form
             onSubmit={this.handleFormSubmit}
             id="contactForm"
-            className="w-11/12 md:w-9/12 lg:w-7/12 xl:w-6/12 2xl:w-5/12 mx-auto px-3 md:px-10 flex-grow mt-4"
+            className="w-11/12 md:w-9/12 lg:w-7/12 xl:w-6/12 2xl:w-5/12 mx-auto px-3 md:px-10 grow mt-4"
           >
             <ThemeProvider theme={muiTheme}>
               <div className="flex justify-center py-1">

src/pages/privacy-policy.tsx

@@ -69,7 +69,7 @@ If you have any questions regarding this policy, feel free to contact the Organi
         <p className="font-sans text-white text-md mt-4 mx-6 sm:mx-10 md:mx-20 lg:w-7/12 lg:mx-auto">
           <ReactMarkdown
             children={policyContent}
-            className="text-white font-sans unreset markdown flex-grow"
+            className="text-white font-sans unreset markdown grow"
             remarkPlugins={[remarkGfm, remarkSlug]}
             rehypePlugins={[rehypeRaw]}
           />

src/ui/Footer.tsx

@@ -32,7 +32,7 @@ export const Footer: React.FC<FooterProps> = (props) => {
             </span>
           </div>
         </div>
-        <div className="md:justify-end flex-grow md:pl-5 pt-2 md:pt-0">
+        <div className="md:justify-end grow md:pl-5 pt-2 md:pt-0">
           <p
             className={`font-sans font-light text-md text-center md:text-right ${styles.FooterTextShadow}`}
           >

src/ui/Navbar.tsx

@@ -46,7 +46,7 @@ export const Navbar: React.FC<NavbarProps> = ({ className = '' }) => {
         </span>
       </Link>
 
-      <div className="flex-grow" />
+      <div className="grow" />
 
       <div className="hidden md:flex justify-end items-center">
         {links.map((link: PageData, i: number) => (