diff --git a/projets.html b/projets.html index b15729f..62c3a49 100644 --- a/projets.html +++ b/projets.html @@ -49,7 +49,7 @@ -
+
Giant — miniature

GiAnt

diff --git a/projets.json b/projets.json deleted file mode 100644 index 8d10942..0000000 --- a/projets.json +++ /dev/null @@ -1,24 +0,0 @@ -[ - { - "id": "riichi", - "title": "Riichi", - "description": "Simulateur et outils pour mahjong Riichi — moteurs, visualisations et tests.", - "tech": ["TypeScript","JS","Web"], - "image": "projects/img/riichi-tile.svg", - "repo": "https://github.com/decosse-adrien/riichi", - "live": "riichi/index.html", - "featured": true, - "date": "2024-03-12" - }, - { - "id": "prototype-2", - "title": "Prototype 2", - "description": "Prototype en développement (ne pas encore mettre en avant).", - "tech": ["C","expérimental"], - "image": "projects/img/chess-pawn.svg", - "repo": "", - "live": "prototype2.html", - "featured": false, - "date": "2025-01-01" - } -] diff --git a/style.css b/style.css index 0c68142..2e9701a 100644 --- a/style.css +++ b/style.css @@ -212,15 +212,45 @@ a#easteregg:active{ /* Projects grid */ .projects-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px; margin-top:12px} +.projects-grid p{grid-column:1/-1} +.project-links{margin-top:10px; display:flex; gap:8px} + +/* Project card */ .project-card{background:var(--card); border-radius:10px; padding:12px; box-shadow:0 6px 18px rgba(15,23,42,0.05); border:1px solid rgba(15,23,42,0.04)} .project-card .project-thumb{width:100%; height:300px; object-fit:cover; border-radius:6px; display:block; margin-bottom:10px} .project-card h3{margin:8px 0 6px; font-size:18px} .project-card .excerpt{color:var(--muted); font-size:15px; margin:0} .project-card .tech{margin-top:8px} .project-card .tag{display:inline-block; background:rgba(15,23,42,0.04); padding:4px 8px; margin-right:6px; border-radius:6px; font-size:12px} -.project-links{margin-top:10px; display:flex; gap:8px} -.projects-grid p{grid-column:1/-1} +/* Prototype card */ +.prototype-card{background:var(--card); border-radius:10px; padding:12px; box-shadow:0 6px 18px rgba(15,23,42,0.05); border:1px solid rgba(15,23,42,0.04); position:relative; overflow:hidden} +.prototype-card .project-thumb{width:100%; height:300px; object-fit:cover; border-radius:6px; display:block; margin-bottom:10px} + +/* Ensure image stays below the badge but within card clipping */ +.prototype-card .project-thumb{position:relative; z-index:1} +.prototype-card h3{margin:8px 0 6px; font-size:18px} +.prototype-card .excerpt{color:var(--muted); font-size:15px; margin:0} +.prototype-card .tech{margin-top:8px} +.prototype-card .tag{display:inline-block; background:rgba(15,23,42,0.04); padding:4px 8px; margin-right:6px; border-radius:6px; font-size:12px} +.prototype-card::before{ + content:"PROTOTYPAGE"; + position:absolute; + top:110px; + left:-30px; + width:210px; + height:34px; + line-height: 30px; + text-align: center; + background:#6e98f3; + border-radius:6px; + box-shadow:0 6px 18px rgba(37,99,235,0.12); + pointer-events:none; + z-index:2; + opacity:0.98; + transform-origin: left top; + transform: rotate(-40deg); +} .lang-toggle{color:var(--muted); text-decoration:none; padding:4px 6px; border-radius:6px} .lang-toggle.active{background:rgba(37,99,235,0.08); color:var(--accent);} @@ -229,10 +259,11 @@ a#easteregg:active{ @media (max-width:900px){ .projects-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:14px} .project-card .project-thumb{height:220px} + .prototype-card .project-thumb{height:220px} } @media (max-width:600px){ .projects-grid{grid-template-columns:1fr} .project-card .project-thumb{height:180px} -} - + .prototype-card .project-thumb{height:180px} +} \ No newline at end of file