Feature/348 add claude code workflow

.github/workflows/claude-code.yml

@@ -0,0 +1,50 @@
+name: Claude Code Integration
+
+on:
+  # Trigger when a Pull Request is opened, updated, or reopened
+  pull_request:
+    types: [opened, synchronize, reopened]
+    branches:
+      - master
+      - main
+
+  # Trigger when code is pushed directly to the main branches
+  push:
+    branches:
+      - master
+      - main
+
+jobs:
+  claude:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: write
+      pull-requests: write
+      issues: write
+      actions: read # Required so Claude can read CI results on PRs
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v5
+        with:
+          fetch-depth: 1
+
+      # Run Claude Code using the official GitHub Action
+      - name: Run Claude Code
+        id: claude
+        uses: anthropics/claude-code-action@v1
+        with:
+          anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }}
+
+          # Uncomment to customize Claude's behavior
+          # claude_args: |
+          #   --model claude-opus-4-1-20250805
+          #   --max-turns 10
+          #   --allowedTools "Bash(npm ci),Bash(npm run build),Bash(npm test),Read,Edit"
+
+          # settings: |
+          #   {
+          #     "env": {
+          #       "NODE_ENV": "test"
+          #     }
+          #   }

client/src/pages/ContactUs.jsx

@@ -27,20 +27,18 @@ const InputField = ({
       <Component
         name={name}
         type={type}
-        rows={rows}
         value={value}
         onChange={onChange}
         onFocus={onFocus}
         onBlur={onBlur}
         placeholder={placeholder}
-        aria-label={placeholder}
-        className={`w-full pl-12 pr-4 py-4 border-2 rounded-xl transition-all duration-300 bg-white ${error
+aria-label={placeholder}
+        className={`w-full pl-12 pr-4 py-4 border-2 rounded-xl transition-all duration-300 bg-white text-gray-900 placeholder-gray-500 ${error master
           ? 'border-red-300 focus:border-red-500 focus:ring-red-500/20'
           : isFocused
             ? 'border-indigo-500 focus:border-indigo-600 focus:ring-indigo-500/20 shadow-lg'
             : 'border-gray-200 hover:border-gray-300'
           } focus:outline-none focus:ring-4 ${rows ? 'resize-none' : ''}`}
-        style={{ backgroundColor: value === '' ? '#f3e8ff' : 'white' }} // Light placeholder color when empty
       />
 
       {error && (

client/src/pages/News.jsx

@@ -105,7 +105,7 @@ const News = () => {
 
     return (
       <div
-        className={`group relative bg-white rounded-2xl overflow-hidden shadow-lg hover:shadow-2xl transition-all duration-500 transform hover:-translate-y-2 flex flex-col h-full`}
+        className={`group relative bg-white/10 backdrop-blur-xl border border-white/20 rounded-2xl overflow-hidden shadow-lg hover:shadow-2xl transition-all duration-500 transform hover:-translate-y-2 flex flex-col h-full`}
         style={{ animationDelay: `${index * 0.1}s` }}
         onMouseEnter={() => setHoveredCard(news.id)}
         onMouseLeave={() => setHoveredCard(null)}
@@ -176,24 +176,24 @@ const News = () => {
             >
               {news.category}
             </span>
-            <div className="flex items-center text-gray-500 text-sm">
+            <div className="flex items-center text-gray-400 text-sm">
               <Calendar className="w-4 h-4 mr-1" />
               {news.date}
             </div>
           </div>
 
           {/* Title */}
-          <h2 className="text-xl font-bold text-gray-800 mb-3 group-hover:text-indigo-600 transition-colors duration-300">
+          <h2 className="text-xl font-bold text-white mb-3 group-hover:text-indigo-300 transition-colors duration-300">
             {news.title}
           </h2>
 
           {/* Description */}
-          <p className="text-gray-600 mb-4 line-clamp-3 flex-grow">{news.description}</p>
+          <p className="text-gray-300 mb-4 line-clamp-3 flex-grow">{news.description}</p>
 
           {/* Footer */}
           <div className="mt-auto">
             <div className="flex items-center justify-between">
-              <div className="flex items-center text-sm text-gray-500">
+              <div className="flex items-center text-sm text-gray-400">
                 <Clock className="w-4 h-4 mr-1" />
                 {news.readTime}
               </div>
@@ -202,22 +202,22 @@ const News = () => {
                 href={news.link}
                 target="_blank"
                 rel="noopener noreferrer"
-                className="flex items-center text-indigo-600 hover:text-indigo-800 font-medium transition-colors duration-300 group/btn"
+                className="flex items-center text-indigo-400 hover:text-indigo-300 font-medium transition-colors duration-300 group/btn"
               >
                 <span className="mr-2">Read More</span>
                 <ArrowRight className="w-4 h-4 transition-transform duration-300 group-hover/btn:translate-x-1" />
               </a>
             </div>
 
-            <div className="mt-4 pt-4 border-t border-gray-100">
+            <div className="mt-4 pt-4 border-t border-gray-600">
               <div className="flex items-center">
                 <div className="w-8 h-8 bg-gradient-to-r from-indigo-500 to-purple-500 rounded-full flex items-center justify-center text-white text-sm font-bold">
                   {news.author
                     .split(" ")
                     .map((n) => n[0])
                     .join("")}
                 </div>
-                <span className="ml-3 text-sm text-gray-600">By {news.author}</span>
+                <span className="ml-3 text-sm text-gray-300">By {news.author}</span>
               </div>
             </div>
           </div>
@@ -227,7 +227,7 @@ const News = () => {
   };
 
   return (
-    <div className="min-h-screen bg-gradient-to-br from-indigo-50 via-white to-purple-50 dark:from-gray-900 dark:via-gray-800 dark:to-gray-900">
+    <div className="min-h-screen bg-gradient-to-br from-slate-900 via-purple-900 to-slate-900 dark:from-gray-900 dark:via-gray-800 dark:to-gray-900 text-white overflow-hidden">
       {/* Header */}
       <div className="relative py-20 px-4">
         <div className="max-w-6xl mx-auto text-center">

client/src/pages/SignIn.jsx

@@ -363,11 +363,14 @@ export default function Signin() {
     }
   };
 
-  const handleGitHubLogin = () => {
-  console.log("GitHub login clicked");
-  //implement GitHub OAuth login logic here later
-};
-
+const handleGitHubLogin = async () => {
+  try {
+    toast.info("GitHub login feature is coming soon! Please use email/password login.");
+  } catch (error) {
+    console.error("GitHub login error:", error);
+    toast.error("GitHub login is currently unavailable. Please use email login.");
+  }
+}; master
 
    return (
     <> 

client/src/routes/routes.jsx

@@ -38,7 +38,6 @@ const router = createBrowserRouter([
     children: [
       { index: true, element: <HomePage /> },
       { path: "about", element: <About /> },
-      { path: "blog", element: <Blog /> },
       { path: "contactus", element: <ContactUs /> },
       { path: "news", element: <News /> },
       { path: "contributors", element: <Contributors /> },
@@ -55,37 +54,14 @@ const router = createBrowserRouter([
           },
         ],
       },
-
-      {
-
-        path: "care-co-pilot",
-        element: <CareCoPilot />,
-      },
-      {
-        path: "*",
-        element: <NotFoundPage />,
-        handle: { noLayout: true },
-      },
-
-      {
-        path: "babyfeeder",
-        element: <BabyFeeder />,
-      },
-      {
-        path: "sleeper",
-        element: <Sleeper />,
-
-      },
-
       { path: "learning-hub", element: <LearningHub /> },
       { path: "vaccine-reminder", element: <VaccineReminder /> },
       { path: "growth-tracker", element: <GrowthTracker /> },
       { path: "privacy-policy", element: <PrivacyPolicy /> },
       { path: "terms-of-service", element: <TermsOfService /> },
       { path: "cookie-policy", element: <CookiePolicy /> },
       { path: "services", element: <Services /> },
-      { path: "github-login-redirect", element: <githubLoginRedirect/> },
-
+{ path: "github-login-redirect", element: <githubLoginRedirect/> }, master
       { path: "*", element: <NotFoundPage />, handle: { noLayout: true } },
 
     ],