Initial commit

2025-09-30 05:14:15 +03:00
commit 3446641911
35 changed files with 4166 additions and 0 deletions
--- a/src/components/Hero.jsx
+++ b/src/components/Hero.jsx
@@ -0,0 +1,107 @@
+import { useState } from 'react';
+import { motion } from 'framer-motion';
+import mushroomImg from '../assets/mushroom.png';
+import SocietyTerminal from './SocietyTerminal';
+
+const Hero = () => {
+  const [showTerminal, setShowTerminal] = useState(false);
+
+  const fadeInUp = {
+    hidden: { opacity: 0, y: 50 },
+    visible: { opacity: 1, y: 0, transition: { duration: 0.6 } }
+  };
+
+  const bounceIn = {
+    hidden: { scale: 0, opacity: 0 },
+    visible: { scale: 1, opacity: 1, transition: { type: "spring", bounce: 0.4, duration: 0.8 } }
+  };
+
+  const staggerContainer = {
+    visible: { transition: { staggerChildren: 0.2 } }
+  };
+
+  return (
+    <>
+      <section className="min-h-screen flex items-center justify-center bg-dark-gradient relative overflow-hidden">
+        <motion.div
+          className="text-center z-10"
+          initial="hidden"
+          animate="visible"
+          variants={staggerContainer}
+        >
+          {/* Mascot */}
+          <motion.div
+            className="mb-8"
+            variants={bounceIn}
+          >
+            <img
+              src={mushroomImg}
+              alt="Mycelium Society Mascot"
+              className="mx-auto max-w-xs"
+              style={{ width: 'auto', height: 'auto', maxHeight: '300px' }}
+            />
+          </motion.div>
+
+          {/* Main Title */}
+          <motion.h1
+            className="text-4xl md:text-6xl lg:text-7xl font-bold mb-8 leading-tight"
+            variants={fadeInUp}
+          >
+            <span className="text-white">Welcome to</span>
+            <br />
+            <span className="text-bright-cyan">Mycelium Society</span>
+          </motion.h1>
+
+          {/* Tagline */}
+          <motion.p
+            className="text-lg md:text-xl text-gray-300 mb-12 max-w-3xl mx-auto"
+            variants={fadeInUp}
+          >
+            A community inspired by network state concepts, combining people,
+            <br className="hidden sm:block" />
+            technology, and governance for global collaboration.
+          </motion.p>
+
+          {/* Buttons */}
+          <motion.div
+            className="flex flex-col sm:flex-row gap-4 justify-center items-center"
+            variants={fadeInUp}
+          >
+            <motion.button
+              className="btn-primary animate-pulse-glow"
+              whileHover={{ scale: 1.05 }}
+              whileTap={{ scale: 0.95 }}
+              onClick={() => setShowTerminal(true)}
+            >
+              > ENTER THE NETWORK
+            </motion.button>
+            <a href="https://docs.ourworld.tf/mycelium_society_docs/docs/" target="_blank" rel="noopener noreferrer">
+              <motion.button
+                className="btn-primary"
+                whileHover={{ scale: 1.05 }}
+                whileTap={{ scale: 0.95 }}
+              >
+                > LEARN MORE
+              </motion.button>
+            </a>
+          </motion.div>
+        </motion.div>
+
+        {/* Background Effects */}
+        <div className="absolute inset-0 overflow-hidden">
+          <div className="absolute -top-40 -right-40 w-80 h-80 bg-bright-cyan/5 rounded-full blur-3xl"></div>
+          <div className="absolute -bottom-40 -left-40 w-80 h-80 bg-cyan/5 rounded-full blur-3xl"></div>
+        </div>
+      </section>
+
+      {showTerminal && (
+        <SocietyTerminal
+          showTerminal={showTerminal}
+          setShowTerminal={setShowTerminal}
+        />
+      )}
+    </>
+  );
+};
+
+export default Hero;