Professional website improvements

- Boidelo: Replaced "alcool" with "jeu de société" throughout
- GeoRealmCraft: Reframed as public server infrastructure project with focus on system administration and community management
- Removed incomplete "Recherche" section from CVs
- Added CurseForge link to Custom Ore Gen mod
- Added CLAUDE.md documentation

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
felden.r@grenoble.archi.fr
2026-01-12 09:51:45 +01:00
parent 1af353253a
commit 83c3059ca3
5 changed files with 108 additions and 83 deletions
+79
View File
@@ -0,0 +1,79 @@
# CLAUDE.md
This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
## Project Overview
This is a personal portfolio website for Roman Felden, a French IT security and systems coordinator based in Grenoble. The site is a static website built with plain HTML and inline CSS - no build tools, frameworks, or external dependencies (other than Google Fonts and inline SVG icons).
## Site Structure
The website consists of 4 pages:
- **index.html** - Landing page with hero section, about info, key skills, and project previews
- **cv.html** - Full resume/CV page with professional experience, education, skills, languages, and interests
- **cv-roman-felden.html** - Alternate standalone CV version with a different visual style (gradient background, no navbar)
- **projets.html** - Detailed project pages (Homelab Proxmox, Boidelo Android app, Custom Ore Gen Minecraft mod, GeoRealmCraft modpack)
All pages are self-contained with embedded CSS in `<style>` tags.
## Design System
The site uses a consistent design system with CSS custom properties defined in `:root`:
- **Primary color**: `#4f46e5` (indigo)
- **Secondary color**: `#0ea5e9` (sky blue)
- **Accent color**: `#f59e0b` (amber)
- **Typography**: Plus Jakarta Sans (Google Fonts), falling back to system fonts
- **Border radius**: Variable (6px/12px/20px/28px depending on element)
- **Shadows**: 4 levels (sm/md/lg/xl)
Key visual patterns:
- Gradient backgrounds for hero sections
- Card-based layouts with hover lift effects
- Inline SVG icons (Heroicons style)
- Consistent navbar with brand logo "RF"
- Responsive design with mobile breakpoints at 768px
## Common Editing Tasks
When modifying this site:
1. **Update content** - All content is directly in HTML. Text is in French throughout.
2. **Add new projects** - Copy an existing `.project-section` block in projets.html and add a corresponding preview card in index.html
3. **Update CV** - Edit experience items in cv.html. Each job has an `.experience-item` with header, company, location, date badge, and description list.
4. **Modify colors** - Change CSS custom properties in `:root` of any page
5. **Add pages** - Follow the existing structure: navbar, main container, footer
## Navigation Structure
The navbar is consistent across main pages (index, cv, projets) with:
- Brand link to index.html
- Three menu items: Accueil, CV, Projets
- Active state highlighting for current page
## Language & Content
- **Primary language**: French (fr)
- **Target audience**: Recruiters and professional contacts in France
- **Tone**: Professional, showcasing technical skills and projects
## File Organization
```
lanro.eu/
├── index.html # Homepage
├── cv.html # Main CV with navbar
├── cv-roman-felden.html # Standalone CV (no navbar, different style)
├── projets.html # Projects detail page
└── CLAUDE.md # This file
```
## Important Notes
- All CSS is inline in `<style>` tags - no external stylesheets
- No JavaScript required (site is fully static)
- Icons are inline SVGs from Heroicons
- Font loaded from Google Fonts (Plus Jakarta Sans)
- Site is designed to work without a server - can be opened directly in browser
- cv-roman-felden.html is a standalone version meant to be shared/downloaded separately
@@ -1107,18 +1107,6 @@
</div> </div>
</div> </div>
<div class="skill-category">
<div class="skill-category-header">
<div class="skill-icon">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z"/>
</svg>
</div>
<h4 class="skill-category-title">Recherche</h4>
</div>
<div class="skill-tags">
<span class="skill-tag">Jailbreak Captcha LLM</span>
</div>
</div> </div>
</div> </div>
</section> </section>
-12
View File
@@ -1071,18 +1071,6 @@
</div> </div>
</div> </div>
<div class="skill-category">
<div class="skill-category-header">
<div class="skill-icon">
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z"/>
</svg>
</div>
<h4 class="skill-category-title">Recherche</h4>
</div>
<div class="skill-tags">
<span class="skill-tag">Jailbreak Captcha LLM</span>
</div>
</div> </div>
</div> </div>
</section> </section>
+2 -2
View File
@@ -516,7 +516,7 @@
</svg> </svg>
</div> </div>
<h3>Boidelo</h3> <h3>Boidelo</h3>
<p>Application Android de jeu d'alcool multijoueur avec 150 questions, interface Material Design 3 et paramètres personnalisables.</p> <p>Application Android de jeu de société multijoueur avec 150 questions, interface Material Design 3 et paramètres personnalisables.</p>
<a href="projets.html#boidelo" class="card-link"> <a href="projets.html#boidelo" class="card-link">
En savoir plus En savoir plus
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
@@ -546,7 +546,7 @@
</svg> </svg>
</div> </div>
<h3>GeoRealmCraft</h3> <h3>GeoRealmCraft</h3>
<p>Modpack Minecraft avec 345 mods, génération de monde réaliste, colonies, machineries Create et véhicules.</p> <p>Serveur Minecraft public avec infrastructure scalable, gestion de communauté et maintenance de modpack technique.</p>
<a href="projets.html#georealmcraft" class="card-link"> <a href="projets.html#georealmcraft" class="card-link">
En savoir plus En savoir plus
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+27 -57
View File
@@ -454,7 +454,7 @@
</div> </div>
<div class="project-title"> <div class="project-title">
<h2>Boidelo</h2> <h2>Boidelo</h2>
<p class="project-subtitle">Application Android de jeu d'alcool</p> <p class="project-subtitle">Application Android de jeu de société</p>
</div> </div>
</div> </div>
<div class="project-badges"> <div class="project-badges">
@@ -464,7 +464,7 @@
<span class="badge">Jeu</span> <span class="badge">Jeu</span>
</div> </div>
<div class="project-description"> <div class="project-description">
<p>Boidelo est une application Android de jeu d'alcool similaire à "King's Cup" ou "Never Have I Ever". L'application permet à un groupe de joueurs de répondre à des questions aléatoires avec des consommations de boissons associées. Elle inclut 150 questions préchargées, une interface Material Design 3, et des paramètres personnalisables.</p> <p>Boidelo est une application Android de jeu de société multijoueur similaire à "King's Cup" ou "Never Have I Ever". L'application permet à un groupe de joueurs de répondre à des questions aléatoires et de relever des défis. Elle inclut 150 questions préchargées, une interface Material Design 3, et des paramètres personnalisables.</p>
</div> </div>
<div class="project-features"> <div class="project-features">
<div class="feature-item"> <div class="feature-item">
@@ -616,6 +616,12 @@
<span class="tech-item">MCreator</span> <span class="tech-item">MCreator</span>
<span class="tech-item">Java 17</span> <span class="tech-item">Java 17</span>
<span class="tech-item">KubeJS</span> <span class="tech-item">KubeJS</span>
<a href="https://www.curseforge.com/minecraft/mc-mods/custom-ore-gen" target="_blank" rel="noopener" class="tech-item" style="text-decoration: none; display: inline-flex; align-items: center; gap: 0.5rem; background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%); color: white; border-color: transparent;">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14"/>
</svg>
CurseForge
</a>
</div> </div>
</section> </section>
@@ -629,17 +635,17 @@
</div> </div>
<div class="project-title"> <div class="project-title">
<h2>GeoRealmCraft</h2> <h2>GeoRealmCraft</h2>
<p class="project-subtitle">Modpack Minecraft moddé</p> <p class="project-subtitle">Serveur Minecraft public & Infrastructure</p>
</div> </div>
</div> </div>
<div class="project-badges"> <div class="project-badges">
<span class="badge badge-primary">Minecraft</span> <span class="badge badge-primary">Infrastructure</span>
<span class="badge">Modpack</span> <span class="badge">Serveur Public</span>
<span class="badge">345 Mods</span> <span class="badge">Administration</span>
<span class="badge">Serveur</span> <span class="badge">Minecraft</span>
</div> </div>
<div class="project-description"> <div class="project-description">
<p>GeoRealmCraft est un modpack Minecraft révolutionnaire avec 345 mods qui transforme l'expérience de jeu. Le modpack offre une génération de monde épique avec une répartition réaliste des ressources, des graphismes retravaillés, et des fonctionnalités avancées comme les colonies, les machineries Create, et les véhicules.</p> <p>GeoRealmCraft est un serveur Minecraft public avec infrastructure complète. Projet technique d'administration système et de gestion de communauté, incluant maintenance de serveur, modpack technique, gestion des utilisateurs et monitoring. Expérience concrète en gestion d'infrastructure et de communauté en ligne.</p>
</div> </div>
<div class="project-features"> <div class="project-features">
<div class="feature-item"> <div class="feature-item">
@@ -647,8 +653,8 @@
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg> </svg>
<div class="feature-content"> <div class="feature-content">
<h4>Génération de monde épique</h4> <h4>Administration serveur</h4>
<p>Immensité des biomes, verticalité des massifs, répartition réaliste des ressources</p> <p>Gestion complète de serveur, configuration, maintenance et mise à jour</p>
</div> </div>
</div> </div>
<div class="feature-item"> <div class="feature-item">
@@ -656,8 +662,8 @@
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg> </svg>
<div class="feature-content"> <div class="feature-content">
<h4>345 mods</h4> <h4>Gestion de communauté</h4>
<p>Graphisme, audio, animation retravaillés avec des mods d'ambiance</p> <p>Moderation, support utilisateur, gestion des conflits et animation</p>
</div> </div>
</div> </div>
<div class="feature-item"> <div class="feature-item">
@@ -665,8 +671,8 @@
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg> </svg>
<div class="feature-content"> <div class="feature-content">
<h4>Système de colonies</h4> <h4>Infrastructure scalable</h4>
<p>Colonies évolutives avec Minecolonies pour gérer des NPC</p> <p>Configuration technique optimisée, performance et gestion de la charge</p>
</div> </div>
</div> </div>
<div class="feature-item"> <div class="feature-item">
@@ -674,53 +680,17 @@
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg> </svg>
<div class="feature-content"> <div class="feature-content">
<h4>Machineries Create 6.0</h4> <h4>Maintenance & monitoring</h4>
<p>Système d'automation avancé avec Create pour créer des usines complexes</p> <p>Sauvegardes automatisées, surveillance des performances et résolution d'incidents</p>
</div>
</div>
<div class="feature-item">
<svg class="feature-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg>
<div class="feature-content">
<h4>Véhicules</h4>
<p>Trains, avions, voitures, bateaux pour explorer le monde</p>
</div>
</div>
<div class="feature-item">
<svg class="feature-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg>
<div class="feature-content">
<h4>Nourriture stratégique</h4>
<p>Système de nutrition nécessitant une alimentation variée et équilibrée</p>
</div>
</div>
<div class="feature-item">
<svg class="feature-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg>
<div class="feature-content">
<h4>Combat tactique</h4>
<p>Refonte complète du système de combat avec styles d'attaques</p>
</div>
</div>
<div class="feature-item">
<svg class="feature-icon" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/>
</svg>
<div class="feature-content">
<h4>Économie dynamique</h4>
<p>Marché basé sur les joueurs avec monnaie non duplicable</p>
</div> </div>
</div> </div>
</div> </div>
<div class="tech-stack"> <div class="tech-stack">
<span class="tech-item">Minecraft</span> <span class="tech-item">Administration Système</span>
<span class="tech-item">Forge</span> <span class="tech-item">Gestion de Communauté</span>
<span class="tech-item">Create</span> <span class="tech-item">Monitoring</span>
<span class="tech-item">Minecolonies</span> <span class="tech-item">Maintenance</span>
<span class="tech-item">Biomes O' Plenty</span> <span class="tech-item">Backup</span>
</div> </div>
</section> </section>
</div> </div>