fixed buttons

Author: AmoDinho

src/components/chapters/SideChapterBox.js

@@ -227,16 +227,16 @@ const SideChapterBox = ({
         </div>
         <HeadingThree className="text-left text-blue">Frontend</HeadingThree>
 
-        <div className="flex flex-col">
+        <div className="flex flex-col ">
           <FrameworkButton
-            className="bg-blue-lightest text-blue-darkest px-4 py-2 rounded mb-3"
+            className="bg-blue-lightest text-blue-darkest px-4 py-2 rounded mb-3 max-w-xxs"
             onClick={() => toggleFramework("react")}
             img={ReactIcon}
           >
             React posts
           </FrameworkButton>
           <FrameworkButton
-            className="bg-green-lightest text-green-darker px-4 py-2 rounded focus:border-green-darker focus:border"
+            className="bg-green-lightest text-green-darker px-4 py-2 rounded focus:border-green-darker focus:border max-w-xxs"
             onClick={() => toggleFramework("vue")}
             img={VueIcon}
           >

tailwind.config.js

@@ -357,6 +357,7 @@ module.exports = {
     },
     maxWidth: (theme, { breakpoints }) => ({
       none: "none",
+      xxs: "12rem",
       xs: "20rem",
       sm: "24rem",
       md: "28rem",