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

fix(portfolio): layout texte/keywords et typographie description

Browse source 
- Remplace flex par un affichage statique sur .portfolio-text
- h2 : ajout font-family Danzza Bold
- description : font Danzza, font-size subtitle, line-height 1.4
- keywords : grid 2 colonnes avec row-gap, margin verticale
- catchphrase : margin-bottom 1rem
- Mobile : grid-area texte décalé d'une ligne, ajustements description

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

32
src/views/Portfolio.svelte
View file

@ -214,19 +214,18 @@
.portfolio-text { .portfolio-text {
grid-area: 7/11 / span 6 / span 5; grid-area: 7/11 / span 6 / span 5;
z-index: var(--z-content); z-index: var(--z-content);
text-align: left; text-align: left;
display: flex;
flex-direction: column;
justify-content: center;
gap: 0.75rem;
color: var(--color-text); color: var(--color-text);
} }
.portfolio-text h2 { .portfolio-text h2 {
font-family: "Danzza Bold", sans-serif;
font-size: var(--font-size-title-main); font-size: var(--font-size-title-main);
font-weight: 700; font-weight: 700;
text-transform: uppercase; text-transform: uppercase;
line-height: 1.1; line-height: 1.1;
} }
.portfolio-catchphrase { .portfolio-catchphrase {
@ -234,18 +233,26 @@
font-size: var(--font-size-subtitle); font-size: var(--font-size-subtitle);
font-weight: 600; font-weight: 600;
color: var(--color-primary); color: var(--color-primary);
margin-bottom: 1rem;
} }
.portfolio-description :global(p) { .portfolio-description :global(p) {
font-size: var(--font-size-paragraph-mobile); font-family: "Danzza", sans-serif;
font-size: var(--font-size-subtitle);
line-height: 1.4; line-height: 1.4;
opacity: 0.8;
letter-spacing: -2%; letter-spacing: -2%;
} }
.portfolio-keywords { .portfolio-keywords {
font-size: var(--font-size-caption); font-family: "Danzza", sans-serif;
opacity: 0.6; font-size: 0.8125rem;
display: grid;
grid-template-columns: 1fr 1fr;
row-gap: 1rem;
margin: 3rem 0;
} }
.portfolio-keywords p { .portfolio-keywords p {
@ -399,7 +406,7 @@
/* Text — over mockup, centered */ /* Text — over mockup, centered */
.portfolio-text { .portfolio-text {
grid-area: 8/4/span 8/span 14; grid-area: 9/4/span 8/span 14;
z-index: var(--z-content); z-index: var(--z-content);
gap: .5rem; gap: .5rem;
text-align: center; text-align: center;
@ -414,11 +421,10 @@
font-size: var(--font-size-subtitle-mobile); font-size: var(--font-size-subtitle-mobile);
} }
.portfolio-description { .portfolio-description :global(p) {
font-family: "Danzza Light", sans-serif; font-family: "Danzza Light", sans-serif;
font-size: var(--font-size-paragraph-mobile); font-size: var(--font-size-paragraph-mobile);
font-weight: 600; line-height: 1.4;
line-height: 1.34;
} }
/* Hide keywords on mobile */ /* Hide keywords on mobile */
@ -427,7 +433,7 @@
} }
.portfolio-links { .portfolio-links {
margin-top: .5rem; margin-top: 1rem;
justify-content: center; justify-content: center;
} }