Ajout d'une icône de copie à côté du bouton de partage

This commit is contained in:
JonathanMM 2023-05-17 22:47:35 +02:00
parent e452c26724
commit 5471bd935e
4 changed files with 40 additions and 2 deletions

View file

@ -91,11 +91,16 @@
d="M478 816q21 0 35.5-14.5T528 766q0-21-14.5-35.5T478 716q-21 0-35.5 14.5T428 766q0 21 14.5 35.5T478 816Zm-36-154h74q0-33 7.5-52t42.5-52q26-26 41-49.5t15-56.5q0-56-41-86t-97-30q-57 0-92.5 30T342 438l66 26q5-18 22.5-39t53.5-21q32 0 48 17.5t16 38.5q0 20-12 37.5T506 530q-44 39-54 59t-10 73Zm38 314q-83 0-156-31.5T197 859q-54-54-85.5-127T80 576q0-83 31.5-156T197 293q54-54 127-85.5T480 176q83 0 156 31.5T763 293q54 54 85.5 127T880 576q0 83-31.5 156T763 859q-54 54-127 85.5T480 976Zm0-80q134 0 227-93t93-227q0-134-93-227t-227-93q-134 0-227 93t-93 227q0 134 93 227t227 93Zm0-320Z"
/>
</symbol>
<symbol id="icone-config" v height="24" viewBox="0 96 960 960" width="24">
<symbol id="icone-config" height="24" viewBox="0 96 960 960" width="24">
<path
d="m370 976-16-128q-13-5-24.5-12T307 821l-119 50L78 681l103-78q-1-7-1-13.5v-27q0-6.5 1-13.5L78 471l110-190 119 50q11-8 23-15t24-12l16-128h220l16 128q13 5 24.5 12t22.5 15l119-50 110 190-103 78q1 7 1 13.5v27q0 6.5-2 13.5l103 78-110 190-118-50q-11 8-23 15t-24 12l-16 128H370Zm112-260q58 0 99-41t41-99q0-58-41-99t-99-41q-59 0-99.5 41T342 576q0 58 40.5 99t99.5 41Zm0-80q-25 0-42.5-17.5T422 576q0-25 17.5-42.5T482 516q25 0 42.5 17.5T542 576q0 25-17.5 42.5T482 636Zm-2-60Zm-40 320h79l14-106q31-8 57.5-23.5T639 729l99 41 39-68-86-65q5-14 7-29.5t2-31.5q0-16-2-31.5t-7-29.5l86-65-39-68-99 42q-22-23-48.5-38.5T533 362l-13-106h-79l-14 106q-31 8-57.5 23.5T321 423l-99-41-39 68 86 64q-5 15-7 30t-2 32q0 16 2 31t7 30l-86 65 39 68 99-42q22 23 48.5 38.5T427 790l13 106Z"
/>
</symbol>
<symbol id="icone-copie" height="20" viewBox="0 96 960 960" width="20">
<path
d="M216 960q-29.7 0-50.85-21.15Q144 917.7 144 888V336h72v552h456v72H216Zm144-144q-29.7 0-50.85-21.15Q288 773.7 288 744V264q0-29.7 21.15-50.85Q330.3 192 360 192h384q29.7 0 50.85 21.15Q816 234.3 816 264v480q0 29.7-21.15 50.85Q773.7 816 744 816H360Zm0-72h384V264H360v480Zm0 0V264v480Z"
/>
</symbol>
</svg>
</div>
</div>

View file

@ -351,11 +351,26 @@ h1 {
gap: 0.5em;
}
#config-liste {
display: flex;
flex-direction: column;
gap: 0.5em;
}
.config-item {
display: flex;
justify-content: space-between;
}
.config-item label {
font-size: 20px;
}
.config-item select {
min-width: 20%;
text-align: end;
}
.stats-area {
display: table;
padding-left: 0.5em;
@ -378,6 +393,19 @@ h1 {
text-align: left;
}
#fin-de-partie-panel-resume-bouton {
text-decoration: none;
}
#fin-de-partie-panel-resume-bouton-icone {
width: 20px;
height: 20px;
}
#fin-de-partie-panel-resume-bouton-texte {
text-decoration: underline;
}
.fin-de-partie-panel-phrase {
text-align: left;
padding-left: 0.5em;

View file

@ -35,6 +35,7 @@ export default class ConfigurationPanel {
public afficher(): void {
let titre = "Configuration";
let contenu = document.createElement("div");
contenu.id = "config-liste";
let config = Sauvegardeur.chargerConfig() ?? Configuration.Default;
contenu.appendChild(
this.genererConfigItem(

View file

@ -153,7 +153,11 @@ export default class FinDePartiePanel {
</p>";
}
contenu +=
'<p>Résumé de ta partie <a href="#" id="fin-de-partie-panel-resume-bouton">Partager</a></p> \
'<p>Résumé de ta partie \
<a href="#" id="fin-de-partie-panel-resume-bouton"><svg id="fin-de-partie-panel-resume-bouton-icone"> \
<use href="#icone-copie" stroke="var(--couleur-icone)" fill="var(--couleur-icone)"></use> \
</svg> \
<span id="fin-de-partie-panel-resume-bouton-texte">Partager</span></a></p> \
<pre id="fin-de-partie-panel-resume">' +
this._resumeTexteLegacy +
"</pre>";