Merge branch 'recodehive:main' into main

Author: steam-bell-92

.env.example

@@ -0,0 +1,14 @@
+# GitHub API Configuration (Optional)
+# To avoid rate limits, you can add a GitHub Personal Access Token
+# Create one at: https://github.com/settings/tokens
+# No special permissions needed for public repositories
+GITHUB_TOKEN=your_github_token_here
+
+# Firebase Configuration (if needed)
+# FIREBASE_API_KEY=your_firebase_api_key
+# FIREBASE_AUTH_DOMAIN=your_firebase_auth_domain
+# FIREBASE_PROJECT_ID=your_firebase_project_id
+
+# Analytics Configuration
+# GOOGLE_ANALYTICS_ID=your_google_analytics_id
+# VERCEL_ANALYTICS_ID=your_vercel_analytics_id

docs/python/python_operators.md

@@ -25,14 +25,26 @@ In Python, **operators** are special symbols used to perform operations on varia
 
 Python provides the following types of operators:
 
-1. [Arithmetic Operators](#1-arithmetic-operators)
-2. [Comparison Operators](#2-comparison-operators)
-3. [Logical Operators](#3-logical-operators)
-4. [Assignment Operators](#4-assignment-operators)
-5. [Bitwise Operators](#5-bitwise-operators)
-6. [Membership Operators](#6-membership-operators)
-7. [Identity Operators](#7-identity-operators)
-8. [Operator Precedence](#8-operator-precedence)
+- [Python Operators](#python-operators)
+  - [Operator Categories](#operator-categories)
+  - [Arithmetic Operators](#arithmetic-operators)
+  - [Comparison Operators](#comparison-operators)
+  - [Logical Operators](#logical-operators)
+  - [Assignment Operators](#assignment-operators)
+  - [Bitwise Operators](#bitwise-operators)
+  - [Membership Operators](#membership-operators)
+  - [Identity Operators](#identity-operators)
+  - [Use Cases of Python Operators](#use-cases-of-python-operators)
+    - [1. **Arithmetic Operators**](#1-arithmetic-operators)
+    - [2. **Comparison Operators**](#2-comparison-operators)
+    - [3. **Logical Operators**](#3-logical-operators)
+    - [4. **Assignment Operators**](#4-assignment-operators)
+    - [5. **Bitwise Operators**](#5-bitwise-operators)
+    - [6. **Membership Operators**](#6-membership-operators)
+    - [7. **Identity Operators**](#7-identity-operators)
+    - [8. **Operator Precedence**](#8-operator-precedence)
+  - [Summary Table](#summary-table)
+  - [Conclusion](#conclusion)
 
 
 ## Arithmetic Operators
@@ -66,7 +78,7 @@ Used to compare two values and return a Boolean result (`True` or `False`).
 
 ## Logical Operators
 
-Used to combine conditional statements.
+Used to combine conditional statements here.
 
 | Operator | Description                       | Example              | Result |
 |----------|-----------------------------------|----------------------|--------|

docusaurus.config.ts

@@ -20,8 +20,12 @@ const config: Config = {
   onBrokenLinks: "throw",
   onBrokenMarkdownLinks: "warn",
 
-  // Google Analytics
+  // Google Analytics and Theme Scripts
   scripts: [
+    {
+      src: '/theme-init.js',
+      async: false, // Load synchronously to prevent flash
+    },
     {
       src: 'https://www.googletagmanager.com/gtag/js?id=G-W02Z2VJYCR',
       async: true,
@@ -69,6 +73,11 @@ const config: Config = {
 
   themeConfig: {
     image: "img/docusaurus-social-card.jpg",
+    colorMode: {
+      defaultMode: 'light',
+      disableSwitch: false,
+      respectPrefersColorScheme: false,
+    },
     navbar: {
       title: "Recode Hive",
       logo: {

src/components/FloatingContributors/index.tsx

@@ -29,11 +29,18 @@ const FloatingContributors: React.FC = () => {
     const fetchContributors = async () => {
       try {
         setLoading(true);
-        
+
         // Fetch repositories from RecodeHive organization
         const reposResponse = await fetch('https://api.github.com/orgs/recodehive/repos?type=public&per_page=10&sort=updated');
+
+        // Check if the response is ok
+        if (!reposResponse.ok) {
+          console.warn(`GitHub API rate limit or error: ${reposResponse.status}`);
+          throw new Error(`GitHub API error: ${reposResponse.status}`);
+        }
+
         const repos = await reposResponse.json();
-        
+
         if (!Array.isArray(repos)) {
           throw new Error('Invalid repos response');
         }
@@ -90,8 +97,9 @@ const FloatingContributors: React.FC = () => {
         setLoading(false);
 
       } catch (error) {
-        console.error('Error fetching contributors:', error);
-        
+        // Silently handle GitHub API errors (rate limits, etc.)
+        console.warn('Using fallback contributor data due to GitHub API limitations');
+
         // Fallback demo data
         const demoContributors: Contributor[] = [
           {

src/components/header.tsx

@@ -142,7 +142,7 @@ const HeaderImage = () => {
       <img
         src="/img/hero-img-01.gif" // Image source
         alt="hero-img" // Alt attribute
-        className="float-animation" // Additional CSS class
+        className="" // Additional CSS class
         data-tilt // Activate VanillaTilt effect
         ref={imgRef} // Reference for image element
       />

src/components/header/header.tsx

@@ -123,7 +123,7 @@ const HeaderImage = () => {
       <img
         src="/img/hero-img-01.gif"
         alt="Animated illustration of Recode Hive learning"
-        className="float-animation"
+        className=""
         data-tilt
         ref={imgRef}
       />

src/css/custom.css

@@ -6,6 +6,68 @@
 
 /* You can override the default Infima variables here. */
 @import "tailwindcss";
+
+/* ===== INSTANT THEME TRANSITIONS ===== */
+html {
+  transition: background-color 0.15s ease, color 0.15s ease !important;
+}
+
+body {
+  transition: background-color 0.15s ease, color 0.15s ease !important;
+}
+
+/* Instant transitions for theme-sensitive elements */
+*,
+*::before,
+*::after {
+  transition:
+    background-color 0.15s ease,
+    color 0.15s ease,
+    border-color 0.15s ease,
+    box-shadow 0.15s ease !important;
+}
+
+/* Very fast transitions for interactive elements */
+button,
+.button,
+a,
+input,
+select,
+textarea {
+  transition:
+    all 0.1s ease !important;
+}
+
+/* Instant navbar theme change */
+.navbar,
+.navbar__inner,
+.navbar__brand,
+.navbar__item,
+.navbar__link {
+  transition:
+    background-color 0.1s ease,
+    color 0.1s ease !important;
+}
+
+/* Force instant theme updates for key elements */
+[data-theme='light'] .navbar {
+  background-color: #ffffff !important;
+  color: #1a202c !important;
+}
+
+[data-theme='dark'] .navbar {
+  background-color: #121212 !important;
+  color: #ffffff !important;
+}
+
+[data-theme='light'] .navbar__link {
+  color: #1a202c !important;
+}
+
+[data-theme='dark'] .navbar__link {
+  color: #ffffff !important;
+}
+
 :root {
   --ifm-color-primary: #2e8555;
   --ifm-color-primary-dark: #29784c;
@@ -18,6 +80,10 @@
   --docusaurus-highlighted-code-line-bg: rgba(0, 0, 0, 0.1);
   --ifm-color-primary-text: white;
   --ifm-color-secondary-text: #edf2f7;
+
+  /* Light theme defaults */
+  --ifm-background-color: #ffffff;
+  --ifm-font-color-base: #000000;
 }
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
@@ -33,6 +99,10 @@
   --ifm-color-primary-text: #ffffff;
   --ifm-color-secondary-text: #edf2f7;
 
+  /* Dark theme background and text */
+  --ifm-background-color: #121212;
+  --ifm-font-color-base: #ffffff;
+
   /* Standardized Dark Theme Colors */
   --dark-bg-primary: #121212;
   --dark-bg-secondary: #1a1a1a;
@@ -181,18 +251,30 @@
   color: transparent;
 }
 
-/* Light mode background and text fix - EXCLUDE community page */
-[data-theme='light'] body:not(:has(.community-page)) {
-  --ifm-background-color: #ffffff; /* white background */
-  --ifm-font-color-base: #000000;  /* black text */
-  background-color: var(--ifm-background-color);
-  color: var(--ifm-font-color-base);
+/* ===== THEME OVERRIDES - CLEAN APPROACH ===== */
+
+/* Light theme - Clean background */
+[data-theme='light'] {
+  --ifm-background-color: #ffffff;
+  --ifm-font-color-base: #1a202c;
+  --ifm-card-background-color: #ffffff;
+}
+
+[data-theme='light'] body {
+  background-color: var(--ifm-background-color) !important;
+  color: var(--ifm-font-color-base) !important;
 }
 
-/* Dark mode overrides - EXCLUDE community page */
-[data-theme='dark'] body:not(:has(.community-page)) {
-  background-color: var(--dark-bg-primary);
-  color: var(--dark-text-primary);
+/* Dark theme - Clean background */
+[data-theme='dark'] {
+  --ifm-background-color: #121212;
+  --ifm-font-color-base: #ffffff;
+  --ifm-card-background-color: #1a1a1a;
+}
+
+[data-theme='dark'] body {
+  background-color: var(--ifm-background-color) !important;
+  color: var(--ifm-font-color-base) !important;
 }
 
 /* Global dark theme utilities */
@@ -253,17 +335,34 @@
   color: var(--dark-text-muted) !important;
 }
 
-/* Button dark theme */
-[data-theme='dark'] .button,
-[data-theme='dark'] button {
-  background-color: var(--dark-bg-tertiary);
-  color: var(--dark-text-primary);
-  border-color: var(--dark-border);
+/* ===== CLEAN BUTTON FIXES ===== */
+
+/* Remove conflicting button styles - let Docusaurus handle it naturally */
+[data-theme='light'] .button--outline,
+[data-theme='light'] .button--secondary {
+  background-color: transparent !important;
+  color: var(--ifm-font-color-base) !important;
+  border: 1px solid var(--ifm-color-emphasis-300) !important;
+}
+
+[data-theme='dark'] .button--outline,
+[data-theme='dark'] .button--secondary {
+  background-color: transparent !important;
+  color: var(--ifm-font-color-base) !important;
+  border: 1px solid var(--ifm-color-emphasis-300) !important;
 }
 
-[data-theme='dark'] .button:hover,
-[data-theme='dark'] button:hover {
-  background-color: var(--dark-card-hover-bg);
+/* ===== MINIMAL THEME FIXES ===== */
+
+/* Only fix specific problematic elements */
+[data-theme='light'] .card {
+  background-color: var(--ifm-card-background-color) !important;
+  color: var(--ifm-font-color-base) !important;
+}
+
+[data-theme='dark'] .card {
+  background-color: var(--ifm-card-background-color) !important;
+  color: var(--ifm-font-color-base) !important;
 }
 
 /* Card components dark theme */
@@ -812,3 +911,53 @@ html {
   color: inherit;
 }
 
+/* ===== STEP 3: BASIC FOOTER PROTECTION ===== */
+/* Prevent global dark theme container rule from affecting footer */
+[data-theme='dark'] .enhanced-footer .container {
+  background-color: transparent !important;
+}
+
+/* ===== STEP 4: FOOTER BACKGROUND PROTECTION ===== */
+/* Ensure footer maintains its gradient background in dark mode */
+[data-theme='dark'] .enhanced-footer {
+  background: linear-gradient(135deg, #0f0f23 0%, #1a1a2e 25%, #16213e 50%, #0f3460 75%, #533483 100%) !important;
+  color: #e2e8f0 !important;
+}
+
+/* ===== STEP 5: FOOTER SECTION PROTECTION ===== */
+/* Protect specific footer sections from global overrides */
+[data-theme='dark'] .enhanced-footer .footer-links-section {
+  background: rgba(0, 0, 0, 0.15) !important;
+}
+
+[data-theme='dark'] .enhanced-footer .footer-bottom {
+  background: rgba(0, 0, 0, 0.2) !important;
+}
+
+/* ===== STEP 6: MAXIMUM SPECIFICITY PROTECTION ===== */
+/* Override the exact problematic global rule with same specificity */
+[data-theme='dark'] body:not(:has(.community-page)) .enhanced-footer .container {
+  background-color: transparent !important;
+}
+
+[data-theme='dark'] body:not(:has(.community-page)) .enhanced-footer {
+  background: linear-gradient(135deg, #0f0f23 0%, #1a1a2e 25%, #16213e 50%, #0f3460 75%, #533483 100%) !important;
+  color: #e2e8f0 !important;
+}
+
+/* ===== STEP 7: COMPREHENSIVE ELEMENT PROTECTION ===== */
+/* Protect all footer elements from any global overrides */
+[data-theme='dark'] .enhanced-footer *,
+[data-theme='dark'] .enhanced-footer .row,
+[data-theme='dark'] .enhanced-footer .col,
+[data-theme='dark'] .enhanced-footer div,
+[data-theme='dark'] .enhanced-footer section {
+  background-color: transparent !important;
+}
+
+/* Ensure text colors inherit properly */
+[data-theme='dark'] .enhanced-footer,
+[data-theme='dark'] .enhanced-footer * {
+  color: inherit !important;
+}
+

src/pages/dashboard/index.tsx

@@ -99,11 +99,15 @@ const DashboardContent: React.FC = () => {
 
     try {
       console.log('🔄 Fetching leaderboard data from RecodeHive GitHub API...');
-      
+
       // Fetch all repositories from RecodeHive organization
       const reposResponse = await fetch('https://api.github.com/orgs/recodehive/repos?type=public&per_page=100');
-      
+
       if (!reposResponse.ok) {
+        if (reposResponse.status === 403) {
+          console.warn('GitHub API rate limit exceeded. Using fallback data.');
+          throw new Error('GitHub API rate limit exceeded');
+        }
         throw new Error(`GitHub API request failed: ${reposResponse.status}`);
       }
 
@@ -185,8 +189,8 @@ const DashboardContent: React.FC = () => {
       setLeaderboardData(transformedData);
 
     } catch (error) {
-      console.error('❌ Error fetching RecodeHive contributors data:', error);
-      setLeaderboardError(error.message);
+      console.warn('Using fallback leaderboard data due to GitHub API limitations');
+      setLeaderboardError('GitHub API rate limit reached. Showing demo data.');
 
       // Fallback demo data with similar structure
       console.log('📝 Loading demo data as fallback...');