Home: Difference between revisions
From Treeverse
More actions
No edit summary |
No edit summary |
||
| Line 1: | Line 1: | ||
<html lang="en"> | |||
<head> | |||
<meta charset="UTF-8" /> | |||
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |||
<title>Alpha: Season 2</title> | |||
<style> | |||
body { | |||
font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif; | |||
margin: 0; | |||
padding: 16px; | |||
background: #fff; | |||
color: #111827; | |||
} | |||
.season2-block { | |||
border-radius: 12px; | |||
background: #ffffff; | |||
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); | |||
overflow: hidden; | |||
margin: 12px 0; | |||
width: fit-content; | |||
border: 1px solid #e5e7eb; | |||
} | |||
.season2-inner { | |||
display: grid; | |||
grid-template-columns: 130px auto; | |||
gap: 12px; /* reduced gap */ | |||
padding: 8px 12px; /* reduced padding → ~25% less height */ | |||
align-items: center; | |||
} | |||
.season2-media { | |||
display: flex; | |||
justify-content: flex-start; | |||
align-items: flex-start; | |||
} | |||
.season2-media img { | |||
width: 112px; | |||
height: auto; | |||
border-radius: 8px; | |||
object-fit: cover; | |||
display: block; | |||
} | |||
.season2-content { | |||
display: grid; | |||
row-gap: 4px; /* tighter spacing */ | |||
} | |||
.season2-headline { | |||
font-size: 18px; | |||
font-weight: 700; | |||
color: #111827; | |||
margin: 0; | |||
white-space: nowrap; | |||
} | |||
.season2-subtitle { | |||
font-size: 16px; | |||
font-weight: 500; | |||
color: #4b5563; | |||
margin: 0; | |||
white-space: nowrap; | |||
} | |||
.season2-button { | |||
display: inline-block; | |||
background: linear-gradient( | |||
90deg, | |||
rgb(99, 102, 241) 0%, | |||
rgb(168, 85, 247) 50%, | |||
rgb(52, 211, 153) 100% | |||
); | |||
color: #fff; | |||
font-weight: 600; | |||
text-decoration: none; | |||
padding: 6px 12px; | |||
font-size: 13px; | |||
border-radius: 8px; | |||
transition: transform 0.15s ease; | |||
white-space: nowrap; | |||
width: fit-content; | |||
} | |||
.season2-button:hover { | |||
transform: scale(1.03); | |||
} | |||
</style> | |||
</head> | |||
<body> | |||
<section class="season2-block" aria-labelledby="season2-heading"> | |||
<div class="season2-inner"> | |||
<!-- Left image --> | |||
<div class="season2-media"> | |||
<img src="https://treeverse.wiki/images/4/48/Tv_trophy.png" alt="Season 2 teaser" /> | |||
</div> | |||
<!-- Right content --> | |||
<div class="season2-content"> | |||
<p class="season2-headline">🔥 Alpha: Season 2</p> | |||
<p id="season2-heading" class="season2-subtitle">Sneak peek at what's to come</p> | |||
<a href="Season 2" class="season2-button">Learn More ➜</a> | |||
</div> | |||
</div> | |||
</section> | |||
</body> | |||
</html> | |||
<span style="font-size:150%;">'''Welcome to the Treeverse Wiki'''</span> | <span style="font-size:150%;">'''Welcome to the Treeverse Wiki'''</span> | ||