Main Page: Difference between revisions
From GGNet Wiki
More actions
No edit summary |
No edit summary |
||
| (76 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
< | <html lang=""> | ||
<head> | |||
<meta charset="UTF-8" /> | |||
<meta name="viewport" content="width=device-width, initial-scale=1" /> | |||
<title>ggNet Wiki - Home</title> | |||
<style> | |||
:root { | |||
--color-bg: #f9f9f9; | |||
--color-text: #222; | |||
--color-link: #0066cc; | |||
--color-link-hover: #004999; | |||
--color-box-bg: #fff; | |||
--color-box-border: #ddd; | |||
--box-shadow-default: 0 2px 5px rgba(0, 0, 0, 0.1); | |||
--box-shadow-hover: 0 5px 15px rgba(0, 0, 0, 0.2); | |||
--border-radius: 8px; | |||
--gap: 2rem; | |||
--max-width-item: 160px; | |||
} | |||
body { | |||
font-family: Arial, sans-serif; | |||
background: var(--color-bg); | |||
color: var(--color-text); | |||
margin: 0; | |||
padding: 2rem; | |||
} | |||
h1 { | |||
text-align: center; | |||
margin-bottom: 2rem; | |||
font-weight: 700; | |||
} | |||
.gallery { | |||
display: flex; | |||
flex-wrap: wrap; | |||
justify-content: center; | |||
gap: var(--gap); | |||
} | |||
.gallery-item { | |||
display: block; | |||
</ | background: var(--color-box-bg); | ||
border: 1px solid var(--color-box-border); | |||
border-radius: var(--border-radius); | |||
width: var(--max-width-item); | |||
padding: 1rem; | |||
box-shadow: var(--box-shadow-default); | |||
text-align: center; | |||
<div class=" | text-decoration: none; | ||
color: inherit; | |||
transition: box-shadow 0.3s ease, transform 0.3s ease; | |||
} | |||
.gallery-item:hover { | |||
box-shadow: var(--box-shadow-hover); | |||
transform: translateY(-4px); | |||
} | |||
.gallery-item img { | |||
max-width: 100%; | |||
height: auto; | |||
object-fit: contain; | |||
border-radius: 4px; | |||
margin-bottom: 0.75rem; | |||
} | |||
.gallery-title { | |||
font-weight: 700; | |||
font-size: 1rem; | |||
color: var(--color-link); | |||
} | |||
.gallery-item:hover .gallery-title { | |||
color: var(--color-link-hover); | |||
text-decoration: underline; | |||
} | |||
@media (max-width: 400px) { | |||
.gallery { | |||
flex-direction: column; | |||
align-items: center; | |||
} | |||
.gallery-item { | |||
width: 100%; | |||
max-width: 300px; | |||
} | |||
} | |||
</style> | |||
</head> | |||
<body> | |||
<h1>ggNet Wiki | Game Wikis</h1> | |||
<div class="gallery"> | |||
<a href="https://ggnet.wiki/slay-the-spire-2/Main_Page" class="gallery-item"> | |||
<img src="/images/wiki_ggnet/7/76/Slay2.jpg" alt="Slay the Spire 2" /> | |||
<div class="gallery-title">Slay the Spire 2 Wiki</div> | |||
</a> | |||
<a href="https://ggnet.wiki/grounded-2/Main_Page" class="gallery-item"> | |||
<img src="/images/wiki_ggnet/e/eb/Grounded_2.png" alt="Grounded 2" /> | |||
<div class="gallery-title">Grounded 2 Wiki</div> | |||
</a> | |||
</div> | |||
</body> | |||
</html> | |||
