Use CSS-based uppercase, mobile-friendly text sizing on index hero, adjust trivia project desc

src/pages/index.tsx

@@ -145,8 +145,8 @@ const Home: NextPage<HomeStaticProps> = ({ projects }: HomeStaticProps) => {
                 ))}
               </ul>
             </nav>
-            <div className="cursor-default select-none py-10 font-hanken font-black tracking-widest text-8xl sm:text-9xl">
-              XEVION
+            <div className="cursor-default uppercase select-none py-10 font-hanken font-black tracking-widest text-6xl min-[300px]:text-7xl min-[500px]:text-8xl sm:text-9x lg:text-10xl">
+              Xevion
             </div>
             <div className="px-4 text-base sm:text-sm text-zinc-500 text-center">
               <Balancer>

src/pages/projects.tsx

@@ -87,7 +87,7 @@ const ProjectsPage: NextPage = () => {
         },
         {
             name: "trivia",
-            description: "Trivia Leaderboard in Flask",
+            description: "CLI + Flask Leaderboard",
             url: "http://github.com/Xevion/trivia",
             icon: MdOutlineLeaderboard
         },

tailwind.config.cjs

@@ -8,6 +8,9 @@ module.exports = {
                   850: "#1D1D20"
               }
             },
+            fontSize: {
+                '10xl': '10rem',
+            },
             fontFamily: {
                 inter: ["\"Inter\"", "sans-serif"],
                 roboto: ["\"Roboto\"", "sans-serif"],