Merge pull request #193 from ets-cfuhrman-pfe/JubaAzul/issue137
Some checks are pending
CI/CD Pipeline for Backend / build_and_push_backend (push) Waiting to run
CI/CD Pipeline for Nginx Router / build_and_push_nginx (push) Waiting to run
CI/CD Pipeline for Frontend / build_and_push_frontend (push) Waiting to run
Tests / tests (client) (push) Waiting to run
Tests / tests (server) (push) Waiting to run

Ce n'est pas évident que le format [markdown] doit être utilisé pour les images
This commit is contained in:
Christopher (Cris) Fuhrman 2025-01-31 09:39:52 -05:00 committed by GitHub
commit e9ae3237a0
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 21 additions and 6 deletions

View file

@ -153,7 +153,7 @@ const GiftCheatSheet: React.FC = () => {
</pre> </pre>
</div> </div>
<div className="question-type"> <div className="question-type" id="images-section">
<h4> 9. Images </h4> <h4> 9. Images </h4>
<p>Il est possible d&apos;insérer une image dans une question, une réponse (choix multiple) et dans une rétroaction. D&apos;abord, <strong>le format de l&apos;élément doit être [markdown]</strong>. Ensuite utilisez la syntaxe suivante&nbsp;:</p> <p>Il est possible d&apos;insérer une image dans une question, une réponse (choix multiple) et dans une rétroaction. D&apos;abord, <strong>le format de l&apos;élément doit être [markdown]</strong>. Ensuite utilisez la syntaxe suivante&nbsp;:</p>
<pre> <pre>
@ -185,8 +185,7 @@ const GiftCheatSheet: React.FC = () => {
Attention: l&apos;ancienne fonctionnalité avec les balises <code>{'<img>'}</code> n&apos;est plus Attention: l&apos;ancienne fonctionnalité avec les balises <code>{'<img>'}</code> n&apos;est plus
supportée. supportée.
</p> </p>
</div> </div>
<div className="question-type"> <div className="question-type">
<h4> 10. Informations supplémentaires </h4> <h4> 10. Informations supplémentaires </h4>
<p> <p>

View file

@ -61,6 +61,14 @@ const QuizForm: React.FC = () => {
}; };
}, []); }, []);
const scrollToImagesSection = (event: { preventDefault: () => void; }) => {
event.preventDefault();
const section = document.getElementById('images-section');
if (section) {
section.scrollIntoView({ behavior: 'smooth' });
}
};
useEffect(() => { useEffect(() => {
const fetchData = async () => { const fetchData = async () => {
const userFolders = await ApiService.getUserFolders(); const userFolders = await ApiService.getUserFolders();
@ -278,10 +286,18 @@ const QuizForm: React.FC = () => {
</div> </div>
<h4>Mes images :</h4> <h4>Mes images :</h4>
<div> <div>
<div>(Cliquez sur un lien pour le copier)</div> <div>
<ul> <div style={{ display: "inline" }}>(Voir section </div>
<a href="#images-section"style={{ textDecoration: "none" }} onClick={scrollToImagesSection}>
<u><em><h4 style={{ display: "inline" }}> 9. Images </h4></em></u>
</a>
<div style={{ display: "inline" }}> ci-dessous</div>
<div style={{ display: "inline" }}>)</div>
<br />
<em> - Cliquez sur un lien pour le copier</em>
</div>
<ul>
{imageLinks.map((link, index) => { {imageLinks.map((link, index) => {
const imgTag = `![alt_text](${escapeForGIFT(link)} "texte de l'infobulle")`; const imgTag = `![alt_text](${escapeForGIFT(link)} "texte de l'infobulle")`;
return ( return (