beuz/Beuz-Video-Game
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

UI: remove hero console images from homepage

Browse Source
This commit is contained in:
Ponte
2026-02-14 23:05:39 +01:00
parent e04a5a0a25
commit 37ff894801
2 changed files with 1 additions and 75 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
index.html
View File

@@ -66,32 +66,6 @@
<p class="eyebrow">Catalogue perso</p> <p class="eyebrow">Catalogue perso</p>
<h1>Collection Jeux Video</h1> <h1>Collection Jeux Video</h1>
</div> </div>
<div class="hero-gallery" aria-label="Consoles iconiques">
<figure class="console-visual">
<img src="assets/consoles/ps1.svg" alt="PlayStation 1" />
<figcaption>PS1</figcaption>
</figure>
<figure class="console-visual">
<img src="assets/consoles/snes.svg" alt="Super Nintendo" />
<figcaption>SNES</figcaption>
</figure>
<figure class="console-visual">
<img src="assets/consoles/n64.svg" alt="Nintendo 64" />
<figcaption>N64</figcaption>
</figure>
<figure class="console-visual">
<img src="assets/consoles/megadrive.svg" alt="Mega Drive" />
<figcaption>Mega Drive</figcaption>
</figure>
<figure class="console-visual">
<img src="assets/consoles/dreamcast.svg" alt="Dreamcast" />
<figcaption>Dreamcast</figcaption>
</figure>
<figure class="console-visual">
<img src="assets/consoles/gameboy.svg" alt="Game Boy" />
<figcaption>Game Boy</figcaption>
</figure>
</div>
</header> </header>
<section class="panel platform-panel"> <section class="panel platform-panel">

50
styles.css
View File

@@ -177,48 +177,13 @@ body {
background: background:
linear-gradient(125deg, #f8fff7, #f4f8ff), linear-gradient(125deg, #f8fff7, #f4f8ff),
var(--surface); var(--surface);
display: grid; display: block;
grid-template-columns: 1.35fr 1fr;
gap: 1rem;
align-items: center;
} }
.hero-copy { .hero-copy {
min-width: 0; min-width: 0;
} }
.hero-gallery {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.55rem;
}
.console-visual {
margin: 0;
border: 1px solid #d5dfeb;
background: linear-gradient(180deg, #ffffff, #f4f8ff);
border-radius: 12px;
padding: 0.45rem;
display: grid;
gap: 0.3rem;
place-items: center;
box-shadow: 0 6px 14px rgba(17, 36, 57, 0.08);
}
.console-visual img {
width: 100%;
max-width: 90px;
height: 54px;
object-fit: contain;
}
.console-visual figcaption {
font-size: 0.76rem;
color: #2a4663;
font-weight: 700;
text-align: center;
}
.eyebrow { .eyebrow {
margin: 0; margin: 0;
color: var(--accent-2); color: var(--accent-2);
@@ -530,15 +495,6 @@ button {
} }
@media (max-width: 900px) { @media (max-width: 900px) {
.hero {
grid-template-columns: 1fr;
gap: 0.8rem;
}
.hero-gallery {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.grid-form, .grid-form,
.game-form { .game-form {
grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -546,10 +502,6 @@ button {
} }
@media (max-width: 640px) { @media (max-width: 640px) {
.hero-gallery {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.grid-form, .grid-form,
.game-form { .game-form {
grid-template-columns: 1fr; grid-template-columns: 1fr;