设定区:修订间差异

来自HUIJIA FUN
(修改页面)
(美化)
 
(未显示同一用户的12个中间版本)
第1行: 第1行:
<div class="mini-block-container mini-block-list">
{{全屏|
<div class="mini-block">
<html>
<span class="mini-block-title">欢迎您,迪普菲的居民。
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>迪普菲公共档案数据库</title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+SC:wght@300;400;700&family=Orbitron:wght@400;700&display=swap" rel="stylesheet">
    <style>
        /* 自定义字体 */
        body {
            font-family: 'Noto Sans SC', sans-serif;
            background-color: #0a0a1a;
            color: #e0e0e0;
            overflow-x: hidden;
        }


这里是迪普菲的重要公共档案数据库,记载着迪普菲上面发生的任何重要事件、档案等内容。本页面为迪普菲公共档案库的中心页,右测为各个分支类别中心页的快速导航,可以通过右侧组件快速进入相关区域。
        .font-orbitron {
            font-family: 'Orbitron', sans-serif;
        }


最初,该网站被[[S.T.R.探索对策总署]]——数据处理部设立,这处数据库皆在维系整个迪普菲这片庞大都市的稳定,S.T.R.总是致力于为每一位迪普菲的原住民提供人身安全保障服务。
        /* 粒子背景画布 */
        #particle-canvas {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: -1;
            opacity: 0.5;
        }


<hr style="margin: 1em 0"/>
        /* 玻璃拟态效果容器 */
        .glass-effect {
            background: rgba(10, 10, 30, 0.6);
            backdrop-filter: blur(12px) saturate(150%);
            -webkit-backdrop-filter: blur(12px) saturate(150%);
            border: 1px solid rgba(255, 255, 255, 0.1);
            transition: all 0.3s ease;
        }


你清楚,我们皆处于这处神秘而奇妙的庇护之地,在这个奇幻的学园社会中,或许你早已因学分争夺、学园战争、邪教迷雾而感到疲惫不堪了。
        .glass-effect:hover {
            background: rgba(20, 20, 40, 0.7);
            box-shadow: 0 0 25px rgba(0, 255, 255, 0.3);
            transform: translateY(-5px);
        }


当下的迪普菲,正变得十分不稳定——学生之间开始产生分歧,这引发了一系列的抗议活动和示威游行,许多团体和党派产生,势力之间不断发生纷争,恐怖袭击不断发生……
        /* 标题打字机效果 */
        .typewriter-text {
            display: inline-block;
            overflow: hidden;
            white-space: nowrap;
            border-right: .15em solid cyan;
            letter-spacing: .1em;
            animation: typing 3.5s steps(40, end), blink-caret .75s step-end infinite;
        }


迪普菲的未来充满了挑战和变数。你——作为学生们的一员,即使是一人的选择与行动,也将决定了这座城市的命运。
        /* 链接悬停辉光效果 */
        .glowing-link {
            color: #00ffff;
            text-decoration: none;
            transition: all 0.3s ease;
            font-weight: bold;
        }


我们是[[S.T.R.探索对策总署]]——数据处理部,我们真诚地邀请您为迪普菲档案数据处理做出贡献!
        .glowing-link:hover {
</div>
            text-shadow: 0 0 10px #00ffff, 0 0 20px #00ffff, 0 0 30px #00ffff;
{{设定区}}
        }
</div>


<hr style="margin: 1em 0"/>
        /* 自定义 hr 分割线 */
{{折叠
        hr {
|数=1
            border: 0;
|展开='''+ 在屏幕之外……'''
            height: 1px;
|收回='''- 在屏幕之外……'''
            background-image: linear-gradient(to right, rgba(0, 255, 255, 0), rgba(0, 255, 255, 0.75), rgba(0, 255, 255, 0));
|内容=
        }
<div class="mini-block">
<span class="mini-block-title">屏幕之外


本页面是HUIJIA FUN的两大区之一——设定区的中心页。本区隶属于“汇佳世界观设定”系列二创,定义为“以汇佳为基础背景,所进行世界观二创系列”,是一种网络接力创作形式。
        /* 初始加载动画 */
        .fade-in-up {
            opacity: 0;
            transform: translateY(30px);
            animation: fadeInUp 0.8s ease-out forwards;
        }
       
        @keyframes fadeInUp {
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
       
        /* 针对不同元素延迟加载 */
        .main-content { animation-delay: 0.2s; }
        .sidebar { animation-delay: 0.4s; }


目前,“汇佳世界观设定”有多种版本。设定区以[[IP版设定——绿色启示录]]为默认设定,其它设定集可以在位于设定区的分区中心页——[[设定]]中进行阅读和了解。
        /* 滚动条样式 */
        ::-webkit-scrollbar {
            width: 8px;
        }
        ::-webkit-scrollbar-track {
            background: #0a0a1a;
        }
        ::-webkit-scrollbar-thumb {
            background: #00ffff;
            border-radius: 4px;
        }
        ::-webkit-scrollbar-thumb:hover {
            background: #00c0c0;
        }
    </style>
</head>
<body class="bg-gray-900 text-gray-200">
    <canvas id="particle-canvas"></canvas>


“汇佳世界观设定”系列具有丰富的叙事等方面上的潜能,等待着创作者的发掘,因此请尽情抒怀您的创造力!
    <div class="container mx-auto p-4 sm:p-6 lg:p-8 min-h-screen flex items-center justify-center">
        <div class="w-full max-w-7xl grid grid-cols-1 lg:grid-cols-3 gap-8">
           
            <!-- 主要内容区域 -->
            <div class="lg:col-span-2 space-y-8">
                <div class="mini-block glass-effect p-6 sm:p-8 rounded-2xl fade-in-up main-content">
                    <h1 class="font-orbitron text-2xl sm:text-3xl text-cyan-300 mb-4" data-text="欢迎您,迪普菲的居民。"></h1>
                    <p class="text-gray-300 leading-relaxed">
                        这里是迪普菲的重要公共档案数据库,记载着迪普菲上面发生的任何重要事件、档案等内容。本页面为迪普菲公共档案库的中心页,右测为各个分支类别中心页的快速导航,可以通过右侧组件快速进入相关区域。
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        最初,该网站被 <b class="text-cyan-400"><a href="S.T.R.探索对策总署" title="S.T.R.探索对策总署">S.T.R.探索对策总署</a></b>——数据部设立,这处数据库皆在维系整个迪普菲这片庞大都市的稳定,S.T.R.总是致力于为每一位迪普菲的原住民提供人身安全保障服务。
                    </p>
                    <hr class="my-6"/>
                    <h2 class="font-orbitron text-xl sm:text-2xl text-cyan-300 mb-4" data-text="前言"></h2>
                    <p class="text-gray-300 leading-relaxed">
                        你清楚,我们皆处于这处神秘而奇妙的庇护之地,在这个奇幻的学园社会中,或许你早已因学分争夺、学园战争、邪教迷雾而感到疲惫不堪了。
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        当下的迪普菲,正变得十分不稳定——学生之间开始产生分歧,这引发了一系列的抗议活动和示威游行,许多团体和党派产生,势力之间不断发生纷争,恐怖袭击不断发生……
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        迪普菲的未来充满了挑战和变数。你——作为学生们的一员,即使是一人的选择与行动,也将决定了这座城市的命运。
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        我们是 <b class="text-cyan-400"><a href="S.T.R.探索对策总署" title="S.T.R.探索对策总署">S.T.R.探索对策总署</a></b>——数据处理部,我们真诚地邀请您为迪普菲档案数据处理做出贡献!
                    </p>
                    <hr class="my-6"/>
                    <h2 class="font-orbitron text-xl sm:text-2xl text-cyan-300 mb-4" data-text="屏幕之外"></h2>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        <a href="墨绿色的启示录" class="glowing-link text-lg">点我查看《墨绿色的启示录》设定详情中心页!</a>
                    </p>
                    <p class="text-gray-300 leading-relaxed">
                        本页面是HUIJIA FUN的两大区之一——设定区的中心页。本区隶属于“汇佳世界观设定”系列二创,定义为“以汇佳为基础背景,所进行的世界观二创系列”,是一种网络接力创作形式。
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        目前,“汇佳世界观设定”有多种版本。设定区以 <b class="text-cyan-400"><a href="墨绿色的启示录" title="墨绿色的启示录">IP版设定——墨绿色的启示录</a></b> 为默认设定,其它设定集可以在位于设定区的分区中心页—— <b class="text-cyan-400"><a href="设定" title="设定">设定</a></b> 中进行阅读和了解。
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                      “汇佳世界观设定”系列具有丰富的叙事等方面上的潜能,等待着创作者的发掘,因此请尽情抒怀您的创造力!
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        作为作者,您拥有无限的创作自由,您可以从任意角度出发,构建一个引人深思的平行世界。如果您具有深度的思想及文学功底,您甚至可以从“全球性问题”等论理方面角度上出发,创作富含人文思想或哲学内涵的故事情节,引发读者的一系列思考,真正体现出这一系列的潜能性。
                    </p>
                    <p class="mt-4 text-gray-300 leading-relaxed">
                        你当然可以从任何事物为出发点,发挥任何你的创作自由,构建出这样一个奇幻的平行世界。祝你好运,作者!
                    </p>
                </div>
            </div>


作为作者,您拥有无限的创作自由,您可以从任意角度出发,构建一个引人深思的平行世界。如果您具有深度的思想及文学功底,您甚至可以从“全球性问题”等论理方面角度上出发,创作富含人思想或哲学内涵的故事情节,引发读者的一系列思考,真正现出这一系列潜能性。
            <!-- 侧边栏导航 -->
</div>
            <div class="sidebar lg:col-span-1 glass-effect p-6 sm:p-8 rounded-2xl self-start sticky top-8 fade-in-up">
                <h2 class="font-orbitron text-2xl text-cyan-300 mb-6 border-b-2 border-cyan-500/30 pb-3">设定区导航</h2>
                <nav class="space-y-4">
                    <a href="故事章" class="glowing-link block text-lg hover:pl-2 transition-all">故事文章</a>
                    <a href="人物档案" class="glowing-link block text-lg hover:pl-2 transition-all">人物档案</a>
                    <a href="团体势力" class="glowing-link block text-lg hover:pl-2 transition-all">团势力</a>
                    <a href="地点" class="glowing-link block text-lg hover:pl-2 transition-all">地点</a>
                    <a href="物品" class="glowing-link block text-lg hover:pl-2 transition-all">物品</a>
                    <a href="墨绿色启示录" class="glowing-link block text-lg hover:pl-2 transition-all">世界观总览</a>
                    <a href="设定" class="glowing-link block text-lg hover:pl-2 transition-all">其它设定</a>
                </nav>
            </div>
        </div>
    </div>


<div class="mini-block">
    <script>
<span class="mini-block-title">设定详情
        document.addEventListener('DOMContentLoaded', () => {
            // 粒子背景效果
            const canvas = document.getElementById('particle-canvas');
            const ctx = canvas.getContext('2d');
            let particles = [];


绿色启示录版设定描述了一个高度科技的奇幻城市。 在这里,一切事情的发生的城市称为“[[迪普菲都市|迪普菲(Dipfield/Dipfietos)]]”。如今,这是一个完全由学生所管辖的城市。
            function resizeCanvas() {
                canvas.width = window.innerWidth;
                canvas.height = window.innerHeight;
            }
            window.addEventListener('resize', resizeCanvas);
            resizeCanvas();


在迪普菲这片庞大的都市上面,存在着数十个庞大的行政区以及数千所学校。 在迪普菲都市当中,学生们掌管着整个城邦都市的管辖、一切敌对势力的对峙、维系着整个迪普菲都市的稳定。
            class Particle {
                constructor() {
                    this.x = Math.random() * canvas.width;
                    this.y = Math.random() * canvas.height;
                    this.vx = Math.random() * 0.4 - 0.2;
                    this.vy = Math.random() * 0.4 - 0.2;
                    this.radius = 1.5;
                }


现今的迪普菲,正变的十分不稳定。学生们与城市及学校之产生了分歧,导致了一系列的抗议活和示威游行,分裂出了许多团体和党派,势力之间不断产生蹊跷,学园战争爆发,恐怖袭击横行。这现象大约从S.C.2014的西西里黑手党事件为导火索开始……
                update() {
</div>
                    this.x += this.vx;
                    this.y += this.vy;
 
                    if (this.x < 0 || this.x > canvas.width) this.vx *= -1;
                    if (this.y < 0 || this.y > canvas.height) this.vy *= -1;
                }
 
                draw() {
                    ctx.beginPath();
                    ctx.arc(this.x, this.y, this.radius, 0, Math.PI * 2);
                    ctx.fillStyle = 'rgba(0, 255, 255, 0.7)';
                    ctx.fill();
                }
            }
 
            function initParticles() {
                const particleCount = Math.floor(canvas.width * canvas.height / 15000);
                for (let i = 0; i < particleCount; i++) {
                    particles.push(new Particle());
                }
            }
 
            function connectParticles() {
                for (let i = 0; i < particles.length; i++) {
                    for (let j = i + 1; j < particles.length; j++) {
                        const dx = particles[i].x - particles[j].x;
                        const dy = particles[i].y - particles[j].y;
                        const distance = Math.sqrt(dx * dx + dy * dy);
 
                        if (distance < 120) {
                            ctx.beginPath();
                            ctx.moveTo(particles[i].x, particles[i].y);
                            ctx.lineTo(particles[j].x, particles[j].y);
                            ctx.strokeStyle = `rgba(0, 255, 255, ${1 - distance / 120})`;
                            ctx.lineWidth = 0.5;
                            ctx.stroke();
                        }
                    }
                }
            }
           
            function animate() {
                ctx.clearRect(0, 0, canvas.width, canvas.height);
                particles.forEach(p => {
                    p.update();
                    p.draw();
                });
                connectParticles();
                requestAnimationFrame(animate);
            }
 
            initParticles();
            animate();
 
            // 打字机效果
            function typeWriter(element, text, speed = 70) {
                let i = 0;
                element.innerHTML = ''; // 清空内容以开始打字
                const typingInterval = setInterval(() => {
                    if (i < text.length) {
                        element.innerHTML += text.charAt(i);
                        i++;
                    } else {
                        clearInterval(typingInterval);
                    }
                }, speed);
            }
 
            const headers = document.querySelectorAll('h1[data-text], h2[data-text]');
            headers.forEach((header, index) => {
                const text = header.getAttribute('data-text');
                // 使用 Intersection Observer 来触发动画
                const observer = new IntersectionObserver((entries) => {
                    entries.forEach(entry => {
                        if (entry.isIntersecting) {
                            setTimeout(() => {
                                typeWriter(entry.target, text);
                            }, index * 200); // 错开动画开始时
                            observer.unobserve(entry.target); // 画只播放
                        }
                    });
                }, { threshold: 0.5 });
 
                observer.observe(header);
            });
        });
    </script>
</body>
</html>
}}
}}
[[分类:中心页]]

