Skip to content

Commit 648baec

Browse files
johnsamuelwritesjohnsamuelwrites
committed
Update trajectory
1 parent eb30b4a commit 648baec

6 files changed

Lines changed: 175 additions & 7 deletions

File tree

‎bundle.js‎

Lines changed: 7 additions & 2 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎src/i18n/locales/en.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -317,7 +317,7 @@
317317
"trajectory.chooseEnd": "Select an arrival artist with + Trajectory",
318318
"trajectory.loading": "Calculating...",
319319
"trajectory.noPath": "No influence path was found between these two artists in the current graph. Load more artists to enrich the network.",
320-
"trajectory.influenced": "influenced ↓",
320+
"trajectory.influenced": "influenced by ↓",
321321
"trajectory.degreeSingular": "{count} degree of separation",
322322
"trajectory.degreePlural": "{count} degrees of separation",
323323
"detail.movement.start": "Start: {value}",

‎src/i18n/locales/es.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -317,7 +317,7 @@
317317
"trajectory.chooseEnd": "Selecciona un artista de llegada con + Trayectoria",
318318
"trajectory.loading": "Calculando...",
319319
"trajectory.noPath": "No se encontro ningun camino de influencia entre estos dos artistas en el grafo actual. Carga mas artistas para enriquecer la red.",
320-
"trajectory.influenced": "influyo en ↓",
320+
"trajectory.influenced": "influido por ↓",
321321
"trajectory.degreeSingular": "{count} grado de separacion",
322322
"trajectory.degreePlural": "{count} grados de separacion",
323323
"detail.movement.start": "Inicio: {value}",

‎src/i18n/locales/fr.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -317,7 +317,7 @@
317317
"trajectory.chooseEnd": "Sélectionnez un artiste d'arrivée via + Trajectoire",
318318
"trajectory.loading": "Calcul en cours...",
319319
"trajectory.noPath": "Aucun chemin d'influence trouvé entre ces deux artistes dans le graphe actuel. Chargez d'autres artistes pour enrichir le réseau.",
320-
"trajectory.influenced": "a influencé ↓",
320+
"trajectory.influenced": "influencé par ↓",
321321
"trajectory.degreeSingular": "{count} degré de séparation",
322322
"trajectory.degreePlural": "{count} degrés de séparation",
323323
"detail.movement.start": "Début: {value}",

‎src/ui/composants/trajectoire.multi‎

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ déf _rendre_borne(artiste_id: chaine, labels: dictionnaire, css_class: chaine,
6363

6464
déf _rendre_chemin(chemin: liste, labels: dictionnaire) -> chaine:
6565
"""Rendre les étapes du chemin d'influence."""
66-
html = '<ol class="trajectoire-chemin">'
66+
html = '<ol class="trajectoire-chemin" aria-label="' + _t("trajectory.title") + '">'
6767

6868
pour i dans intervalle(len(chemin)):
6969
noeud_id = chemin[i]
@@ -78,10 +78,16 @@ déf _rendre_chemin(chemin: liste, labels: dictionnaire) -> chaine:
7878
css = css + " trajectoire-etape-arrivee"
7979

8080
html = html + '<li class="' + css + '">'
81+
html = html + '<span class="trajectoire-noeud">'
8182
html = html + '<span class="trajectoire-nom">' + nom + '</span>'
83+
html = html + '</span>'
84+
html = html + '</li>'
85+
8286
si non est_dernier:
87+
html = html + '<li class="trajectoire-transition" aria-hidden="true">'
88+
html = html + '<span class="trajectoire-ligne"></span>'
8389
html = html + '<span class="trajectoire-rel">' + _t("trajectory.influenced") + '</span>'
84-
html = html + '</li>'
90+
html = html + '</li>'
8591

8692
html = html + '</ol>'
8793
nb_degres = len(chemin) - 1

‎styles.css‎

Lines changed: 157 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3362,6 +3362,163 @@
33623362
padding: 12px 0;
33633363
}
33643364

