studio-variable/world-game
3
0
Fork 0
Code Issues 20 Pull requests Projects Releases Packages Wiki Activity Actions

fix(styles): typographie strong, grille layout, ajustements collection mobile

Browse source 
- fonts.css : strong { font-weight: 900 }
- layout.css : ajustement grid-template-rows (lignes 6-7 réduites à 2fr)
- collection.css : padding header mobile, tailles de police, gap carte,
  image aspect-ratio avec marges, line-height description

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-03-20 11:52:12 +01:00
parent b655a22bf6
commit 65e345585a
3 changed files with 22 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

23
src/styles/collection.css
View file

@ -47,7 +47,7 @@
flex: 1;
display: flex;
flex-direction: column;
gap: 1rem;
gap: 1.5rem;
max-width: 640px;
}
@ -130,19 +130,24 @@
/* --- Mobile --- */
@media (max-width: 700px) {
.collection-header {
padding: 4rem 0 2rem;
padding: 6rem 0 2rem;
}
.collection-header :global(h1) {
font-size: var(--font-size-title-main-mobile);
.collection-header h1 {
font-size: var(--font-size-title-section-mobile);
margin-bottom: 0.5rem;
}
.collection-header :global(p) {
font-size: var(--font-size-subtitle-mobile);
.collection-header p {
font-family: "Danzza Medium", sans-serif;
font-weight: 400;
line-height: 1.6;
font-size: var(--font-size-subtitle);
}
.collection-card {
flex-direction: column;
gap: 0;
}
.collection-card-image img,
@ -150,6 +155,8 @@
width: 100%;
height: auto;
aspect-ratio: 16/9;
margin-top: 1rem;
margin-bottom: 2rem;
}
.collection-card--featured .collection-card-title {
@ -159,6 +166,10 @@
.collection-card-title {
font-size: var(--font-size-title-section-mobile);
}
.collection-card-description {
line-height: 1.4;
}
}
/* --- Tablet --- */

4
src/styles/fonts.css
View file

@ -69,3 +69,7 @@
.pixel {
font-family: "Terminal", sans-serif;
}
strong {
font-weight: 900;
}

2
src/styles/layout.css
View file

@ -4,7 +4,7 @@
min-height: 100% !important;
display: grid !important;
position: relative;
grid-template-rows: 1fr 1fr 2fr 4fr 2.66fr 5.33fr 5.33fr 4.33fr 2.83fr 3.5fr 3.5fr 2.83fr 4.33fr 5.33fr 5.33fr 2.66fr 4fr 2fr 1fr 1fr;
grid-template-rows: 1fr 1fr 2fr 4fr 2.66fr 2fr 2fr 4.33fr 2.83fr 3.5fr 3.5fr 2.83fr 4.33fr 5.33fr 5.33fr 2.66fr 4fr 2fr 1fr 1fr;
grid-template-columns: 1fr 1fr 2fr 4fr 2.66fr 5.33fr 5.33fr 4.33fr 2.83fr 3.5fr 3.5fr 2.83fr 4.33fr 5.33fr 5.33fr 2.66fr 4fr 2fr 1fr 1fr;
text-align: center;
}