2025年10月6日 (一) 20:29的最新版本

返回主页

迪普菲公共档案数据库

这里是迪普菲的重要公共档案数据库,记载着迪普菲上面发生的任何重要事件、档案等内容。本页面为迪普菲公共档案库的中心页,右测为各个分支类别中心页的快速导航,可以通过右侧组件快速进入相关区域。

最初,该网站被 S.T.R.探索对策总署——数据部设立,这处数据库皆在维系整个迪普菲这片庞大都市的稳定,S.T.R.总是致力于为每一位迪普菲的原住民提供人身安全保障服务。


你清楚,我们皆处于这处神秘而奇妙的庇护之地,在这个奇幻的学园社会中,或许你早已因学分争夺、学园战争、邪教迷雾而感到疲惫不堪了。

当下的迪普菲,正变得十分不稳定——学生之间开始产生分歧,这引发了一系列的抗议活动和示威游行,许多团体和党派产生,势力之间不断发生纷争,恐怖袭击不断发生……

迪普菲的未来充满了挑战和变数。你——作为学生们的一员,即使是一人的选择与行动,也将决定了这座城市的命运。

我们是 S.T.R.探索对策总署——数据处理部,我们真诚地邀请您为迪普菲档案数据处理做出贡献!


点我查看《墨绿色的启示录》设定详情中心页!

本页面是HUIJIA FUN的两大区之一——设定区的中心页。本区隶属于“汇佳世界观设定”系列二创,定义为“以汇佳为基础背景,所进行的世界观二创系列”,是一种网络接力创作形式。

目前,“汇佳世界观设定”有多种版本。设定区以 IP版设定——墨绿色的启示录 为默认设定,其它设定集可以在位于设定区的分区中心页—— 设定 中进行阅读和了解。

“汇佳世界观设定”系列具有丰富的叙事等方面上的潜能,等待着创作者的发掘,因此请尽情抒怀您的创造力!

作为作者,您拥有无限的创作自由,您可以从任意角度出发,构建一个引人深思的平行世界。如果您具有深度的思想及文学功底,您甚至可以从“全球性问题”等论理方面角度上出发,创作富含人文思想或哲学内涵的故事情节,引发读者的一系列思考,真正体现出这一系列的潜能性。

你当然可以从任何事物为出发点,发挥任何你的创作自由,构建出这样一个奇幻的平行世界。祝你好运,作者!