The About panel now names the publisher, TechnoLibre Inc., and the author, Mathieu Benoit, developer, designer and maintainer of the software, above the copyable block. The block carries the displayed version alone: the Windows form (2026.1005.1.0) was a second number for the same release that no changelog names, and the Windows guide points to the executable's file name instead. Copy still takes the block only, never the credits. Checked: node 5174, browser 1161, node-long 129; no capture changes. --- FR --- [IMP] panneau À propos : éditeur et auteur, version affichée seule Le panneau « À propos » nomme l'éditeur, TechnoLibre Inc., et l'auteur, Mathieu Benoit, développeur, concepteur et mainteneur du logiciel, au-dessus du bloc à copier. Le bloc ne porte plus que la version affichée : la forme Windows (2026.1005.1.0) était un second numéro de la même version qu'aucun changelog ne nomme, et le guide Windows renvoie au nom de l'exécutable. « Copier » n'emporte toujours que le bloc, jamais l'éditeur ni l'auteur. Vérifié : node 5174, navigateur 1161, node-long 129 ; aucune capture. Assisted-by: Claude Opus 5.5
117 lines
3.2 KiB
Svelte
117 lines
3.2 KiB
Svelte
<!-- © 2026 TechnoLibre (http://www.technolibre.ca)
|
|
License AGPL-3.0 or later (https://www.gnu.org/licenses/agpl) -->
|
|
|
|
<script>
|
|
// Le panneau « À propos » (§ 18.6) : l'éditeur et l'auteur du logiciel,
|
|
// puis le bloc d'une ligne que l'opérateur copie dans un courriel, tel que
|
|
// blocAPropos l'a composé, et sa copie dans le presse-papiers de la
|
|
// plateforme. « Copier » remet exactement le texte du bloc, sans l'éditeur
|
|
// ni l'auteur ; l'issue de la copie se lit sous les commandes.
|
|
//
|
|
// Habillage : le titre de l'écran, puis une carte qui porte l'éditeur,
|
|
// l'auteur en gras et son rôle dans l'encre secondaire, le bloc, sur le
|
|
// fond sourd de la carte, et les commandes — « Copier », l'action
|
|
// principale, et « Fermer ». Une copie refusée se dit dans l'encre du
|
|
// refus.
|
|
import { getContext } from 'svelte';
|
|
import Carte from './primitives/Carte.svelte';
|
|
import Commande from './primitives/Commande.svelte';
|
|
|
|
const t = getContext('t');
|
|
|
|
let { bloc, pressePapiers, fermer } = $props();
|
|
|
|
// null avant toute copie, puis 'faite' ou 'refusee'.
|
|
let issue = $state(null);
|
|
|
|
async function copier() {
|
|
try {
|
|
await pressePapiers.copier(bloc);
|
|
issue = 'faite';
|
|
} catch {
|
|
issue = 'refusee';
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<section class="apropos" data-ecran="apropos">
|
|
<h1>{t('coquille.apropos.titre')}</h1>
|
|
<Carte>
|
|
<div class="contenu">
|
|
<div class="credits" data-credits>
|
|
<p data-editeur>{t('coquille.apropos.editeur')}</p>
|
|
<p class="auteur" data-auteur>{t('coquille.apropos.auteur')}</p>
|
|
<p class="role" data-role>{t('coquille.apropos.role')}</p>
|
|
</div>
|
|
<p class="bloc" data-bloc>{bloc}</p>
|
|
<div class="commandes">
|
|
<Commande cle="coquille.apropos.copier" nom="copier" variante="principale" executer={copier} />
|
|
<Commande cle="coquille.apropos.fermer" nom="fermerApropos" executer={fermer} />
|
|
</div>
|
|
{#if issue === 'faite'}
|
|
<p role="status">{t('coquille.apropos.copie')}</p>
|
|
{:else if issue === 'refusee'}
|
|
<p role="status" class="refus" data-refus="copier">{t('coquille.apropos.copieRefusee')}</p>
|
|
{/if}
|
|
</div>
|
|
</Carte>
|
|
</section>
|
|
|
|
<style>
|
|
.apropos {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--espace-4);
|
|
}
|
|
|
|
h1 {
|
|
margin: 0;
|
|
}
|
|
|
|
.contenu {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--espace-3);
|
|
}
|
|
|
|
p {
|
|
margin: 0;
|
|
}
|
|
|
|
/* Le bloc se sélectionne d'un clic, entier, et se coupe où il faut
|
|
plutôt que de déborder. */
|
|
.credits {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: var(--espace-1);
|
|
}
|
|
|
|
.auteur {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.role {
|
|
color: var(--couleur-page-texte-secondaire);
|
|
}
|
|
|
|
.bloc {
|
|
padding: var(--espace-3) var(--espace-4);
|
|
border: 1px solid var(--couleur-carte-filet);
|
|
border-radius: var(--rayon-2);
|
|
background-color: var(--couleur-carte-fond-sourd);
|
|
font-variant-numeric: tabular-nums;
|
|
user-select: all;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.commandes {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: var(--espace-2);
|
|
}
|
|
|
|
.refus {
|
|
color: var(--couleur-refus);
|
|
}
|
|
</style>
|