Spaces:

maomaobj
/

nongye9

Running

App Files Files Community

maomaobj commited on Jul 23, 2025

Commit

4287d37

verified ·

1 Parent(s): 7bb3f20

将顶部菜单栏的颜色，修改为绿色系 - Initial Deployment

Browse files

Files changed (2) hide show

README.md +7 -5
index.html +359 -19

README.md CHANGED Viewed

@@ -1,10 +1,12 @@
 ---
-title: Nongye9
-emoji: 📈
-colorFrom: pink
-colorTo: blue
 sdk: static
 pinned: false
 ---
-Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

 ---
+title: nongye9
+emoji: 🐳
+colorFrom: gray
+colorTo: pink
 sdk: static
 pinned: false
+tags:
+  - deepsite
 ---
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

index.html CHANGED Viewed

@@ -1,19 +1,359 @@
-<!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="zh-CN">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>2025年全国农民技能大赛 - 报名通道</title>
+  <script src="https://cdn.tailwindcss.com"></script>
+  <script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
+  <script>
+    tailwind.config = {
+      theme: {
+        extend: {
+          colors: {
+            'primary-green': '#1b5e20',
+            'light-green': '#e8f5e9',
+            'secondary-gray': '#f5f5f5',
+            'accent-gray': '#6b7280'
+          }
+        }
+      }
+    }
+    // 轮播图功能
+    document.addEventListener('DOMContentLoaded', function() {
+      let currentSlide = 0;
+      const slides = document.querySelectorAll('.banner-slide');
+      function showSlide(index) {
+        slides.forEach((slide, i) => {
+          slide.classList.toggle('hidden', i !== index);
+        });
+      }
+      function nextSlide() {
+        currentSlide = (currentSlide + 1) % slides.length;
+        showSlide(currentSlide);
+      }
+      // 自动轮播
+      setInterval(nextSlide, 5000);
+      // 报名按钮点击效果
+      document.getElementById('registration-btn').addEventListener('click', () => {
+        alert('报名功能即将开启，请关注后续通知！');
+      });
+      // 为功能按钮添加悬停效果
+      document.querySelectorAll('.action-btn').forEach(btn => {
+        btn.addEventListener('mouseenter', () => {
+          btn.classList.remove('shadow-sm');
+          btn.classList.add('shadow-md');
+        });
+        btn.addEventListener('mouseleave', () => {
+          btn.classList.add('shadow-sm');
+          btn.classList.remove('shadow-md');
+        });
+      });
+    });
+  </script>
+  <style type="text/css">
+    .banner-slide {
+      transition: opacity 0.5s ease;
+    }
+    .section-divider {
+      height: 1px;
+      background: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,0.1), rgba(0,0,0,0));
+    }
+    .nav-item:hover {
+      background-color: #2d5282;
+      transition: background-color 0.3s;
+    }
+    .banner-grid {
+      grid-template-columns: 1.5fr 1fr;
+    }
+    .feature-card {
+      transition: all 0.3s ease;
+    }
+    .feature-card:hover {
+      transform: translateY(-5px);
+      box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1);
+    }
+    @media (max-width: 768px) {
+      .banner-grid {
+        grid-template-columns: 1fr;
+      }
+      .btn-grid {
+        grid-template-columns: repeat(2, 1fr);
+      }
+    }
+  </style>
+</head>
+<body class="bg-gray-50">
+  <!-- 顶部导航栏 -->
+  <header class="bg-primary-green text-white sticky top-0 z-50 shadow">
+    <div class="container mx-auto px-4 py-2 flex justify-between items-center">
+      <div class="flex items-center space-x-4">
+        <!-- Logo -->
+        <div class="flex items-center">
+          <i class="fas fa-tractor text-2xl text-yellow-400"></i>
+          <div class="ml-2">
+            <div class="font-bold text-xl">全国农业技能平台</div>
+            <div class="text-xs opacity-80 mt-[-2px]">NATIONAL AGRICULTURE SKILLS</div>
+          </div>
+        </div>
+        <!-- 导航链接 -->
+        <nav class="hidden md:flex space-x-1">
+          <a href="#" class="nav-item px-3 py-2 rounded-md hover:bg-green-700">首页</a>
+          <a href="#" class="nav-item px-3 py-2 rounded-md bg-green-700 font-medium">技能大赛</a>
+          <a href="#" class="nav-item px-3 py-2 rounded-md hover:bg-green-700">技能培训</a>
+          <a href="#" class="nav-item px-3 py-2 rounded-md hover:bg-green-700">政策解读</a>
+          <a href="#" class="nav-item px-3 py-2 rounded-md hover:bg-green-700">活动展示</a>
+          <a href="#" class="nav-item px-3 py-2 rounded-md hover:bg-green-700">我的资料</a>
+        </nav>
+      </div>
+      <!-- 登录/注册按钮 -->
+      <div>
+        <a href="#" class="bg-yellow-500 hover:bg-yellow-600 text-white py-2 px-6 rounded-full font-medium shadow-sm transition-colors">
+          <i class="fas fa-user mr-1"></i> 登录/注册
+        </a>
+      </div>
+    </div>
+  </header>
+  <!-- Banner区域 -->
+  <section class="bg-gradient-to-r from-blue-50 to-cyan-50 py-16">
+    <div class="container mx-auto px-4">
+      <div class="grid banner-grid gap-12">
+        <div>
+          <div class="mb-4">
+            <span class="bg-blue-100 text-blue-800 text-sm font-bold px-3 py-1 rounded-full">
+              <i class="fas fa-calendar-alt mr-1"></i> 2025年度重点赛事
+            </span>
+          </div>
+          <h1 class="text-4xl md:text-5xl font-bold text-primary-blue mb-4">
+            2025年全国农民技能大赛
+          </h1>
+          <div class="space-y-3 text-gray-700 mb-6">
+            <div class="flex items-center">
+              <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center mr-3">
+                <i class="fas fa-clock text-blue-600"></i>
+              </div>
+              <div class="font-medium">
+                大赛时间：<span class="text-gray-900 font-bold">2025年9月15日 - 18日</span>
+              </div>
+            </div>
+            <div class="flex items-center">
+              <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center mr-3">
+                <i class="fas fa-map-marker-alt text-blue-600"></i>
+              </div>
+              <div class="font-medium">
+                大赛地点：<span class="text-gray-900 font-bold">江苏省南京市农业展览馆</span>
+              </div>
+            </div>
+            <div class="flex items-center">
+              <div class="w-8 h-8 rounded-full bg-blue-100 flex items-center justify-center mr-3">
+                <i class="fas fa-building text-blue-600"></i>
+              </div>
+              <div class="font-medium">
+                主办单位：<span class="text-gray-900 font-bold">农业农村部</span>
+              </div>
+            </div>
+          </div>
+          <div class="bg-white rounded-lg shadow-md p-4 mb-6 border-l-4 border-primary-blue">
+            <h3 class="text-primary-blue font-bold mb-2">大赛简介：</h3>
+            <p>本届大赛旨在推动农业技术创新和人才培养，包含农机驾驶、精准灌溉、果树修剪、农产品加工、茶艺展示等十余个竞赛项目，涵盖农业生产的多个领域，为全国农业从业者提供展示技能、交流经验的平台。</p>
+          </div>
+          <div class="flex flex-wrap gap-2">
+            <span class="bg-blue-50 text-blue-800 px-3 py-1 rounded-full text-sm">农机驾驶</span>
+            <span class="bg-blue-50 text-blue-800 px-3 py-1 rounded-full text-sm">果树修剪</span>
+            <span class="bg-blue-50 text-blue-800 px-3 py-1 rounded-full text-sm">精准灌溉</span>
+            <span class="bg-blue-50 text-blue-800 px-3 py-1 rounded-full text-sm">农产品加工</span>
+            <span class="bg-blue-50 text-blue-800 px-3 py-1 rounded-full text-sm">智能大棚管理</span>
+            <span class="bg-blue-50 text-blue-800 px-3 py-1 rounded-full text-sm">茶艺展示</span>
+          </div>
+        </div>
+        <!-- 图片轮播区 -->
+        <div class="relative rounded-xl overflow-hidden shadow-lg">
+          <div class="h-full w-full banner-slide bg-cover bg-center" style="background-image: url('https://images.unsplash.com/photo-1605000797499-95a51c5269ae?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1500&q=80')">
+            <div class="h-full w-full bg-black bg-opacity-40 flex items-center justify-center">
+              <div class="text-center p-8 text-white">
+                <h3 class="text-3xl font-bold mb-4">2025年全国农民技能大赛</h3>
+                <p class="text-xl">技能成就未来 乡村振兴有我</p>
+              </div>
+            </div>
+          </div>
+          <div class="h-full w-full banner-slide hidden bg-cover bg-center" style="background-image: url('https://images.unsplash.com/photo-1586771107445-d3ca888129ce?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=1500&q=80')">
+            <div class="h-full w-full bg-black bg-opacity-40 flex items-center justify-center">
+              <div class="text-center p-8 text-white">
+                <h3 class="text-3xl font-bold mb-4">往届优秀选手风采</h3>
+                <p class="text-xl">传承农业技艺 弘扬工匠精神</p>
+              </div>
+            </div>
+          </div>
+          <!-- 轮播指示器 -->
+          <div class="absolute bottom-4 left-0 right-0 flex justify-center space-x-2">
+            <div class="w-3 h-3 rounded-full bg-white border border-white"></div>
+            <div class="w-3 h-3 rounded-full bg-gray-300 border border-white"></div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+  <!-- 功能操作按钮区 -->
+  <section class="py-8 bg-white">
+    <div class="container mx-auto px-4">
+      <div class="max-w-4xl mx-auto">
+        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-5 btn-grid gap-4">
+          <button id="registration-btn" class="action-btn bg-primary-blue hover:bg-blue-900 text-white py-4 rounded-lg font-bold shadow-sm transition-colors transform hover:scale-[1.03]">
+            <i class="fas fa-pencil-alt mr-2"></i> 我要报名
+          </button>
+          <button class="action-btn bg-white border border-gray-300 text-gray-700 hover:bg-gray-50 py-4 rounded-lg font-medium shadow-sm transition-colors">
+            <i class="far fa-calendar-alt mr-2"></i> 查看赛程
+          </button>
+          <button class="action-btn bg-white border border-gray-300 text-gray-700 hover:bg-gray-50 py-4 rounded-lg font-medium shadow-sm transition-colors">
+            <i class="fas fa-file-download mr-2"></i> 下载报名须知
+          </button>
+          <button class="action-btn bg-white border border-gray-300 text-gray-700 hover:bg-gray-50 py-4 rounded-lg font-medium shadow-sm transition-colors">
+            <i class="fas fa-history mr-2"></i> 往届回顾
+          </button>
+          <button class="action-btn bg-white border border-gray-300 text-gray-700 hover:bg-gray-50 py-4 rounded-lg font-medium shadow-sm transition-colors">
+            <i class="fas fa-home mr-2"></i> 返回首页
+          </button>
+        </div>
+      </div>
+    </div>
+  </section>
+  <!-- 报名须知区域 -->
+  <section class="py-16 bg-white">
+    <div class="container mx-auto px-4">
+      <div class="text-center mb-12">
+        <h2 class="text-3xl font-bold text-primary-blue">报 名 须 知</h2>
+        <div class="w-24 h-1 bg-primary-blue mx-auto mt-4 mb-6"></div>
+        <p class="text-gray-600 max-w-2xl mx-auto">请仔细阅读以下参赛信息，如有任何疑问请与我们的工作人员联系</p>
+      </div>
+      <div class="max-w-5xl mx-auto bg-secondary-gray rounded-xl shadow-sm p-8">
+        <div class="grid grid-cols-1 md:grid-cols-2 gap-8">
+          <!-- 左列 -->
+          <div>
+            <div class="mb-6">
+              <div class="flex items-center mb-3">
+                <div class="w-10 h-10 rounded-full bg-primary-blue text-white flex items-center justify-center mr-3">
+                  1
+                </div>
+                <h3 class="text-xl font-bold text-primary-blue">报名对象及条件</h3>
+              </div>
+              <ul class="list-disc pl-10 space-y-2 text-gray-700">
+                <li>全国农业从业人员、新型职业农民</li>
+                <li>年龄在18岁至60岁之间</li>
+                <li>具有相关农业技能和从业经验</li>
+                <li>服从比赛规则和组织安排</li>
+              </ul>
+            </div>
+            <div>
+              <div class="flex items-center mb-3">
+                <div class="w-10 h-10 rounded-full bg-primary-blue text-white flex items-center justify-center mr-3">
+                  2
+                </div>
+                <h3 class="text-xl font-bold text-primary-blue">报名截止时间</h3>
+              </div>
+              <div class="pl-10 text-gray-700">
+                <p>报名截止日期：<span class="font-bold text-primary-blue">2025年7月31日</span></p>
+                <p class="text-sm mt-2"><i class="fas fa-exclamation-circle text-yellow-500 mr-1"></i> 逾期系统将自动关闭报名通道</p>
+              </div>
+            </div>
+          </div>
+          <!-- 右列 -->
+          <div>
+            <div class="mb-6">
+              <div class="flex items-center mb-3">
+                <div class="w-10 h-10 rounded-full bg-primary-blue text-white flex items-center justify-center mr-3">
+                  3
+                </div>
+                <h3 class="text-xl font-bold text-primary-blue">所需材料</h3>
+              </div>
+              <ul class="list-disc pl-10 space-y-2 text-gray-700">
+                <li>本人身份证正反面扫描件（JPG格式）</li>
+                <li>近期彩色免冠证件照片</li>
+                <li>技能资格证书或相关培训证明</li>
+                <li>单位推荐信或村委证明材料</li>
+              </ul>
+            </div>
+            <div>
+              <div class="flex items-center mb-3">
+                <div class="w-10 h-10 rounded-full bg-primary-blue text-white flex items-center justify-center mr-3">
+                  4
+                </div>
+                <h3 class="text-xl font-bold text-primary-blue">联系方式</h3>
+              </div>
+              <div class="pl-10 text-gray-700">
+                <div class="flex items-center mb-2">
+                  <i class="w-6 fas fa-phone text-blue-600"></i>
+                  <span class="ml-2">029-87651123 (李老师)</span>
+                </div>
+                <div class="flex items-center">
+                  <i class="w-6 fas fa-envelope text-blue-600"></i>
+                  <span class="ml-2">farmerskill@agri.gov.cn</span>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </section>
+  <!-- 底部页脚 -->
+  <footer class="bg-primary-blue text-gray-300 py-8">
+    <div class="container mx-auto px-4">
+      <div class="flex flex-col md:flex-row justify-between items-center">
+        <div class="mb-4 md:mb-0">
+          <div class="flex items-center mb-2">
+            <i class="fas fa-tractor text-2xl text-yellow-400 mr-3"></i>
+            <h3 class="text-xl font-bold text-white">全国农业技能平台</h3>
+          </div>
+          <p class="text-sm">服务三农发展 · 赋能乡村振兴</p>
+        </div>
+        <div class="text-center md:text-right">
+          <div class="mb-2 text-sm">
+            主办单位：农业农村部人力资源开发中心 · 农业农村部职业技能鉴定指导中心
+          </div>
+          <div class="flex flex-col md:flex-row md:space-x-6 justify-center md:justify-end">
+            <div>ICP备案号：京ICP备12345678号-1</div>
+            <div>联系电话：010-81123456</div>
+            <div>技术支持：中国农业科技信息中心</div>
+          </div>
+        </div>
+      </div>
+      <div class="mt-8 pt-6 border-t border-gray-700 text-center text-sm opacity-75">
+        © 2025 全国农业技能平台 版权所有 技术支持单位：农业农村部信息中心
+      </div>
+    </div>
+  </footer>
+<p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=maomaobj/nongye9" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body>
+</html>