3365+
.trajectoire-panel-overlay {
3366+
position: fixed;
3367+
left: 0;
3368+
right: 0;
3369+
bottom: 0;
3370+
max-height: 42vh;
3371+
overflow-y: auto;
3372+
background: var(--bg-panel, #0d1a26);
3373+
border-top: 2px solid var(--accent-cyan, #36c2b4);
3374+
z-index: 201;
3375+
box-shadow: 0 -4px 24px rgba(0, 0, 0, 0.4);
3376+
}
3377+
3378+
.trajectoire-panel {
3379+
padding: 16px 24px 20px;
3380+
}
3381+
3382+
.trajectoire-header {
3383+
display: flex;
3384+
align-items: center;
3385+
justify-content: space-between;
3386+
gap: 12px;
3387+
margin-bottom: 12px;
3388+
}
3389+
3390+
.trajectoire-titre {
3391+
margin: 0;
3392+
font-size: 0.9rem;
3393+
font-weight: 700;
3394+
letter-spacing: 0.05em;
3395+
text-transform: uppercase;
3396+
color: var(--accent-cyan, #36c2b4);
3397+
}
3398+
3399+
.trajectoire-effacer {
3400+
background: none;
3401+
border: none;
3402+
color: var(--text-muted, #8a9ab5);
3403+
font-size: 0.8rem;
3404+
cursor: pointer;
3405+
text-decoration: underline;
3406+
padding: 0;
3407+
}
3408+
3409+
.trajectoire-bornes {
3410+
display: flex;
3411+
align-items: center;
3412+
flex-wrap: wrap;
3413+
gap: 8px;
3414+
margin-bottom: 14px;
3415+
}
3416+
3417+
.trajectoire-borne {
3418+
display: inline-flex;
3419+
align-items: baseline;
3420+
gap: 6px;
3421+
background: rgba(54, 194, 180, 0.08);
3422+
border: 1px solid rgba(54, 194, 180, 0.28);
3423+
border-radius: 20px;
3424+
padding: 5px 12px;
3425+
max-width: 100%;
3426+
color: var(--text-main, #e8edf5);
3427+
}
3428+
3429+
.trajectoire-borne small {
3430+
color: var(--accent-cyan, #36c2b4);
3431+
font-size: 0.68rem;
3432+
font-weight: 700;
3433+
text-transform: uppercase;
3434+
letter-spacing: 0.06em;
3435+
}
3436+
3437+
.trajectoire-borne strong {
3438+
font-size: 0.84rem;
3439+
font-weight: 600;
3440+
overflow-wrap: anywhere;
3441+
}
3442+
3443+
.trajectoire-fleche {
3444+
color: var(--text-muted, #8a9ab5);
3445+
}
3446+
3447+
.trajectoire-attente,
3448+
.trajectoire-message {
3449+
color: var(--text-muted, #8a9ab5);
3450+
font-size: 0.86rem;
3451+
font-style: italic;
3452+
margin: 4px 0;
3453+
}
3454+
3455+
.trajectoire-chemin {
3456+
display: grid;
3457+
grid-template-columns: minmax(0, 1fr);
3458+
gap: 0;
3459+
list-style: none;
3460+
margin: 4px 0 12px;
3461+
padding: 0;
3462+
}
3463+
3464+
.trajectoire-etape {
3465+
margin: 0;
3466+
}
3467+
3468+
.trajectoire-noeud {
3469+
display: flex;
3470+
align-items: center;
3471+
min-height: 38px;
3472+
background: rgba(255, 255, 255, 0.03);
3473+
border: 1px solid rgba(255, 255, 255, 0.07);
3474+
border-radius: 8px;
3475+
padding: 8px 12px;
3476+
}
3477+
3478+
.trajectoire-etape-depart .trajectoire-noeud,
3479+
.trajectoire-etape-arrivee .trajectoire-noeud {
3480+
border-color: rgba(54, 194, 180, 0.3);
3481+
background: rgba(54, 194, 180, 0.05);
3482+
}
3483+
3484+
.trajectoire-nom {
3485+
min-width: 0;
3486+
color: var(--text-secondary, #b8c5d8);
3487+
font-size: 0.9rem;
3488+
font-weight: 600;
3489+
overflow-wrap: anywhere;
3490+
}
3491+
3492+
.trajectoire-transition {
3493+
display: grid;
3494+
grid-template-columns: 1px minmax(0, max-content);
3495+
align-items: center;
3496+
column-gap: 14px;
3497+
min-height: 26px;
3498+
margin: 0 0 0 18px;
3499+
color: var(--text-muted, #8a9ab5);
3500+
}
3501+
3502+
.trajectoire-ligne {
3503+
justify-self: center;
3504+
width: 1px;
3505+
height: 24px;
3506+
background: rgba(54, 194, 180, 0.38);
3507+
}
3508+
3509+
.trajectoire-rel {
3510+
font-size: 0.74rem;
3511+
color: var(--text-muted, #8a9ab5);
3512+
white-space: nowrap;
3513+
}
3514+
3515+
.trajectoire-longueur {
3516+
margin: 0;
3517+
color: var(--accent-cyan, #36c2b4);
3518+
font-size: 0.82rem;
3519+
font-weight: 700;
3520+
}
3521+
33653522
/* ================================================================= */
33663523
/* THREE-TIER NAVIGATION — Cartographic North */
33673524
/* ================================================================= */

0 commit comments

Comments
 (0)