828 lines
59 KiB
HTML
828 lines
59 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="zh-CN">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
|
||
<meta name="viewport" id="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
|
||
<title>GVSDS - 银河锋锐软件开发工作室</title>
|
||
<script src="https://cdn.tailwindcss.com/"></script>
|
||
<script src="https://cdn.bootcdn.net/ajax/libs/Chart.js/4.5.0/chart.umd.min.js"></script>
|
||
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/6.5.1/css/all.min.css" rel="stylesheet" media="print" onload="this.media='all'">
|
||
<script src="./assets/js/scrollreveal.min.js"></script>
|
||
<script src="https://cdn.bootcdn.net/ajax/libs/particles.js/2.0.0/particles.min.js"></script>
|
||
<link rel="preconnect" href="https://fonts.googleapis.com" media="print" onload="this.media='all'">
|
||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin media="print" onload="this.media='all'">
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;800&display=swap" rel="stylesheet">
|
||
<script src="./assets/js/tailwind-config.js"></script>
|
||
<img src="./assets/icon/icon.png" alt="hide-log" style="display: none;">
|
||
<style type="text/tailwindcss">
|
||
@layer utilities {
|
||
.content-auto { content-visibility: auto; }
|
||
.svg-container {
|
||
@apply w-full h-auto transition-all ease-in-out;
|
||
transition-duration: 3000ms !important;
|
||
margin-right: 20px
|
||
}
|
||
.svg-container-desktop { @apply max-w-5xl max-h-[80vh]; }
|
||
.svg-container-mobile { @apply max-w-full max-h-[60vh]; }
|
||
.text-item { @apply text-gray-900 opacity-0 transition-opacity duration-1000 ease-in-out; display: none; }
|
||
.reveal {
|
||
opacity: 0;
|
||
transform: translateY(20px);
|
||
transition:
|
||
opacity 0.25s ease-out,
|
||
transform 0.25s ease-out,
|
||
visibility 0.25s ease-out;
|
||
visibility: hidden;
|
||
}
|
||
.reveal.active {
|
||
opacity: 1;
|
||
transform: translateY(0);
|
||
visibility: visible;
|
||
}
|
||
.reveal[style*="transition-delay"] {
|
||
transition-delay: inherit;
|
||
}
|
||
.text-fill {
|
||
background: linear-gradient(to right, #111827 0%, #111827 100%, transparent 100%);
|
||
background-size: 0% 100%;
|
||
background-repeat: no-repeat;
|
||
background-position: left bottom;
|
||
-webkit-background-clip: text;
|
||
background-clip: text;
|
||
}
|
||
/* 粒子背景容器 */
|
||
.particles-container {
|
||
position: absolute;
|
||
top: 0;
|
||
left: 0;
|
||
width: 100%;
|
||
height: 100%;
|
||
z-index: 0;
|
||
}
|
||
}
|
||
</style>
|
||
<link rel="text/tailwindcss" href="./assets/css/gvsds-tailwindcss.css">
|
||
<link rel="stylesheet" href="./assets/css/gvsds-page.css">
|
||
<link rel="stylesheet" href="./assets/css/typewriter.css">
|
||
</head>
|
||
|
||
<body class="bg-white text-gray-900">
|
||
<nav id="navbar" class="fixed w-full top-0 z-50 transition-all duration-500 py-4 px-4 md:px-8 bg-white/90 backdrop-blur-sm shadow-sm">
|
||
<div class="container mx-auto flex items-center justify-between">
|
||
<!-- 品牌标识 -->
|
||
<div class="reveal">
|
||
<a href="/index.html" class="flex items-center">
|
||
<span id="logo-text" class="text-2xl md:text-3xl font-extrabold text-gray-900 transition-all duration-500">
|
||
G<span class="transition-transform duration-500 hover:translate-x-1">V</span>S<span class="transition-transform duration-500 hover:translate-x-1">D</span>S
|
||
</span>
|
||
</a>
|
||
</div>
|
||
|
||
<!-- 主导航(桌面端) -->
|
||
<div class="hidden md:flex items-center space-x-1 md:space-x-8 reveal">
|
||
<a href="/index.html" class="text-gray-900 font-normal hover:text-gray-600 transition-colors duration-300 border-b-2 border-transparent py-1">主页</a>
|
||
<a href="/gallery.html" class="text-gray-900 font-normal hover:text-gray-600 transition-colors duration-300 border-b-2 border-transparent py-1">画廊</a>
|
||
<a href="https://doc.gvsds.com/9bc298e9c1d03ed3bd4777181bf7411d" target="_blank" class="text-gray-900 font-normal hover:text-gray-600 transition-colors duration-300 border-b-2 border-transparent py-1 flex items-center">
|
||
文档 <i class="fa fa-external-link ml-1 text-xs"></i>
|
||
</a>
|
||
<a href="/members.html?Type=Members" class="text-gray-900 font-normal hover:text-gray-600 transition-colors duration-300 border-b-2 border-transparent py-1">成员</a>
|
||
<a href="/history.html" class="text-gray-900 font-normal hover:text-gray-600 transition-colors duration-300 border-b-2 border-transparent py-1">历史</a>
|
||
</div>
|
||
|
||
<!-- 用户入口 -->
|
||
<div class="relative reveal hidden md:block">
|
||
<div id="user-avatar" class="w-10 h-10 md:w-12 md:h-12 rounded-full border border-gray-300 flex items-center justify-center transition-all duration-300 hover:scale-110 cursor-pointer p-0 m-0">
|
||
<i id="user-null" class="fa fa-user text-gray-900"></i>
|
||
</div>
|
||
<!-- 登录/注册下拉框 -->
|
||
<div id="user-dropdown" class="absolute right-0 top-full mt-2 w-48 bg-white border border-gray-200 rounded-md p-3 shadow-lg opacity-0 invisible transition-all duration-300 z-50">
|
||
<a id="user-dropdown-login-pc" href="/login.html" target="_blank"" class="block text-gray-900 hover:text-gray-600 py-2 transition-colors duration-200">登录</a>
|
||
<a id="user-dropdown-register-pc" href="/register.html" target="_blank" class="block text-gray-900 hover:text-gray-600 py-2 transition-colors duration-200">注册</a>
|
||
<a id="user-dropdown-admin-pc" href="/api/gerp/user/ljumpm/" target="_blank" class="block text-gray-900 hover:text-gray-600 py-2 transition-colors duration-200">后台</a>
|
||
<div class="mt-2 pt-2 border-t border-gray-200">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 移动端菜单按钮 -->
|
||
<div class="md:hidden reveal">
|
||
<button id="mobile-menu-btn" class="text-gray-900 text-2xl p-2 focus:outline-none hover:bg-gray-100 rounded-md transition-colors duration-200">
|
||
<i class="fa fa-bars"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 移动端菜单背景遮罩 -->
|
||
<div id="mobile-menu-backdrop" class="fixed inset-0 bg-black bg-opacity-10 z-40 md:hidden opacity-0 invisible transition-opacity duration-300"></div>
|
||
|
||
<!-- 移动端侧边导航 -->
|
||
<div id="mobile-menu" class="fixed top-0 right-0 w-64 h-full bg-white z-50 transform translate-x-full-full transition-transform duration-300 ease-in-out md:hidden shadow-2xl">
|
||
<!-- 菜单内容容器,允许滚动 -->
|
||
<div class="p-6 h-full flex flex-col overflow-y-auto">
|
||
<div class="flex justify-between items-center mb-8">
|
||
<span class="text-xl font-bold text-gray-900">菜单</span>
|
||
<button id="close-menu-btn" class="text-gray-900 p-2 hover:bg-gray-100 rounded-md transition-colors duration-200">
|
||
<i class="fa fa-times text-xl"></i>
|
||
</button>
|
||
</div>
|
||
|
||
<div class="flex flex-col space-y-1 flex-grow">
|
||
<a href="/index.html" class="text-gray-900 font-normal hover:bg-gray-100 transition-colors duration-300 py-3 px-4 border-l-4 border-transparent hover:border-gray-300">主页</a>
|
||
<a href="/gallery.html" class="text-gray-900 font-normal hover:bg-gray-100 transition-colors duration-300 py-3 px-4 border-l-4 border-transparent hover:border-gray-300">画廊</a>
|
||
<a href="https://doc.gvsds.com/9bc298e9c1d03ed3bd4777181bf7411d" target="_blank" class="text-gray-900 font-normal hover:bg-gray-100 transition-colors duration-300 py-3 px-4 border-l-4 border-transparent hover:border-gray-300 flex items-center">
|
||
文档 <i class="fa fa-external-link ml-1 text-xs"></i>
|
||
</a>
|
||
<a href="/members.html?Type=Members" class="text-gray-900 font-normal hover:bg-gray-100 transition-colors duration-300 py-3 px-4 border-l-4 border-transparent hover:border-gray-300">成员</a>
|
||
<a href="/history.html" class="text-gray-900 font-normal hover:bg-gray-100 transition-colors duration-300 py-3 px-4 border-l-4 border-transparent hover:border-gray-300">历史</a>
|
||
</div>
|
||
|
||
<div class="mt-6 pt-6 border-t border-gray-200">
|
||
<a id="user-dropdown-login-mb" href="/login.html" target="_blank" class="text-gray-900 hover:bg-gray-100 transition-colors duration-200 flex items-center py-3 px-4 rounded-md">
|
||
<i class="fa fa-user mr-3 w-5 text-center"></i> 登录
|
||
</a>
|
||
<a id="user-dropdown-register-mb" href="/register.html" target="_blank" class="text-gray-900 hover:bg-gray-100 transition-colors duration-200 flex items-center py-3 px-4 rounded-md">
|
||
<i class="fa fa-user mr-3 w-5 text-center"></i> 注册
|
||
</a>
|
||
<a id="user-dropdown-admin-mb" href="/api/gerp/user/ljumpm/" target="_blank" class="text-gray-900 hover:bg-gray-100 transition-colors duration-200 flex items-center py-3 px-4 rounded-md">
|
||
<i class="fa fa-user mr-3 w-5 text-center"></i> 后台
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</nav>
|
||
|
||
<main>
|
||
|
||
<script>
|
||
document.body.classList.add("overflow-hidden");
|
||
</script>
|
||
|
||
<section class="min-h-screen flex items-center justify-center relative pt-16 overflow-hidden bg-gray-50">
|
||
<!-- 粒子背景(新增加载动画) -->
|
||
<div id="particles-js" class="particles-container" style="opacity: 0; transition: opacity 1.2s ease-in-out; background-color: #f9fafb;"></div>
|
||
<div id="card-container" class="relative w-[80%] border-0 rounded-xl transition-all duration-700 ease-in-out overflow-hidden min-h-[60vh] md:min-h-[70vh] bg-white shadow-md">
|
||
<!-- 文字容器(新增滚动触发动画) -->
|
||
<div id="text-container" class="absolute left-0 top-0 h-full flex items-center justify-center px-6 opacity-0 transition-opacity duration-700 ease-in-out z-10"
|
||
style="display: flex; padding-top: 0;">
|
||
<div class="flex flex-col gap-6">
|
||
<div class="container mx-auto px-4 md:px-8 relative z-10">
|
||
<div class="max-w-5xl mx-auto text-center" style="display: flex; flex-direction: column; justify-content: center;">
|
||
<div class="h-[15vh] w-full"></div>
|
||
<h1 id="main-title" class="text-item text-[8vw] md:text-[6vw] lg:text-[5vw] font-extrabold text-gray-900 leading-tight mb-4 opacity-0 transform translate-x-[-50px] transition-all duration-1200 ease-out"
|
||
style="text-shadow: 0 0 15px rgba(0,0,0,0.05);">
|
||
GVSDS
|
||
</h1>
|
||
<h2 id="sub-title" class="text-item text-[3vw] md:text-[2vw] lg:text-[1.8vw] font-normal text-gray-800 mb-6 opacity-0 transform translate-x-[50px] transition-all duration-800 ease-out delay-400">
|
||
银河锋锐软件开发工作室
|
||
</h2>
|
||
<p id="tag-text-1" class="text-item text-[1.5vw] md:text-[1.2vw] lg:text-[1vw] text-gray-600 font-medium opacity-0 transition-all duration-500 ease-out delay-800 hover:scale-105">
|
||
非盈利·技术驱动·兴趣聚合
|
||
</p>
|
||
<p id="tag-text-2" class="text-item text-[1.5vw] md:text-[1.2vw] lg:text-[1vw] text-gray-600 font-medium opacity-0 transition-opacity duration-500 ease-out delay-800 mt-2">
|
||
<span class="typewriter typetext"></span>
|
||
</p>
|
||
</div>
|
||
<!-- 分割线(新增滚动渐显) -->
|
||
<div class="flex flex-col items-center mt-8 md:mt-12 mx-auto opacity-0 transition-opacity duration-800 ease-out delay-1200" id="line-container">
|
||
<div class="line-item w-1/2 h-0.5 bg-gray-200 mb-5 transition-all duration-500 hover:w-3/4"></div>
|
||
<div class="line-item w-1/3 h-0.5 bg-gray-300 mb-5 transition-all duration-500 hover:w-2/4"></div>
|
||
<div class="line-item w-1/4 h-0.5 bg-gray-400 transition-all duration-500 hover:w-1/4"></div>
|
||
</div>
|
||
<!-- 新增向下滚动指引(动画箭头) -->
|
||
<div class="absolute bottom-10 left-1/2 transform -translate-x-1/2 opacity-0 transition-opacity duration-800 ease-out delay-1500" id="scroll-indicator">
|
||
<a href="#about" class="flex flex-col items-center text-gray-700/80 hover:text-gray-900">
|
||
<span class="text-sm mb-2">向下探索</span>
|
||
<i class="fa fa-chevron-down animate-bounce"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- SVG背景(新增悬停旋转效果) -->
|
||
<div id="svg-wrapper" class="absolute inset-0 flex items-center justify-center transition-all duration-700 ease-in-out z-0" style="opacity: 0;">
|
||
<object id="svg-container"
|
||
data="./assets/icon/ICON.svg"
|
||
type="image/svg+xml"
|
||
class="svg-container svg-container-desktop md:svg-container-desktop xs:svg-container-mobile object-contain transition-all duration-1000 ease-in-out"
|
||
style="will-change: transform;">
|
||
<div class="text-gray-900 text-center p-8">
|
||
<i class="fa fa-exclamation-triangle text-4xl mb-4 text-yellow-500"></i>
|
||
<p>无法加载SVG文件</p>
|
||
<p class="text-sm text-gray-500 mt-2">请检查文件路径是否正确</p>
|
||
</div>
|
||
</object>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 md:py-28 px-4 md:px-8 bg-white">
|
||
<div class="container mx-auto">
|
||
<!-- 标题(与"我们的性质"模块标题风格一致,保持系列感) -->
|
||
<div class="mb-16 md:mb-24 reveal">
|
||
<h2 class="text-3xl md:text-4xl font-extrabold text-gray-900 pl-4 border-l-4 border-gray-900 text-fill">
|
||
关于我们
|
||
</h2>
|
||
</div>
|
||
|
||
<!-- 前言内容网格(单栏基础布局,适配响应式,保留渐显与hover交互) -->
|
||
<div class="grid grid-cols-1 lg:grid-cols-12 gap-8">
|
||
<!-- 左侧:前言文字(占主要宽度,渐显加载) -->
|
||
<div class="reveal lg:col-span-8" style="transition-delay: 100ms;">
|
||
<div class="relative w-full bg-gray-50 border border-gray-200 rounded-lg p-8 md:p-10 flex flex-col justify-center transition-all duration-300 hover:shadow-[0_8px_30px_rgba(0,0,0,0.08)]">
|
||
<h3 class="text-2xl md:text-3xl font-bold text-gray-900 mb-6">银河锋锐软件开发工作室</h3>
|
||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6">
|
||
我们诞生于对技术的热爱与对协作的向往,是一支由一群年轻开发者组成的非盈利技术团队,或者可以说是一群“码农”吧。自成立以来,我们始终以「技术普惠、共同成长」为初心,致力于通过开源项目、技术分享与实践协作,让更多人感受技术的价值与乐趣。
|
||
</p>
|
||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6">
|
||
我们不追求商业利益,只专注于技术本身的探索与沉淀——从基础工具开发到前沿技术验证,从新手学习引导到团队协作实践,每一个项目都承载着我们对技术的热情与对社区的责任。
|
||
</p>
|
||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6">
|
||
同时,我们在多个平台(如GitHub等)分享我们的项目代码、技术文章、经验分享等,与更多的技术爱好者互动交流。也会在一些编程兼职平台写代码以支持工作室最基本的运转。
|
||
</p>
|
||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6">
|
||
如果你愿意在无聊的字符中与我们分享你的技术经验、项目代码、学习心得、以及日常生活等,我们也会非常欢迎你的参与。你也可以将本工作室作为一个交友平台和我们一起聊天。
|
||
</p>
|
||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed mb-6">
|
||
作为青年人,我们有着一腔热血,我们坚信,每一份对技术的热爱都能汇聚成改变的力量,每一次对未知的探索都能叩开创新的大门。
|
||
</p>
|
||
<p class="text-gray-700 text-lg md:text-xl leading-relaxed">
|
||
无论你是刚入门的技术新手,还是深耕领域的资深开发者,只要你对技术充满好奇、愿意分享与协作,这里都能成为你交流学习的平台。我们相信,技术的力量源于源于共同探索,成长的价值在于「成就彼此」。
|
||
</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 右侧:核心理念卡片(垂直排列,与文字区互补,渐显加载) -->
|
||
<div class="reveal lg:col-span-4 flex flex-col gap-6" style="transition-delay: 300ms;">
|
||
<!-- 理念1:技术初心 -->
|
||
<div class="relative w-full h-48 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center text-center transition-all duration-300 hover:translate-y-[-3px] hover:shadow-[0_6px_20px_rgba(0,0,0,0.06)]">
|
||
<div class="w-14 h-14 rounded-full bg-white flex items-center justify-center mb-4 border border-gray-300">
|
||
<i class="fa fa-code text-xl text-gray-900"></i>
|
||
</div>
|
||
<h4 class="text-xl font-semibold text-gray-900 mb-2">技术初心</h4>
|
||
<p class="text-gray-600 text-sm md:text-base">以纯粹热爱驱动技术探索,拒绝功利化开发</p>
|
||
</div>
|
||
|
||
<!-- 理念2:开放协作 -->
|
||
<div class="relative w-full h-48 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center text-center transition-all duration-300 hover:translate-y-[-3px] hover:shadow-[0_6px_20px_rgba(0,0,0,0.06)]">
|
||
<div class="w-14 h-14 rounded-full bg-white flex items-center justify-center mb-4 border border-gray-300">
|
||
<i class="fa fa-users text-xl text-gray-900"></i>
|
||
</div>
|
||
<h4 class="text-xl font-semibold text-gray-900 mb-2">开放协作</h4>
|
||
<p class="text-gray-600 text-sm md:text-base">打破技术壁垒,欢迎所有开发者参与共建</p>
|
||
</div>
|
||
|
||
<!-- 理念3:共同成长 -->
|
||
<div class="relative w-full h-48 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center text-center transition-all duration-300 hover:translate-y-[-3px] hover:shadow-[0_6px_20px_rgba(0,0,0,0.06)]">
|
||
<div class="w-14 h-14 rounded-full bg-white flex items-center justify-center mb-4 border border-gray-300">
|
||
<i class="fa fa-rocket text-xl text-gray-900"></i>
|
||
</div>
|
||
<h4 class="text-xl font-semibold text-gray-900 mb-2">共同成长</h4>
|
||
<p class="text-gray-600 text-sm md:text-base">在实践中学习,在分享中进步,彼此成就</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 加入号召(全宽卡片,突出显示,最后渐显) -->
|
||
<div class="reveal mt-12" style="transition-delay: 500ms;">
|
||
<div class="relative w-full bg-gray-900 rounded-lg p-8 flex flex-col md:flex-row items-center justify-between transition-all duration-300 hover:shadow-[0_8px_30px_rgba(0,0,0,0.15)]">
|
||
<div class="mb-6 md:mb-0">
|
||
<h4 class="text-2xl font-bold text-white mb-2">期待与你同行</h4>
|
||
<p class="text-gray-300 text-lg">加入我们,一起探索技术边界,创造更多可能</p>
|
||
</div>
|
||
<a href="mailto:hr@gvsds.com?subject=我申请加入银河锋锐软件开发工作室&body=您好!%0D%0A%0D%0A我是 [ 姓名 / 网名 ],我期望加入银河锋锐软件开发工作室。%0D%0A我的联系方式是 [ 微信(必填) / QQ / TEL / X / 电报 / DISCORD ] %0D%0A我的兴趣爱好是 [ 选填 ],我的能力是 [ 选填 ]。%0D%0A我能够作为 [ 画师 / 程序员 / 测试人员 ] 加入工作室。%0D%0A [ 您的更多个人信息(选填)(个人简历等) ] %0D%0A希望您能提供一个机会,感谢!%0D%0A—— [ 姓名 / 网名 ] [ 年-月-日 ]" class="px-8 py-3 bg-white text-gray-900 font-medium rounded-lg transition-all duration-300 hover:bg-gray-200 hover:shadow-[0_0_15px_rgba(255,255,255,0.3)]">
|
||
申请加入
|
||
</a>
|
||
</div>
|
||
</div>
|
||
<div class="reveal mt-16 grid grid-cols-2 md:grid-cols-4 gap-6 text-center" style="transition-delay: 700ms;">
|
||
<div class="bg-gray-50 p-6 rounded-lg border border-gray-200">
|
||
<div class="text-4xl font-bold text-gray-900 mb-2 counter">4 名</div>
|
||
<p class="text-gray-600">核心成员</p>
|
||
</div>
|
||
<div class="bg-gray-50 p-6 rounded-lg border border-gray-200">
|
||
<div class="text-4xl font-bold text-gray-900 mb-2 counter">28 个</div>
|
||
<p class="text-gray-600">项目</p>
|
||
</div>
|
||
<div class="bg-gray-50 p-6 rounded-lg border border-gray-200">
|
||
<div class="text-4xl font-bold text-gray-900 mb-2 counter">100w 行+</div>
|
||
<p class="text-gray-600">代码提交量</p>
|
||
</div>
|
||
<div class="bg-gray-50 p-6 rounded-lg border border-gray-200">
|
||
<div class="text-4xl font-bold text-gray-900 mb-2 counter">1500+ 位</div>
|
||
<p class="text-gray-600">客户</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="projects" class="py-20 md:py-28 px-4 md:px-8 bg-gray-50">
|
||
<div class="container mx-auto">
|
||
<!-- 标题(保持系列风格) -->
|
||
<div class="mb-16 md:mb-24 reveal">
|
||
<h2 class="text-3xl md:text-4xl font-extrabold text-gray-900 pl-4 border-l-4 border-gray-900 text-fill">
|
||
开源项目
|
||
</h2>
|
||
<p class="text-gray-600 mt-4 pl-6">我们的技术实践成果,全部开源可商用</p>
|
||
</div>
|
||
<!-- 项目卡片(网格布局+悬停动效) -->
|
||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
|
||
<div class="reveal">
|
||
<div class="bg-white border border-gray-200 rounded-lg overflow-hidden transition-all duration-300 hover:border-gray-300 hover:shadow-[0_0_25px_rgba(0,0,0,0.05)] hover:-translate-y-2">
|
||
<div class="aspect-video overflow-hidden">
|
||
<img src="./assets/project/emstc.png" alt="EMSTC" class="w-full h-full object-cover transition-transform duration-500 hover:scale-110">
|
||
</div>
|
||
<div class="p-6">
|
||
<div class="flex justify-between items-start mb-4">
|
||
<h3 class="text-xl font-bold text-gray-900">EMSTC</h3>
|
||
<span class="bg-green-500/20 text-green-700 text-xs px-2 py-1 rounded">PNG</span>
|
||
</div>
|
||
<p class="text-gray-600 mb-6 text-sm">杨村第八中学学生梗图,最全的数据库。</p>
|
||
<div class="flex justify-between items-center">
|
||
<div class="flex gap-2">
|
||
<span class="text-gray-500 text-xs"><i class="fa fa-star mr-1"></i> 0</span>
|
||
<span class="text-gray-500 text-xs"><i class="fa fa-code-fork mr-1"></i> 0</span>
|
||
</div>
|
||
<a href="https://github.com/GVSDS/EMSTC/" target="_blank" class="text-gray-900 hover:text-gray-600 transition-colors">
|
||
查看源码 <i class="fa fa-external-link ml-1"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="reveal">
|
||
<div class="bg-white border border-gray-200 rounded-lg overflow-hidden transition-all duration-300 hover:border-gray-300 hover:shadow-[0_0_25px_rgba(0,0,0,0.05)] hover:-translate-y-2">
|
||
<div class="aspect-video overflow-hidden">
|
||
<img src="./assets/project/asdg.png" alt="ASDG" class="w-full h-full object-cover transition-transform duration-500 hover:scale-110">
|
||
</div>
|
||
<div class="p-6">
|
||
<div class="flex justify-between items-start mb-4">
|
||
<h3 class="text-xl font-bold text-gray-900">ASDG</h3>
|
||
<span class="bg-green-500/20 text-green-700 text-xs px-2 py-1 rounded">Python</span>
|
||
<span class="bg-red-500/20 text-red-700 text-xs px-2 py-1 rounded">Beta</span>
|
||
<span class="bg-red-500/20 text-red-700 text-xs px-2 py-1 rounded">仅供测试</span>
|
||
</div>
|
||
<p class="text-gray-600 mb-6 text-sm">A Scientific DDoS Gun Tool,网络压力测试工具,写着玩的没写完功能。</p>
|
||
<div class="flex justify-between items-center">
|
||
<div class="flex gap-2">
|
||
<span class="text-gray-500 text-xs"><i class="fa fa-star mr-1"></i> 0</span>
|
||
<span class="text-gray-500 text-xs"><i class="fa fa-code-fork mr-1"></i> 0</span>
|
||
</div>
|
||
<a href="https://github.com/GVSDS/ASDG/" target="_blank" class="text-gray-900 hover:text-gray-600 transition-colors">
|
||
查看源码 <i class="fa fa-external-link ml-1"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="reveal">
|
||
<div class="bg-white border border-gray-200 rounded-lg overflow-hidden transition-all duration-300 hover:border-gray-300 hover:shadow-[0_0_25px_rgba(0,0,0,0.05)] hover:-translate-y-2">
|
||
<div class="aspect-video overflow-hidden">
|
||
<img src="./assets/project/nsql.png" alt="NSQL" class="w-full h-full object-cover transition-transform duration-500 hover:scale-110">
|
||
</div>
|
||
<div class="p-6">
|
||
<div class="flex justify-between items-start mb-4">
|
||
<h3 class="text-xl font-bold text-gray-900">NSQL</h3>
|
||
<span class="bg-green-500/20 text-green-700 text-xs px-2 py-1 rounded">Python</span>
|
||
</div>
|
||
<p class="text-gray-600 mb-6 text-sm">MySQL Wrapper Project - New SQL (NSQL),基于 PyMySQL 实现的 MySQL 数据库封装器,提供了简单的数据库操作接口。以及更可靠的安全机制。</p>
|
||
<div class="flex justify-between items-center">
|
||
<div class="flex gap-2">
|
||
<span class="text-gray-500 text-xs"><i class="fa fa-star mr-1"></i> 0</span>
|
||
<span class="text-gray-500 text-xs"><i class="fa fa-code-fork mr-1"></i> 0</span>
|
||
</div>
|
||
<a href="https://github.com/GVSDS/NSQL/" target="_blank" class="text-gray-900 hover:text-gray-600 transition-colors">
|
||
查看源码 <i class="fa fa-external-link ml-1"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- 查看更多按钮 -->
|
||
<div class="reveal lg:col-span-3 flex justify-center mt-8">
|
||
<a href="https://github.com/GVSDS/" target="_blank" class="px-8 py-3 bg-gray-900 text-white font-medium rounded-lg transition-all duration-300 hover:bg-gray-800 hover:shadow-[0_0_15px_rgba(0,0,0,0.15)]">
|
||
访问 GVSDS 在 GitHub 上的组织 <i class="fa fa-code ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 md:py-28 px-4 md:px-8 bg-white">
|
||
<div class="container mx-auto">
|
||
<!-- 标题(渐显+文字填充) -->
|
||
<div class="mb-16 md:mb-24 reveal">
|
||
<h2 class="text-3xl md:text-4xl font-extrabold text-gray-900 pl-4 border-l-4 border-gray-900 text-fill">
|
||
我们的性质
|
||
</h2>
|
||
</div>
|
||
|
||
<!-- 性质卡片网格(渐显+hover交互,移除翻转效果) -->
|
||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 md:gap-8">
|
||
<!-- 非盈利 -->
|
||
<div class="reveal">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-heart text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">非盈利</h3>
|
||
<p class="text-gray-600 text-center">不以盈利为目的,专注技术公益与学习,所有项目均免费开放,助力技术分享与成长</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 学习性 -->
|
||
<div class="reveal" style="transition-delay: 100ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-book text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">学习性</h3>
|
||
<p class="text-gray-600 text-center">持续探索前沿技术,定期组织技术分享,共同攻克难题,构建高效学习型团队</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 合作性 -->
|
||
<div class="reveal" style="transition-delay: 200ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-handshake text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">合作性</h3>
|
||
<p class="text-gray-600 text-center">秉持开放协作理念,欢迎各类技术团队/开发者合作,共推项目发展与技术进步</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 公开性 -->
|
||
<div class="reveal" style="transition-delay: 300ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-eye text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">公开性</h3>
|
||
<p class="text-gray-600 text-center">所有项目代码开源、文档公开,接受社区监督与反馈,确保透明化发展</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 兴趣性 -->
|
||
<div class="reveal" style="transition-delay: 400ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-star text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">兴趣性</h3>
|
||
<p class="text-gray-600 text-center">以共同技术兴趣为核心驱动,让开发过程充满热情,让技术探索更具乐趣</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 创新性 -->
|
||
<div class="reveal" style="transition-delay: 500ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-lightbulb text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">创新性</h3>
|
||
<p class="text-gray-600 text-center">鼓励突破传统技术框架,积极探索前沿技术应用场景,推动技术创新与实践</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 专业性 -->
|
||
<div class="reveal" style="transition-delay: 600ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-code text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">专业性</h3>
|
||
<p class="text-gray-600 text-center">深耕核心技术栈,注重技术深度研究,为项目与合作方提供专业可靠的技术解决方案</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 目标性 -->
|
||
<div class="reveal" style="transition-delay: 700ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-flag text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">目标性</h3>
|
||
<p class="text-gray-600 text-center">为每个项目设定清晰目标与执行路径,高效推进落地,确保成果质量与交付效率</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 实用性 -->
|
||
<div class="reveal" style="transition-delay: 800ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-50 border border-gray-200 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.05)]">
|
||
<div class="w-16 h-16 rounded-full bg-white flex items-center justify-center mb-6 border border-gray-300">
|
||
<i class="fa fa-wrench text-2xl text-gray-900"></i>
|
||
</div>
|
||
<h3 class="text-xl font-bold text-gray-900 mb-4">实用性</h3>
|
||
<p class="text-gray-600 text-center">聚焦用户实际需求,拒绝"为技术而技术",开发能真正解决问题、创造价值的产品</p>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 服务性(突出卡片) -->
|
||
<div class="reveal lg:col-span-3 md:col-span-2" style="transition-delay: 900ms;">
|
||
<div class="card-static relative w-full h-64 bg-gray-900 rounded-lg p-6 flex flex-col items-center justify-center transition-all duration-300 hover:translate-y-[-5px] hover:shadow-[0_8px_24px_rgba(0,0,0,0.15)]">
|
||
<div class="w-20 h-20 rounded-full bg-gray-800 flex items-center justify-center mb-6 border border-gray-700">
|
||
<i class="fa fa-life-ring text-3xl text-white"></i>
|
||
</div>
|
||
<h3 class="text-2xl font-bold text-white mb-4">服务性</h3>
|
||
<p class="text-gray-300 text-center max-w-2xl">以用户为中心,提供优质技术支持与反馈响应服务,倾听需求、持续优化,打造更优产品体验</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 md:py-28 px-4 md:px-8 bg-gradient-to-b from-white to-gray-50">
|
||
<div class="container mx-auto">
|
||
<!-- 标题(渐显+文字填充) -->
|
||
<div class="mb-16 md:mb-24 reveal">
|
||
<h2 class="text-3xl md:text-4xl font-extrabold text-gray-900 pl-4 border-l-4 border-gray-900 text-fill">
|
||
我们的能力
|
||
</h2>
|
||
</div>
|
||
|
||
<!-- 左右分栏图表 -->
|
||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12">
|
||
<!-- 左侧:能力评分(玫瑰图) -->
|
||
<div class="reveal">
|
||
<div class="bg-white p-6 rounded-lg border border-gray-200 h-full shadow-sm">
|
||
<h3 class="text-xl font-bold text-gray-900 mb-6">能力评分</h3>
|
||
<div class="chart-container flex justify-center items-center h-[calc(100%-2.5rem)]">
|
||
<canvas id="skillsChart"></canvas>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 右侧:角色人数分布(环形图) -->
|
||
<div class="reveal" style="transition-delay: 300ms;">
|
||
<div class="bg-white p-6 rounded-lg border border-gray-200 h-full shadow-sm">
|
||
<h3 class="text-xl font-bold text-gray-900 mb-6">角色人数分布</h3>
|
||
<div class="chart-container flex justify-center items-center h-[calc(100%-2.5rem)]">
|
||
<canvas id="rolesChart"></canvas>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section class="py-20 md:py-28 px-4 md:px-8 bg-gray-50">
|
||
<div class="container mx-auto">
|
||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-12 items-center">
|
||
<!-- 左侧:领域描述 -->
|
||
<div class="reveal">
|
||
<h2 class="text-3xl md:text-4xl font-extrabold text-gray-900 pl-4 border-l-4 border-gray-900 mb-8 text-fill">
|
||
涉及领域
|
||
</h2>
|
||
<div class="w-4/5 mx-auto md:mx-0 mb-8">
|
||
<div class="border-b border-gray-200 pb-2"></div>
|
||
</div>
|
||
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
<!-- 开发类 -->
|
||
<div>
|
||
<h3 class="text-lg font-semibold text-gray-900 mb-4">开发类</h3>
|
||
<ul class="space-y-3">
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">Python 开发</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">C/C++ 开发</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">Web 前端(HTML/CSS/JS)</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">后端架构</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">数据库(SQL)</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">逆向反病毒</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- 设计类 -->
|
||
<div>
|
||
<h3 class="text-lg font-semibold text-gray-900 mb-4">设计类</h3>
|
||
<ul class="space-y-3">
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">UI / UX 设计</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">插画绘制</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">动效设计</span>
|
||
</li>
|
||
</ul>
|
||
|
||
<h3 class="text-lg font-semibold text-gray-900 mt-6 mb-4">其他</h3>
|
||
<ul class="space-y-3">
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">人工智能</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">操作系统优化</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">服务器部署</span>
|
||
</li>
|
||
<li class="flex items-center">
|
||
<div class="w-2 h-2 bg-gray-900 rounded-full mr-3"></div>
|
||
<span class="text-gray-700">心理测评工具开发</span>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="reveal" style="transition-delay: 300ms;">
|
||
<div class="bg-gray-900 rounded-xl p-8 md:p-10 shadow-[0_0_30px_rgba(0,0,0,0.1)]">
|
||
<h2 class="text-3xl md:text-4xl font-extrabold text-white pl-4 border-l-4 border-white mb-6">
|
||
加入我们
|
||
</h2>
|
||
<p class="text-gray-300 text-lg mb-8">
|
||
无论你是谁,能力如何,只要你与我们有共同的理想,都能加入我们的团队,与我们共同努力。
|
||
</p>
|
||
|
||
<div class="mb-8">
|
||
<h3 class="text-lg font-semibold text-white mb-4">微信联系我们</h3>
|
||
<div class="flex items-center bg-gray-800 p-4 rounded-lg">
|
||
<i class="fa fa-envelope text-2xl text-white mr-4"></i>
|
||
<div>
|
||
<p class="text-white font-medium">GVSADS</p>
|
||
<p class="text-gray-400 text-sm mt-1">
|
||
微信搜索添加 <span class="inline-block w-2 h-2 bg-white animate-blink ml-1 align-middle"></span>
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<a href="weixin://dl/add/?username=GVSADS" class="mt-4 inline-block bg-white text-gray-900 font-semibold px-8 py-4 rounded-lg transition-all duration-300 hover:bg-gray-200 hover:shadow-[0_0_15px_rgba(255,255,255,0.3)] transform hover:-translate-y-1 active:scale-98">
|
||
申请加入(微信) <i class="fa fa-arrow-right ml-2"></i>
|
||
</a>
|
||
<a href="mailto:hr@gvsds.com?subject=我申请加入银河锋锐软件开发工作室&body=您好!%0D%0A%0D%0A我是 [ 姓名 / 网名 ],我期望加入银河锋锐软件开发工作室。%0D%0A我的联系方式是 [ 微信(必填) / QQ / TEL / X / 电报 / DISCORD ] %0D%0A我的兴趣爱好是 [ 选填 ],我的能力是 [ 选填 ]。%0D%0A我能够作为 [ 画师 / 程序员 / 测试人员 ] 加入工作室。%0D%0A [ 您的更多个人信息(选填)(个人简历等) ] %0D%0A希望您能提供一个机会,感谢!%0D%0A—— [ 姓名 / 网名 ] [ 年-月-日 ]" class="mt-4 inline-block bg-white text-gray-900 font-semibold px-8 py-4 rounded-lg transition-all duration-300 hover:bg-gray-200 hover:shadow-[0_0_15px_rgba(255,255,255,0.3)] transform hover:-translate-y-1 active:scale-98">
|
||
申请加入(邮箱) <i class="fa fa-arrow-right ml-2"></i>
|
||
</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<script src="./assets/js/icon.js"></script>
|
||
<script src="./assets/js/typewriter.js"></script>
|
||
<script src="./assets/js/chart.js"></script>
|
||
|
||
|
||
</main>
|
||
|
||
<footer class="bg-gray-50 pt-16 pb-8 px-4 md:px-8" id="footer">
|
||
<div class="container mx-auto">
|
||
<!-- 上层:导航与联系(3列布局) -->
|
||
<div class="grid grid-cols-1 md:grid-cols-3 gap-12 mb-12">
|
||
<!-- 快速导航 -->
|
||
<div class="reveal">
|
||
<h3 class="text-xl font-bold mb-6 text-gray-900">快速导航</h3>
|
||
<ul class="space-y-3">
|
||
<li><a href="/index.html" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">主页</a></li>
|
||
<li><a href="/Gallery.html" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">画廊</a></li>
|
||
<li><a href="https://doc.gvsds.com/9bc298e9c1d03ed3bd4777181bf7411d" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">文档</a></li>
|
||
<li><a href="/members.html?Type=Members" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">成员</a></li>
|
||
</ul>
|
||
</div>
|
||
|
||
<!-- 工作室信息 -->
|
||
<div class="reveal" style="transition-delay: 200ms;">
|
||
<h3 class="text-xl font-bold mb-6 text-gray-900">工作室信息</h3>
|
||
<ul class="space-y-3">
|
||
<li class="text-gray-900 font-semibold">银河锋锐软件开发工作室</li>
|
||
<li class="text-gray-700">定位:IT 技术团队</li>
|
||
<li class="text-gray-700">
|
||
<a href="https://beian.miit.gov.cn/" target="_blank" class="hover:text-gray-900 transition-colors duration-200">
|
||
津ICP备2025031204号
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
<div class="reveal" style="transition-delay: 400ms;">
|
||
<h3 class="text-xl font-bold mb-6 text-gray-900">联系我们</h3>
|
||
<ul class="space-y-3">
|
||
<li>
|
||
<a href="mailto:support@gvsds.com" class="text-gray-700 hover:text-gray-900 transition-colors duration-200 flex items-center">
|
||
<i class="fa fa-envelope mr-2"></i> 反馈邮箱:support@gvsds.com
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="mailto:wyt@gvsds.com" class="text-gray-700 hover:text-gray-900 transition-colors duration-200 flex items-center">
|
||
<i class="fa fa-envelope mr-2"></i> 站长邮箱:wyt@gvsds.com
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="weixin://dl/add/?username=GVSADS" class="text-gray-700 hover:text-gray-900 transition-colors duration-200 flex items-center">
|
||
<i class="fa-brands fa-weixin mr-2"></i> 微信:GVSADS
|
||
</a>
|
||
</li>
|
||
<li>
|
||
<a href="https://github.com/GVSDS" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200 flex items-center">
|
||
<i class="fa-brands fa-github mr-2"></i> Github: GVSDS
|
||
</a>
|
||
</li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 新增:扩展内容区域(占footer 90%宽度,点击展开/收回) -->
|
||
<div class="reveal mb-8" style="transition-delay: 500ms;">
|
||
<!-- 扩展按钮容器:宽度90%,居中 -->
|
||
<div class="w-[90%] mx-auto">
|
||
<button id="expandFooterBtn" class="w-full py-3 px-4 bg-gray-100 hover:bg-gray-200 rounded-lg transition-all duration-300 flex justify-center items-center gap-2 text-gray-900 font-medium">
|
||
<span id="expandBtnText">显示更多选项</span>
|
||
<i id="expandBtnIcon" class="fa fa-chevron-down transition-transform duration-300"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 扩展内容:默认隐藏,点击后动画弹出 -->
|
||
<div id="footerExpandContent" class="mt-4 py-5 px-6 bg-white rounded-lg w-full overflow-hidden transition-all duration-500 max-h-0 opacity-0">
|
||
<!-- 上层:导航与联系(3列布局) -->
|
||
<div class="grid grid-cols-1 md:grid-cols-3 gap-12 mb-12 min-w-full">
|
||
<!-- 快速导航 -->
|
||
<div class="reveal">
|
||
<h3 class="text-xl font-bold mb-6 text-gray-900">更多</h3>
|
||
<ul class="space-y-3">
|
||
<li><a href="/history.html" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">历史</a></li>
|
||
<li><a href="/links.html" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">友情链接</a></li>
|
||
<li><a href="/about.html" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">关于我们</a></li>
|
||
<li><a href="/ContactUS.html" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">联系我们</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="reveal">
|
||
<h3 class="text-xl font-bold mb-6 text-gray-900">工作室</h3>
|
||
<ul class="space-y-3">
|
||
<li><a href="/members.html?Type=Members" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">成员</a></li>
|
||
<li><a href="/members.html?Type=AKS" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">SS 成员</a></li>
|
||
<li><a href="/members.html?Type=Collaborators" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">合作成员</a></li>
|
||
<li><a href="mailto:hr@gvsds.com?subject=我申请加入银河锋锐软件开发工作室&body=您好!%0D%0A%0D%0A我是 [ 姓名 / 网名 ],我期望加入银河锋锐软件开发工作室。%0D%0A我的联系方式是 [ 微信(必填) / QQ / TEL / X / 电报 / DISCORD ] %0D%0A我的兴趣爱好是 [ 选填 ],我的能力是 [ 选填 ]。%0D%0A我能够作为 [ 画师 / 程序员 / 测试人员 ] 加入工作室。%0D%0A [ 您的更多个人信息(选填)(个人简历等) ] %0D%0A希望您能提供一个机会,感谢!%0D%0A—— [ 姓名 / 网民 ] [ 年-月-日 ]" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">加入我们</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="reveal">
|
||
<h3 class="text-xl font-bold mb-6 text-gray-900">文档</h3>
|
||
<ul class="space-y-3">
|
||
<li><a href="https://doc.gvsds.com/d2ae1dd63e9c35d687464a160896e1ab" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">用户协议</a></li>
|
||
<li><a href="https://doc.gvsds.com/ed15ec087f7339c5a8fecb1c4ccb6904" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">第三方免责协议</a></li>
|
||
<li><a href="https://doc.gvsds.com/29ee496f7e1b394ca7a7715419b2c690" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">通告</a></li>
|
||
</ul>
|
||
</div>
|
||
<div class="reveal">
|
||
<h3 class="text-xl font-bold mb-6 text-gray-900">页面</h3>
|
||
<ul class="space-y-3">
|
||
<li><a href="https://nanjingmassacre.gvsds.com" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">南京大屠杀</a></li>
|
||
<li><a href="https://www.gvsds.org" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">SVE</a></li>
|
||
<li><a href="https://omc.gvsds.com" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">在线 MC</a></li>
|
||
<li><a href="https://mc.gvsds.com" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">MC 服务器</a></li>
|
||
<li><a href="https://3crb.gvsds.com" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">MC 3CRB</a></li>
|
||
<li><a href="https://3c.gvsds.com" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">MC 3C</a></li>
|
||
<li><a href="http://mc.gvsds.com:8100" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">MC 服务器地图</a></li>
|
||
<li><a href="https://api.gvsds.com" target="_blank" class="text-gray-700 hover:text-gray-900 transition-colors duration-200">API</a></li>
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 下层:版权与法律 -->
|
||
<div class="border-t border-gray-200 pt-8 reveal mb-8" style="transition-delay: 600ms; opacity: 1; visibility: visible;">
|
||
<div class="flex flex-col md:flex-row justify-between items-center w-full max-w-7xl mx-auto px-4">
|
||
<p class="text-gray-700 text-sm mb-4 md:mb-0" style="color: rgba(0,0,0,0.8);">
|
||
© 2025 GVSDS. All Rights Reserved. - <a href="https://beian.miit.gov.cn/" target="_blank" class="hover:text-gray-900 transition-colors duration-200">津ICP备2025031204号</a>
|
||
</p>
|
||
<div class="flex space-x-6">
|
||
<a href="https://doc.gvsds.com/fc084ab20a283208adb19033ca4de173" target="_blank" class="text-gray-700 hover:text-gray-900 text-sm transition-colors duration-200" style="color: rgba(0,0,0,0.8);">隐私政策</a>
|
||
<a href="https://doc.gvsds.com/1f07d3b8cec43a2ab9892a15b150bdd6" target="_blank" class="text-gray-700 hover:text-gray-900 text-sm transition-colors duration-200" style="color: rgba(0,0,0,0.8);">服务条款</a>
|
||
<a href="https://doc.gvsds.com/d2ae1dd63e9c35d687464a160896e1ab" target="_blank" class="text-gray-700 hover:text-gray-900 text-sm transition-colors duration-200" style="color: rgba(0,0,0,0.8);">用户协议</a>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
<script src="./assets/js/nav.js"></script>
|
||
<script src="./assets/js/reveal.js"></script>
|
||
<script src="./assets/js/footer.js"></script>
|
||
</body>
|
||
</html>
|