backlog
This commit is contained in:
BIN
public/images/liestral.jpg
Normal file
BIN
public/images/liestral.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 228 KiB |
@@ -33,36 +33,6 @@ const groupedHumans = sortedEntries.reduce((acc, entry) => {
|
|||||||
</header>
|
</header>
|
||||||
|
|
||||||
<main class="collection-container">
|
<main class="collection-container">
|
||||||
{/* SECTION ÉVÉNEMENTS (Même structure que les humains) */}
|
|
||||||
{
|
|
||||||
sortedEvents.length > 0 && (
|
|
||||||
<section class="user-collection">
|
|
||||||
<h2 class="user-title">
|
|
||||||
Événements <span>({sortedEvents.length} cartes)</span>
|
|
||||||
</h2>
|
|
||||||
<div class="user-flex-row">
|
|
||||||
{sortedEvents.map((event) => (
|
|
||||||
<a
|
|
||||||
href={`/${event.id.replace(/\.md$/, "")}`}
|
|
||||||
class="card-link"
|
|
||||||
>
|
|
||||||
<div class="card-scaler">
|
|
||||||
<EventCard frontmatter={event.data} />
|
|
||||||
<div class="entry-meta">
|
|
||||||
<p>
|
|
||||||
Détecté le :{" "}
|
|
||||||
{event.data.target_date}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</a>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
<hr class="separator" />
|
|
||||||
</section>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
|
|
||||||
{/* SECTION HUMAINS */}
|
{/* SECTION HUMAINS */}
|
||||||
{
|
{
|
||||||
Object.entries(groupedHumans).map(([userName, cards]) => (
|
Object.entries(groupedHumans).map(([userName, cards]) => (
|
||||||
@@ -94,6 +64,36 @@ const groupedHumans = sortedEntries.reduce((acc, entry) => {
|
|||||||
</section>
|
</section>
|
||||||
))
|
))
|
||||||
}
|
}
|
||||||
|
|
||||||
|
{/* SECTION ÉVÉNEMENTS (Même structure que les humains) */}
|
||||||
|
{
|
||||||
|
sortedEvents.length > 0 && (
|
||||||
|
<section class="user-collection">
|
||||||
|
<h2 class="user-title">
|
||||||
|
Événements <span>({sortedEvents.length} cartes)</span>
|
||||||
|
</h2>
|
||||||
|
<div class="user-flex-row">
|
||||||
|
{sortedEvents.map((event) => (
|
||||||
|
<a
|
||||||
|
href={`/${event.id.replace(/\.md$/, "")}`}
|
||||||
|
class="card-link"
|
||||||
|
>
|
||||||
|
<div class="card-scaler">
|
||||||
|
<EventCard frontmatter={event.data} />
|
||||||
|
<div class="entry-meta">
|
||||||
|
<p>
|
||||||
|
Détecté le :{" "}
|
||||||
|
{event.data.target_date}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
<hr class="separator" />
|
||||||
|
</section>
|
||||||
|
)
|
||||||
|
}
|
||||||
</main>
|
</main>
|
||||||
</Layout>
|
</Layout>
|
||||||
|
|
||||||
@@ -159,8 +159,8 @@ const groupedHumans = sortedEntries.reduce((acc, entry) => {
|
|||||||
|
|
||||||
/* 1. On définit la taille "réelle" que prendra la carte dans le flux */
|
/* 1. On définit la taille "réelle" que prendra la carte dans le flux */
|
||||||
/* Si ta Card fait 300px de large, on met 150px ici */
|
/* Si ta Card fait 300px de large, on met 150px ici */
|
||||||
width: 150px;
|
width: 230px;
|
||||||
height: 220px;
|
height: 375px;
|
||||||
|
|
||||||
/* 2. On autorise le contenu à déborder visuellement de la boîte logicielle */
|
/* 2. On autorise le contenu à déborder visuellement de la boîte logicielle */
|
||||||
overflow: visible;
|
overflow: visible;
|
||||||
@@ -172,7 +172,7 @@ const groupedHumans = sortedEntries.reduce((acc, entry) => {
|
|||||||
|
|
||||||
.card-scaler {
|
.card-scaler {
|
||||||
/* 3. On réduit l'échelle */
|
/* 3. On réduit l'échelle */
|
||||||
transform: scale(0.5);
|
transform: scale(0.8);
|
||||||
|
|
||||||
/* 4. On fixe l'origine en haut à gauche pour que la carte
|
/* 4. On fixe l'origine en haut à gauche pour que la carte
|
||||||
se cale parfaitement dans le coin du .card-link */
|
se cale parfaitement dans le coin du .card-link */
|
||||||
|
|||||||
@@ -110,7 +110,74 @@ const activeSynergies = latestPerUser.map((user) => {
|
|||||||
|
|
||||||
<main>
|
<main>
|
||||||
<h1 class="main-title">Ambient</h1>
|
<h1 class="main-title">Ambient</h1>
|
||||||
|
<section class="design-intent">
|
||||||
|
<header class="rules-header">
|
||||||
|
<h2>🛠️ Chantier Ergonomique (en cours)</h2>
|
||||||
|
<p class="intent-quote">
|
||||||
|
<em
|
||||||
|
>"Repenser la visualisation des cartes pour un parcours
|
||||||
|
utilisateur en totale concordance avec les besoins du
|
||||||
|
type d'utilisateur."</em
|
||||||
|
>
|
||||||
|
</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="work-todo-grid">
|
||||||
|
<div class="todo-column">
|
||||||
|
<h3>🎴 Ergonomie des Cartes</h3>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
Optimiser le ratio d'aspect pour une lecture
|
||||||
|
mobile-first sur Samsung/Android.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Intégrer les indicateurs de "Synergie" directement
|
||||||
|
sur le visuel de la carte.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Refondre le système de rareté (Shiny/Légendaire)
|
||||||
|
avec des effets CSS avancés.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="todo-column">
|
||||||
|
<h3>🛤️ Parcours Utilisateur</h3>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
Simplifier la transition entre la vue "Dashboard" et
|
||||||
|
la "Collection" complète.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Créer des points d'entrée contextuels selon le
|
||||||
|
cercle dominant (PRO, SAN, etc.).
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Améliorer la narration visuelle entre le manuel de
|
||||||
|
jeu et les logs d'événements.
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="todo-column">
|
||||||
|
<h3>⚙️ Technique & Backlog</h3>
|
||||||
|
<ul>
|
||||||
|
<li>
|
||||||
|
Automatiser la mise à jour des versions (Changelog)
|
||||||
|
via les fichiers Markdown.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Améliorer la performance du rendu Astro sur le
|
||||||
|
serveur Raspberry Pi 4.
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
Finaliser les composants EventCard pour les
|
||||||
|
correctifs (Fixes).
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
<section class="hero-flex">
|
<section class="hero-flex">
|
||||||
{
|
{
|
||||||
latestPerUser.map((entry) => {
|
latestPerUser.map((entry) => {
|
||||||
@@ -292,6 +359,74 @@ const activeSynergies = latestPerUser.map((user) => {
|
|||||||
</main>
|
</main>
|
||||||
</Layout>
|
</Layout>
|
||||||
<style>
|
<style>
|
||||||
|
.design-intent {
|
||||||
|
max-width: 1400px; /* Occupation maximale de l'espace */
|
||||||
|
margin: 60px auto 100px auto;
|
||||||
|
padding: 40px;
|
||||||
|
background: #f8fafc;
|
||||||
|
border-radius: 24px;
|
||||||
|
border: 1px dashed #cbd5e1; /* Aspect "travail en cours" */
|
||||||
|
}
|
||||||
|
|
||||||
|
.intent-quote {
|
||||||
|
max-width: 800px;
|
||||||
|
margin: 20px auto;
|
||||||
|
font-size: 1.1rem;
|
||||||
|
color: #475569;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.work-todo-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(3, 1fr);
|
||||||
|
gap: 30px;
|
||||||
|
margin-top: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.todo-column {
|
||||||
|
background: white;
|
||||||
|
padding: 25px;
|
||||||
|
border-radius: 16px;
|
||||||
|
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.02);
|
||||||
|
}
|
||||||
|
|
||||||
|
.todo-column h3 {
|
||||||
|
font-family: "Philosopher", serif;
|
||||||
|
font-size: 1.2rem;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
color: #1e293b;
|
||||||
|
border-bottom: 2px solid #e2e8f0;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.todo-column ul {
|
||||||
|
list-style: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.todo-column li {
|
||||||
|
margin-bottom: 15px;
|
||||||
|
font-size: 0.95rem;
|
||||||
|
line-height: 1.5;
|
||||||
|
color: #64748b;
|
||||||
|
position: relative;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.todo-column li::before {
|
||||||
|
content: "→";
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
color: #3b82f6;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (max-width: 1024px) {
|
||||||
|
.work-todo-grid {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.main-title {
|
.main-title {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-family: "Philosopher", serif;
|
font-family: "Philosopher", serif;
|
||||||
|
|||||||
Reference in New Issue
Block a user