源社区大事记
<!DOCTYPE html><html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>论坛发展时间轴</title>
<style>
:root {
--timeline-color: #4a90e2;
--accent-color: #2c6cb0;
--text-color: #333;
--bg-color: #f8f9fa;
--dot-size: 14px;
--line-width: 2px;
--title-font-size: 1.25rem;
--body-font-size: 1.05rem;
--text-regular: 500;
--text-bold: 600;
--line-height: 1.7;
}
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
color: var(--text-color);
background-color: var(--bg-color);
padding: 2rem 1rem;
}
.timeline-banner {
max-width: 800px;
margin: 0 auto 3rem;
text-align: center;
background: linear-gradient(135deg, var(--timeline-color), var(--accent-color));
color: white;
padding: 1.5rem 2rem;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0,0,0,0.15);
position: relative;
overflow: hidden;
}
.timeline-banner::before {
content: "";
position: absolute;
top: -50px;
left: -30px;
width: 100px;
height: 100px;
background: rgba(255,255,255,0.1);
border-radius: 50%;
}
.timeline-banner::after {
content: "";
position: absolute;
bottom: -60px;
right: -40px;
width: 120px;
height: 120px;
background: rgba(255,255,255,0.08);
border-radius: 50%;
}
.timeline-banner h1 {
font-size: 2.2rem;
font-weight: 700;
margin: 0;
letter-spacing: 2px;
text-shadow: 0 2px 4px rgba(0,0,0,0.2);
position: relative;
z-index: 1;
}
.timeline {
position: relative;
max-width: 800px;
margin: 0 auto;
padding-left: calc(var(--dot-size) + 20px);
}
.timeline::before {
content: '';
position: absolute;
left: calc(var(--dot-size)/2 - var(--line-width)/2);
top: 0;
bottom: 0;
width: var(--line-width);
background: var(--timeline-color);
}
.event {
position: relative;
margin-bottom: 2.5rem;
background: white;
border-radius: 8px;
padding: 1.5rem;
box-shadow: 0 2px 12px rgba(0,0,0,0.08);
transition: transform 0.2s ease;
}
.event:hover {
transform: translateX(8px);
box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.event::before {
content: '';
position: absolute;
left: calc(-1 * (var(--dot-size) + 10px));
top: 24px;
width: var(--dot-size);
height: var(--dot-size);
background: white;
border: 3px solid var(--timeline-color);
border-radius: 50%;
z-index: 1;
}
.event-time {
display: block;
font-size: var(--title-font-size);
color: var(--timeline-color);
font-weight: var(--text-bold);
margin-bottom: 1.2rem;
letter-spacing: 0.3px;
}
.event p {
margin: 0.8rem 0;
color: #444;
font-size: var(--body-font-size);
font-weight: var(--text-regular);
line-height: var(--line-height);
}
@media (max-width: 768px) {
.timeline-banner {
margin-bottom: 2rem;
padding: 1.2rem;
}
.timeline-banner h1 {
font-size: 1.8rem;
}
.timeline {
padding-left: 24px;
}
.event::before {
left: -28px;
}
:root {
--title-font-size: 1.2rem;
--body-font-size: 1rem;
--line-height: 1.65;
}
.event {
padding: 1.2rem;
}
}
@media (max-width: 480px) {
.timeline-banner h1 {
font-size: 1.5rem;
letter-spacing: 1px;
}
:root {
--title-font-size: 1.15rem;
--body-font-size: 0.95rem;
--line-height: 1.6;
}
.event::before {
width: 12px;
height: 12px;
left: -24px;
}
}
</style>
</head>
<body>
<div class="timeline-banner">
<h1>论 坛 大 事 记</h1>
</div>
<div class="timeline">
<!-- 完整事件列表（按原始顺序排列，脚本会自动排序） -->
<div class="event" data-date="2024-10-07">
<span class="event-time">2024 年 10 月 7 日</span>
<p>经过连续两天的选择与调整，源论坛正式定版上线。</p>
</div>
<div class="event" data-date="2024-10-23">
<span class="event-time">2024 年 10 月 23 日</span>
<p>由于预估错误，论坛在线人数过多，导致服务器宕机，然后进行了服务器优化！</p>
</div>
<div class="event" data-date="2024-10-26">
<span class="event-time">2024 年 10 月 26 日</span>
<p>同样因为在线人数过多，导致服务器宕机，故更换服务器！</p>
</div>
<div class="event" data-date="2024-11-06">
<span class="event-time">2024 年 11 月 6 日</span>
<p>论坛于开站满一个月的前一天，注册用户破万。</p>
</div>
<div class="event" data-date="2024-11-10">
<span class="event-time">2024 年 11 月 10 日</span>
<p>论坛由于使用 CDN、对象存储等配套设施导致运营费用爆增，故开启打赏功能！</p>
</div>
<div class="event" data-date="2024-11-24">
<span class="event-time">2024 年 11 月 24 日</span>
<p>购买获取域名 srcbbs.com （意译：源论坛）以在合适的时机启用。</p>
<p>同时增加三个备用/容错域名：srcbs.com srcbs.cn srcbs.online</p>
</div>
<div class="event" data-date="2024-11-25">
<span class="event-time">2024 年 11 月 25 日</span>
<p>由于论坛发展过快，积分策略出现问题，重整积分规则！</p>
</div>
<div class="event" data-date="2024-12-16">
<span class="event-time">2024 年 12 月 16 日</span>
<p>启用新域名 srcbbs.com</p>
</div>
<div class="event" data-date="2024-12-27">
<span class="event-time">2024 年 12 月 27 日</span>
<p>由于多方便因素所致，论坛暂时关闭！</p>
</div>
<div class="event" data-date="2025-01-07">
<span class="event-time">2025 年 1 月 7 日</span>
<p>1.论坛重新开站并使用新域名：ysqbbs.com</p>
<p>2.为论坛长期健康发展并为抑制新用户增长，特开启邀请码注册制！</p>
</div>
<div class="event" data-date="2025-01-27">
<span class="event-time">2025 年 1 月 27 日</span>
<p>1.开放免费注册，为期十日</p>
<p>2.晚八点开始被DDoS攻击</p>
</div>
<div class="event" data-date="2025-01-30">
<span class="event-time">2025 年 1 月 30 日</span>
<p>持续被DDoS攻击三天，故更换服务器</p>
</div>
</div>
<script>
// 自动排序功能
function sortTimeline() {
const timeline = document.querySelector('.timeline');
const events = Array.from(timeline.children);
events.sort((a, b) => {
const dateA = new Date(a.dataset.date);
const dateB = new Date(b.dataset.date);
return dateB - dateA; // 倒序排列
});
timeline.append(...events);
}
// 页面加载后自动执行
document.addEventListener('DOMContentLoaded', sortTimeline);
</script>
</body>
</html> 希望论坛越来越好。 越来越好 越来越好 越来越好，做大做强 更上一层楼 祝论坛越来越好 希望论坛能稳定运行下去 越来越好 祝论坛越来越好