feat: golden toast

fezcode · fezcode · commit d1838f558dee · 2025-11-30T03:03:28.000+03:00
diff --git a/src/components/Toast.js b/src/components/Toast.js
@@ -27,13 +27,20 @@ const Toast = ({
     ' bg-toast-background border-toast-border hover:bg-toast-background/90';
   const errorStyle =
     ' bg-toast-error-background border-toast-error-border hover:bg-toast-error-background/90';
+  const goldStyle =
+    ' bg-toast-gold-background border-toast-gold-border hover:bg-toast-gold-background/90';
+
+  let toastStyle = successStyle;
+  if (type === 'error') toastStyle = errorStyle;
+  if (type === 'gold') toastStyle = goldStyle;
+
   return (
     <motion.div
       initial={{ x: '100%', opacity: 0 }}
       animate={{ x: 0, opacity: 1 }}
       exit={{ opacity: 0 }}
       transition={{ type: 'spring', stiffness: 120, damping: 20 }}
-      className={`${defaultStyle} ${type === 'error' ? `${errorStyle}` : `${successStyle}`}`}
+      className={`${defaultStyle} ${toastStyle}`}
     >
       <div className="flex flex-col text-sm group w-max flex-grow">
         <div className="flex items-center gap-2">
diff --git a/src/config/colors.js b/src/config/colors.js
@@ -83,6 +83,11 @@ module.exports = {
   'toast-error-hover-background': 'rgba(122,84,84,0.8)',
   'toast-error-border': '#684b4b',
 
+  // Toast gold colors
+  'toast-gold-background': 'rgba(87, 72, 35, 0.8)',
+  'toast-gold-hover-background': 'rgba(122, 100, 49, 0.8)',
+  'toast-gold-border': '#68562b',
+
   // Code Theme Colors (from src/utils/customTheme.js)
   codeTheme: {
     'text-default': '#d1d5db',
diff --git a/src/context/AchievementContext.js b/src/context/AchievementContext.js
@@ -40,7 +40,8 @@ export const AchievementProvider = ({ children }) => {
       title: 'Achievement Unlocked!',
       message: achievement.title,
       duration: 4000,
-      icon: <TrophyIcon weight="duotone"/>
+      icon: <TrophyIcon weight="duotone"/>,
+      type: 'gold'
       // You might want to add a specific type or icon here later for styling
     });
   };
