textOverflow ellipsis

Signed-off-by: Naman Verma <149177973+Namanv0509@users.noreply.github.com>

Author: Namanv0509

src/components/Pricing/PricingAddons/index.js

@@ -252,10 +252,10 @@ export const PricingAddons = ({ isYearly = false, setIsYearly }) => {
                             <Box sx={{ display: "flex", alignItems: "center", gap: 2, py: 1 }}>
                               {addon.icon}
                               <Box>
-                                <Typography variant="body1" fontWeight="500" sx={{ wordBreak: "break-word", whiteSpace: "normal", fontFamily: "\"Qanelas Soft\", \"Open Sans\", sans-serif" }}>
+                                <Typography variant="body1" fontWeight="500" sx={{ textOverflow: "ellipsis",whiteSpace: "normal", fontFamily: "\"Qanelas Soft\", \"Open Sans\", sans-serif" }}>
                                   {addon.name}
                                 </Typography>
-                                <Typography variant="body2" color="text.secondary" sx={{ wordBreak: "break-word", whiteSpace: "normal", fontStyle: "italic", fontFamily: "\"Qanelas Soft\", \"Open Sans\", sans-serif" }}>
+                                <Typography variant="body2" color="text.secondary" sx={{ textOverflow: "ellipsis", whiteSpace: "normal", fontStyle: "italic", fontFamily: "\"Qanelas Soft\", \"Open Sans\", sans-serif" }}>
                                   {addon.id === "academy"
                                     ? addon.description
                                     : (() => {
@@ -615,4 +615,4 @@ export const PricingAddons = ({ isYearly = false, setIsYearly }) => {
       </CssBaseline>
     </SistentThemeProvider>
   );
-};
+};