WL:Таймлайн
Материал из Space Station 14 Вики
<!DOCTYPE html> <html> <head> <style> /* Timeline container */ .timeline {
background: linear-gradient(45deg, #1a1a1a, #2d2d2d); padding: 30px; color: #fff; border-radius: 15px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3); font-family: 'Segoe UI', Roboto, sans-serif;
}
/* Timeline header */ .timeline-header {
font-size: 2em; font-weight: 700; margin-bottom: 40px; padding-bottom: 20px; border-bottom: 2px solid #4a4a4a; color: #00bcd4; letter-spacing: 2px; text-transform: uppercase;
}
/* Era marker */ .era-marker {
background: linear-gradient(90deg, #00bcd4, transparent); padding: 15px 25px; margin: 30px -30px; font-size: 1.4em; font-weight: 600; color: #fff; text-transform: uppercase; letter-spacing: 1px; position: relative;
}
/* Timeline entry */ .timeline-entry {
margin: 30px 0; padding-left: 50px; position: relative; border-left: 2px solid #00bcd4; transition: all 0.3s ease;
}
.timeline-entry:hover {
transform: translateX(10px);
}
/* Entry dot */ .timeline-entry::before {
content: ""; position: absolute; left: -11px; top: 0; width: 20px; height: 20px; background: #00bcd4; border-radius: 50%; box-shadow: 0 0 20px rgba(0, 188, 212, 0.5);
}
/* Entry date */ .timeline-date {
font-size: 1.2em; font-weight: 600; color: #00bcd4; margin-bottom: 10px;
}
/* Entry title */ .timeline-title {
font-size: 1.4em; font-weight: 500; color: #fff; margin-bottom: 10px;
}
/* Entry description */ .timeline-description {
color: #b0b0b0; line-height: 1.6; font-size: 1em; padding-bottom: 20px; border-bottom: 1px solid #4a4a4a;
}
/* Hover effects */ .timeline-entry:hover::before {
transform: scale(1.2); box-shadow: 0 0 30px rgba(0, 188, 212, 0.8);
}
.timeline-entry:hover .timeline-title {
color: #00bcd4;
}
/* Animation for entries */ @keyframes fadeIn {
from { opacity: 0; transform: translateX(-20px); }
to { opacity: 1; transform: translateX(0); }
}
.timeline-entry {
animation: fadeIn 0.5s ease forwards;
} </style> </head> <body>
Game Universe Timeline
Ancient Era
Year 0
The Great Awakening
The first conscious beings emerge from the primordial chaos, bringing forth a new age of existence in a universe previously shrouded in darkness.
Year 372
Formation of the First Kingdom
From the ashes of countless tribal conflicts, the first unified kingdom rises, marking the beginning of organized civilization and the dawn of recorded history.
Classical Era
Year 1000
The Age of Magic
Ancient secrets of arcane power are unlocked, forever changing the fabric of society as mortals learn to harness the very essence of creation.
Year 1247
The Great War
A cataclysmic conflict erupts between the most powerful magical factions, reshaping continents and establishing new orders of power in its wake.
</body> </html>
