Spaces:

TeacherPuffy
/

MockBirdLWeb

Running

App Files Files Community

TeacherPuffy commited on Oct 31, 2024

Commit

ad09400

verified ·

1 Parent(s): ff086b2

Update index.html

Browse files

Files changed (1) hide show

index.html +346 -19

index.html CHANGED Viewed

@@ -1,19 +1,346 @@
-<!doctype html>
-<html>
-	<head>
-		<meta charset="utf-8" />
-		<meta name="viewport" content="width=device-width" />
-		<title>My static Space</title>
-		<link rel="stylesheet" href="style.css" />
-	</head>
-	<body>
-		<div class="card">
-			<h1>Welcome to your static Space!</h1>
-			<p>You can modify this app directly by editing <i>index.html</i> in the Files and versions tab.</p>
-			<p>
-				Also don't forget to check the
-				<a href="https://huggingface.co/docs/hub/spaces" target="_blank">Spaces documentation</a>.
-			</p>
-		</div>
-	</body>
-</html>

+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>BirdL - Technical Research Firm</title>
+    <style>
+        body {
+            font-family: 'Helvetica', 'Arial', sans-serif;
+            margin: 0;
+            padding: 0;
+            background-color: #f4f4f4;
+            color: #333;
+            overflow-x: hidden;
+            transition: background-color 0.5s ease;
+        }
+        header {
+            background-color: #d2b48c;
+            color: #fff;
+            padding: 20px 0;
+            text-align: center;
+            border-bottom: 2px solid #8b4513;
+            position: relative;
+            overflow: hidden;
+            transition: background-color 0.5s ease;
+        }
+        .container {
+            width: 80%;
+            margin: 0 auto;
+            padding: 20px;
+            transition: opacity 0.5s ease;
+        }
+        .intro, .leadership, .research-goals, .about, .blog, .study-areas, .research-methods, .operations {
+            background-color: #fff;
+            padding: 20px;
+            margin: 20px 0;
+            border-radius: 5px;
+            box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+            position: relative;
+            overflow: hidden;
+            transition: opacity 0.5s ease;
+        }
+        .leadership img {
+            max-width: 150px;
+            border-radius: 50%;
+            margin-right: 20px;
+            float: left;
+        }
+        .research-goals ul, .study-areas ul, .research-methods ul, .operations ul {
+            list-style-type: none;
+            padding: 0;
+        }
+        .research-goals ul li, .study-areas ul li, .research-methods ul li, .operations ul li {
+            margin-bottom: 10px;
+            background-color: #f8f8f8;
+            padding: 10px;
+            border-radius: 5px;
+        }
+        .blog ul {
+            list-style-type: none;
+            padding: 0;
+        }
+        .blog ul li {
+            margin-bottom: 10px;
+        }
+        .blog ul li a {
+            text-decoration: none;
+            color: #333;
+            font-weight: bold;
+        }
+        .blog ul li a:hover {
+            text-decoration: underline;
+        }
+        .social-links {
+            margin-top: 20px;
+            text-align: center;
+        }
+        .social-links a {
+            margin-right: 10px;
+            text-decoration: none;
+            color: #333;
+            font-weight: bold;
+        }
+        .social-links a:hover {
+            text-decoration: underline;
+        }
+        .graphic {
+            position: absolute;
+            top: 0;
+            right: 0;
+            width: 100px;
+            height: 100px;
+            background-color: #8b4513;
+            clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
+            animation: rotate 10s infinite linear;
+        }
+        @keyframes rotate {
+            from {
+                transform: rotate(0deg);
+            }
+            to {
+                transform: rotate(360deg);
+            }
+        }
+        .graphic-drone {
+            position: absolute;
+            bottom: 0;
+            left: 0;
+            width: 100px;
+            height: 100px;
+            background-color: #d2b48c;
+            clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
+            animation: hover 5s infinite ease-in-out;
+        }
+        @keyframes hover {
+            0%, 100% {
+                transform: translateY(0);
+            }
+            50% {
+                transform: translateY(-20px);
+            }
+        }
+        .graphic-phone {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            width: 50px;
+            height: 100px;
+            background-color: #8b4513;
+            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
+            animation: slide 10s infinite linear;
+        }
+        @keyframes slide {
+            0%, 100% {
+                transform: translateX(0);
+            }
+            50% {
+                transform: translateX(20px);
+            }
+        }
+        .graphic-foxconn {
+            position: absolute;
+            top: 20%;
+            left: -50px;
+            width: 100px;
+            height: 100px;
+            background-color: #8b4513;
+            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
+            animation: slide-left 10s infinite linear;
+        }
+        @keyframes slide-left {
+            0%, 100% {
+                transform: translateX(0);
+            }
+            50% {
+                transform: translateX(20px);
+            }
+        }
+        .graphic-dji {
+            position: absolute;
+            bottom: 20%;
+            right: -50px;
+            width: 100px;
+            height: 100px;
+            background-color: #d2b48c;
+            clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%);
+            animation: slide-right 10s infinite linear;
+        }
+        @keyframes slide-right {
+            0%, 100% {
+                transform: translateX(0);
+            }
+            50% {
+                transform: translateX(-20px);
+            }
+        }
+        .graphic-side {
+            position: fixed;
+            top: 0;
+            width: 50px;
+            height: 100%;
+            background-color: #8b4513;
+            clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
+            animation: slide-side 10s infinite linear;
+        }
+        .graphic-side-left {
+            left: 0;
+        }
+        .graphic-side-right {
+            right: 0;
+        }
+        @keyframes slide-side {
+            0%, 100% {
+                transform: translateY(0);
+            }
+            50% {
+                transform: translateY(20px);
+            }
+        }
+    </style>
+</head>
+<body>
+    <header>
+        <h1>BirdL - Technical Research Firm</h1>
+        <p>Deep Dive Analysis on Electronics Assembly, Machinery Advancement, and Low Altitude Economy</p>
+        <div class="graphic"></div>
+        <div class="graphic-drone"></div>
+        <div class="graphic-phone"></div>
+        <div class="graphic-foxconn"></div>
+        <div class="graphic-dji"></div>
+        <div class="graphic-side graphic-side-left"></div>
+        <div class="graphic-side graphic-side-right"></div>
+    </header>
+    <div class="container">
+        <div class="intro">
+            <h2>Welcome to BirdL</h2>
+            <p>At BirdL, we specialize in providing in-depth analysis and research on the development of electronics within China. Our focus areas include electronics assembly, machinery advancement, and the emerging low altitude economy. We aim to provide valuable insights and strategic guidance to our clients.</p>
+        </div>
+        <div class="leadership">
+            <h2>Leadership</h2>
+            <div>
+                <img src="placeholder_image.jpg" alt="Julian Herrera">
+                <h3>Julian Herrera - Founder & CEO</h3>
+                <p>Julian Herrera is a seasoned industry expert with over 20 years of experience in technical research and analysis. His vision and leadership have been instrumental in establishing BirdL as a leading research firm in the electronics and machinery sectors.</p>
+            </div>
+        </div>
+        <div class="research-goals">
+            <h2>Research Goals</h2>
+            <ul>
+                <li><strong>Electronics Assembly Analysis:</strong> Provide comprehensive research on the latest trends and technologies in electronics assembly.</li>
+                <li><strong>Machinery Advancement:</strong> Offer insights into the advancements in machinery and manufacturing processes.</li>
+                <li><strong>Low Altitude Economy:</strong> Explore the economic opportunities and challenges in the low altitude sector.</li>
+                <li><strong>Strategic Guidance:</strong> Deliver actionable insights and strategic guidance to help clients navigate the complex technological landscape.</li>
+            </ul>
+        </div>
+        <div class="study-areas">
+            <h2>Areas of Study</h2>
+            <ul>
+                <li><strong>Electronics Assembly:</strong> Detailed analysis of the latest trends and technologies in electronics assembly.</li>
+                <li><strong>Machinery Advancement:</strong> Insights into the advancements in machinery and manufacturing processes.</li>
+                <li><strong>Low Altitude Economy:</strong> Exploration of the economic opportunities and challenges in the low altitude sector.</li>
+            </ul>
+        </div>
+        <div class="research-methods">
+            <h2>Research Methods</h2>
+            <ul>
+                <li>
+                    <h3>Electronics Assembly</h3>
+                    <p>Our research in electronics assembly involves:</p>
+                    <ul>
+                        <li>Industry surveys and interviews with key stakeholders.</li>
+                        <li>Analysis of patent filings and technological advancements.</li>
+                        <li>Case studies of leading electronics manufacturers in China.</li>
+                    </ul>
+                </li>
+                <li>
+                    <h3>Machinery Advancement</h3>
+                    <p>Our research in machinery advancement involves:</p>
+                    <ul>
+                        <li>Benchmarking against global standards and best practices.</li>
+                        <li>Collaboration with academic institutions and research labs.</li>
+                        <li>Field studies and factory visits to understand real-world applications.</li>
+                    </ul>
+                </li>
+                <li>
+                    <h3>Low Altitude Economy</h3>
+                    <p>Our research in the low altitude economy involves:</p>
+                    <ul>
+                        <li>Policy analysis and regulatory landscape assessment.</li>
+                        <li>Market sizing and demand forecasting.</li>
+                        <li>Case studies of successful low altitude economy projects.</li>
+                    </ul>
+                </li>
+            </ul>
+        </div>
+        <div class="operations">
+            <h2>Operations</h2>
+            <ul>
+                <li><strong>Dongguan:</strong> Our primary research and development center, focusing on electronics assembly and machinery advancement.</li>
+                <li><strong>Foshan:</strong> Our secondary research hub, specializing in low altitude economy and strategic guidance.</li>
+                <li><strong>La Quinta, CA:</strong> Our North American operations base, facilitating international collaboration and client engagement.</li>
+            </ul>
+        </div>
+        <div class="about">
+            <h2>About Us</h2>
+            <p>BirdL is a leading technical research firm dedicated to understanding and analyzing the complex landscape of electronics development in China. Our team of experts combines industry knowledge with analytical rigor to deliver actionable insights. We are committed to helping our clients navigate the ever-evolving technological landscape.</p>
+        </div>
+        <div class="blog">
+            <h2>Blog</h2>
+            <ul>
+                <li><a href="blog_post1.html">Latest Trends in Electronics Assembly</a></li>
+                <li><a href="blog_post2.html">Advancements in Machinery Technology</a></li>
+                <li><a href="blog_post3.html">The Future of the Low Altitude Economy</a></li>
+            </ul>
+        </div>
+        <div class="social-links">
+            <h2>Follow Us</h2>
+            <a href="https://twitter.com/BirdLTechHQ" target="_blank">BirdLTechHQ on X</a>
+            <a href="https://github.com/BirdLabortories" target="_blank">BirdLabortories on GitHub</a>
+        </div>
+    </div>
+    <script>
+        // Smooth scrolling for anchor links
+        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+            anchor.addEventListener('click', function (e) {
+                e.preventDefault();
+                document.querySelector(this.getAttribute('href')).scrollIntoView({
+                    behavior: 'smooth'
+                });
+            });
+        });
+        // Fade in sections on scroll
+        const sections = document.querySelectorAll('.intro, .leadership, .research-goals, .about, .blog, .study-areas, .research-methods, .operations');
+        const observer = new IntersectionObserver(entries => {
+            entries.forEach(entry => {
+                if (entry.isIntersecting) {
+                    entry.target.style.opacity = 1;
+                } else {
+                    entry.target.style.opacity = 0;
+                }
+            });
+        }, { threshold: 0.1 });
+        sections.forEach(section => {
+            observer.observe(section);
+        });
+    </script>
+</body>
+</html>