diff --git a/3tq-technique-sociale/files (2).zip b/3tq-technique-sociale/files (2).zip new file mode 100644 index 0000000..59e5346 Binary files /dev/null and b/3tq-technique-sociale/files (2).zip differ diff --git a/3tq-technique-sociale/files (2)/atelier-m3-m4.css b/3tq-technique-sociale/files (2)/atelier-m3-m4.css new file mode 100644 index 0000000..3f12e51 --- /dev/null +++ b/3tq-technique-sociale/files (2)/atelier-m3-m4.css @@ -0,0 +1,81 @@ +/* ===================================================================== + atelier-m3-m4.css + Styles propres aux interactions des modules 3 et 4. + Additif : ne redéfinit aucune classe de theme.css ni d'atelier-texte.css. + Tous les sélecteurs sont préfixés par at- pour éviter toute collision. + Les couleurs reprennent les variables du thème quand elles existent, + avec une valeur de repli sinon. + ===================================================================== */ + +.at-badge{ + display:inline-block;width:1.15rem;height:1.15rem;line-height:1.15rem; + text-align:center;font-size:.72rem;font-weight:700; + color:var(--papier,#fff);margin-right:.4rem;vertical-align:.05rem; +} +.at-badge--c{background:var(--repere,#2A6179)} +.at-badge--p{background:#7A5B12} + +/* ---------- barre de réglages ---------- */ +.at-barre{ + background:#F1F4F6;border:1px solid var(--trait,#CBD4DB); + padding:.8rem 1rem; + display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr)); + gap:.7rem 1.2rem;font-size:.9rem; +} +.at-barre label{display:block;font-size:.84rem;color:var(--encre-clair,#4A5866);margin-bottom:.15rem} +.at-barre label.at-case{display:inline-block;font-size:.9rem;color:var(--encre,#16202B);margin-right:.8rem} +.at-barre select,.at-barre input[type=range]{width:100%;font:inherit;font-size:.9rem} + +.at-atelier{border:1px solid var(--trait,#CBD4DB);margin:1.2rem 0} +.at-atelier .at-barre{border:0;border-bottom:1px solid var(--trait,#CBD4DB)} +.at-atelier__corps{padding:1.4rem 1.2rem;background:var(--papier,#fff)} +#at-apercu{font-family:Cambria,Georgia,serif} + +.at-aligns{display:flex;gap:.3rem;flex-wrap:wrap} +.at-aligns button{padding:.25rem .5rem;font-size:.85rem} +.at-aligns button[aria-pressed="true"]{background:var(--repere,#2A6179);color:var(--papier,#fff)} + +/* ---------- tri caractère / paragraphe ---------- */ +.at-tri{display:grid;grid-template-columns:1fr auto auto;gap:.3rem .5rem;align-items:center;max-width:64ch;font-size:.95rem} +.at-tri__lib{padding:.25rem 0} +.at-tri button{padding:.2rem .6rem;font-size:.85rem} +.at-tri__lib.est-juste{color:var(--juste,#1E7A4C);font-weight:600} +.at-tri__lib.est-faux{color:var(--erreur,#B03A2E)} +.at-tri__verdict{grid-column:1 / -1;font-size:.88rem;margin:0 0 .35rem} +.at-score{font-weight:600;margin-top:.6rem} + +/* ---------- comparaison en deux colonnes ---------- */ +.at-duo{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1rem 0} +.at-duo h4{margin:0 0 .4rem;font-size:.88rem;color:var(--encre-clair,#4A5866);font-weight:600} +@media(max-width:700px){.at-duo{grid-template-columns:1fr}} + +/* ---------- simulation de flux de pages (module 4) ---------- */ +.at-flux{ + column-count:2;column-gap:1rem;column-rule:1px dashed #9AA8B2; + height:13rem;overflow:hidden;background:#FBFCFC; + border:1px solid var(--trait,#CBD4DB);padding:.8rem 1rem; + font-family:Cambria,Georgia,serif;font-size:.82rem;line-height:1.5; +} +.at-flux p{margin:0 0 .5rem} +.at-flux h5{margin:0 0 .4rem;font-size:.95rem;font-family:inherit;font-weight:700} +.at-flux h5.at-saut{break-before:column;-webkit-column-break-before:always} + +/* ---------- feuille A4 réglable (module 4) ---------- */ +.at-mise{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:1.4rem;align-items:start;margin:1.2rem 0} +@media(max-width:700px){.at-mise{grid-template-columns:1fr}} +.at-page{ + border:1px solid var(--encre-clair,#4A5866);background:var(--papier,#fff); + width:min(16rem,100%);aspect-ratio:210/297;margin:0 auto;position:relative; +} +.at-page--paysage{aspect-ratio:297/210;width:min(22rem,100%)} +.at-page__zone{position:absolute;background:var(--repere-clair,#E3EDF1);border:1px dashed var(--repere,#2A6179)} +.at-page__bande{ + position:absolute;left:0;right:0;background:#FDF3E3; + border-top:1px solid #D08C3A;border-bottom:1px solid #D08C3A; + font-size:.6rem;text-align:center;color:#9C4221; +} +.at-page__note{text-align:center;font-size:.85rem;color:var(--encre-clair,#4A5866);margin-top:.6rem} + +/* ---------- champ contre texte tapé ---------- */ +.at-pied{font-family:Cambria,Georgia,serif;border:1px solid var(--trait,#CBD4DB);padding:.9rem 1rem;background:#FBFCFC} +.at-champ{background:#E4EAEE} diff --git a/3tq-technique-sociale/files (2)/atelier-m3-m4.js b/3tq-technique-sociale/files (2)/atelier-m3-m4.js new file mode 100644 index 0000000..d693ae0 --- /dev/null +++ b/3tq-technique-sociale/files (2)/atelier-m3-m4.js @@ -0,0 +1,302 @@ +/* ===================================================================== + atelier-m3-m4.js + Interactions des modules 3 et 4. À charger APRÈS atelier-texte.js. + Chaque bloc ne s'exécute que si son conteneur existe dans la page, + donc le fichier peut être chargé par les deux modules indifféremment. + ===================================================================== */ +(function(){ +"use strict"; + +/* Réutilise le quiz d'atelier-texte.js s'il est disponible. + Sinon, produit le même balisage, pour que la page reste utilisable. */ +const poserQuiz = (typeof window.quiz === 'function') ? window.quiz : function(el, questions){ + if(!el) return; + el.innerHTML = questions.map(function(q,i){ + return '

'+(i+1)+'. '+q.q+'

' + + q.r.map(function(r,j){ + return ''; + }).join('') + + '
'; + }).join(''); + el.addEventListener('change', function(e){ + const bloc = e.target.closest('.q'); + const i = +bloc.dataset.i, q = questions[i]; + bloc.querySelectorAll('label').forEach(function(l,j){ + l.className = (j === q.b) ? 'bon' : (l.querySelector('input').checked ? 'mauvais' : ''); + }); + bloc.querySelector('.verdict').textContent = (+e.target.value === q.b ? 'Exact. ' : 'Non. ') + q.e; + }); +}; + +/* ===================================================================== + MODULE 3 + ===================================================================== */ + +/* ---------- tri caractère ou paragraphe ---------- */ +/* Le retour visuel ne dépend pas de la feuille de style : les couleurs et le + verdict sont écrits directement dans le DOM, pour que l'exercice fonctionne + même si atelier-m3-m4.css n'est pas chargé. */ +(function(){ + const triEl = document.getElementById('at-tri'); + if(!triEl) return; + + const CP = [ + ["Mettre un mot en gras","c"], + ["Centrer un titre","p"], + ["Changer la police","c"], + ["Justifier le texte","p"], + ["Mettre en italique","c"], + ["Ajouter un retrait de première ligne","p"], + ["Changer la couleur du texte","c"], + ["Encadrer d'une bordure","p"], + ["Régler l'interligne","p"], + ["Mettre en exposant","c"], + ["Espacer deux paragraphes","p"], + ["Changer la taille en points","c"] + ]; + const NOM = {c:'Caractère', p:'Paragraphe'}; + const VERT = '#1E7A4C', ROUGE = '#B03A2E'; + + const scoreEl = document.getElementById('at-tri-score'); + const lignes = []; + + CP.forEach(function(r, i){ + const lib = document.createElement('div'); + lib.className = 'at-tri__lib'; + lib.textContent = r[0]; + + const bc = document.createElement('button'); + bc.type = 'button'; bc.textContent = 'C'; bc.dataset.v = 'c'; + const bp = document.createElement('button'); + bp.type = 'button'; bp.textContent = 'P'; bp.dataset.v = 'p'; + + const verdict = document.createElement('div'); + verdict.className = 'at-tri__verdict'; + verdict.style.gridColumn = '1 / -1'; + verdict.style.fontSize = '.88rem'; + verdict.style.margin = '0 0 .35rem'; + verdict.style.minHeight = '0'; + + triEl.appendChild(lib); triEl.appendChild(bc); triEl.appendChild(bp); + triEl.appendChild(verdict); + lignes.push({lib:lib, bc:bc, bp:bp, verdict:verdict, juste:null}); + + [bc, bp].forEach(function(b){ + b.addEventListener('click', function(){ + const choix = b.dataset.v; + const ok = (choix === r[1]); + const L = lignes[i]; + L.juste = ok; + L.lib.style.color = ok ? VERT : ROUGE; + L.lib.style.fontWeight = ok ? '600' : '400'; + L.bc.setAttribute('aria-pressed', String(choix === 'c')); + L.bp.setAttribute('aria-pressed', String(choix === 'p')); + L.verdict.style.color = ok ? VERT : ROUGE; + L.verdict.textContent = ok + ? NOM[choix] + ', exact.' + : NOM[choix] + ', non. C\u2019est un réglage de ' + NOM[r[1]].toLowerCase() + '.'; + majScore(); + }); + }); + }); + + function majScore(){ + if(!scoreEl) return; + const faits = lignes.filter(function(L){ return L.juste !== null; }); + const bons = faits.filter(function(L){ return L.juste; }).length; + if(!faits.length){ scoreEl.textContent = ''; return; } + scoreEl.textContent = bons + ' sur ' + faits.length + ' classés correctement' + + (faits.length === CP.length + ? (bons === CP.length ? '. Tout juste.' : '. Reprends ceux en rouge.') + : ''); + } + + const reset = document.getElementById('at-tri-reset'); + if(reset){ + reset.addEventListener('click', function(){ + lignes.forEach(function(L){ + L.juste = null; + L.lib.style.color = ''; L.lib.style.fontWeight = ''; + L.verdict.textContent = ''; + L.bc.setAttribute('aria-pressed','false'); + L.bp.setAttribute('aria-pressed','false'); + }); + majScore(); + }); + } +})(); + +/* ---------- atelier de mise en forme ---------- */ +const apercu = document.getElementById('at-apercu'); +if(apercu){ + const paras = Array.prototype.slice.call(apercu.querySelectorAll('p')); + const val = function(id){ return document.getElementById(id).value; }; + const coche = function(id){ return document.getElementById(id).checked; }; + function maj(){ + const taille = val('at-taille'), retrait = val('at-retrait'), espace = val('at-espace'); + document.getElementById('at-taille-v').textContent = taille; + document.getElementById('at-retrait-v').textContent = (+retrait).toFixed(2).replace('.',','); + document.getElementById('at-espace-v').textContent = (+espace).toFixed(1).replace('.',','); + const align = document.querySelector('#at-align button[aria-pressed="true"]').dataset.v; + const bord = coche('at-bordure'); + apercu.style.fontFamily = val('at-police'); + apercu.style.fontSize = taille + 'pt'; + apercu.style.fontWeight = coche('at-gras') ? '700' : '400'; + apercu.style.fontStyle = coche('at-italique') ? 'italic' : 'normal'; + paras.forEach(function(p){ + p.style.textAlign = align; + p.style.textIndent = retrait + 'cm'; + p.style.marginBottom = espace + 'cm'; + p.style.lineHeight = val('at-interligne'); + p.style.border = bord ? '1px solid #B8912A' : 'none'; + p.style.background = bord ? '#FEFAEC' : 'transparent'; + p.style.padding = bord ? '.4rem .6rem' : '0'; + }); + } + ['at-police','at-taille','at-retrait','at-espace','at-interligne','at-bordure','at-gras','at-italique'] + .forEach(function(id){ document.getElementById(id).addEventListener('input', maj); }); + const alignEl = document.getElementById('at-align'); + if(alignEl) alignEl.addEventListener('click', function(e){ + const b = e.target.closest('button'); if(!b) return; + document.querySelectorAll('#at-align button').forEach(function(x){ x.setAttribute('aria-pressed','false'); }); + b.setAttribute('aria-pressed','true'); + maj(); + }); + maj(); +} + +/* ---------- quiz module 3 ---------- */ +poserQuiz(document.getElementById('quiz3'), [ + {q:"Tu poses le curseur dans un mot, sans rien sélectionner, et tu cliques sur Centrer. Que se passe-t-il ?", + r:["Seul le mot se centre","Tout le paragraphe se centre","Rien ne se passe"], + b:1, e:"L'alignement est une mise en forme de paragraphe : elle s'applique au paragraphe entier, sans sélection."}, + {q:"Comment sépares-tu deux paragraphes ?", + r:["Par une ligne vide, avec la touche Entrée","Par un espacement après le paragraphe","Par plusieurs touches Entrée"], + b:1, e:"Le réglage d'espacement se modifie d'un seul geste sur tout le document. Une ligne vide, non."}, + {q:"Quelle taille convient à un texte courant ?", + r:["8 points","10 à 12 points","16 points"], + b:1, e:"En dessous on ne lit plus. Au-dessus, le document semble destiné aux malvoyants, ce qui est parfois exactement le but."}, + {q:"À quoi sert le pinceau de la barre d'outils ?", + r:["À colorier le texte","À reproduire une mise en forme ailleurs","À effacer le texte"], + b:1, e:"Cloner le formatage. Un clic pour une seule application, un double-clic pour en enchaîner plusieurs."}, + {q:"Tu colles un texte venu d'un site et il arrive avec sa mise en forme. Le plus simple ?", + r:["Le coller avec Ctrl+Maj+V en texte non formaté","Le retaper","Changer la police à la main"], + b:0, e:"Et si c'est déjà collé, Ctrl+M efface le formatage direct."}, + {q:"Où trouve-t-on la couleur de fond d'un paragraphe ?", + r:["Format, Caractère","Format, Paragraphe, onglet Zone","Format, Style de page"], + b:1, e:"L'onglet Zone, appelé Arrière-plan dans les versions plus anciennes. Un fond clair, sinon le texte devient illisible."} +]); + +/* ===================================================================== + MODULE 4 + ===================================================================== */ + +/* ---------- feuille A4 et marges ---------- */ +const page = document.getElementById('at-page'); +if(page){ + const zone = document.getElementById('at-page-zone'); + const note = document.getElementById('at-page-note'); + function majPage(){ + const paysage = document.querySelector('#at-orient button[aria-pressed="true"]').dataset.v === 'paysage'; + page.classList.toggle('at-page--paysage', paysage); + const L = paysage ? 29.7 : 21, H = paysage ? 21 : 29.7; + const m = {}; + ['haut','bas','gauche','droite'].forEach(function(k){ + m[k] = +document.getElementById('at-m-'+k).value; + document.getElementById('at-m-'+k+'-v').textContent = String(m[k]).replace('.',','); + }); + zone.style.top = (m.haut/H*100)+'%'; + zone.style.bottom = (m.bas/H*100)+'%'; + zone.style.left = (m.gauche/L*100)+'%'; + zone.style.right = (m.droite/L*100)+'%'; + zone.innerHTML = ''; + if(document.getElementById('at-entete').checked){ + zone.insertAdjacentHTML('beforeend','
en-tête
'); + } + if(document.getElementById('at-pied').checked){ + zone.insertAdjacentHTML('beforeend','
pied de page
'); + } + let t = 'Zone de texte : ' + + (L - m.gauche - m.droite).toFixed(1).replace('.',',') + ' cm sur ' + + (H - m.haut - m.bas).toFixed(1).replace('.',',') + ' cm.'; + if(m.gauche < 1.5 || m.droite < 1.5 || m.haut < 1.5 || m.bas < 1.5){ + t += ' Attention, en dessous de 1,5 cm certaines imprimantes coupent le texte.'; + } + note.textContent = t; + } + ['at-m-haut','at-m-bas','at-m-gauche','at-m-droite','at-entete','at-pied'] + .forEach(function(id){ document.getElementById(id).addEventListener('input', majPage); }); + const orientEl = document.getElementById('at-orient'); + if(orientEl) orientEl.addEventListener('click', function(e){ + const b = e.target.closest('button'); if(!b) return; + document.querySelectorAll('#at-orient button').forEach(function(x){ x.setAttribute('aria-pressed','false'); }); + b.setAttribute('aria-pressed','true'); + majPage(); + }); + majPage(); +} + +/* ---------- lignes vides contre saut de page ---------- */ +const fluxA = document.getElementById('at-flux-vides'); +if(fluxA){ + const fluxB = document.getElementById('at-flux-saut'); + const CORPS = "La crèche Les Petits Pas accueille les enfants de deux mois et demi à trois ans. Elle dispose de trente-six places réparties en trois sections. Les inscriptions se prennent à partir du quatrième mois de grossesse. Une visite des locaux est organisée avant toute inscription."; + const SUITE = "L'accueil du matin se fait de sept heures à neuf heures. Chaque enfant est remis à une puéricultrice de sa section."; + const AJOUT = "Une réunion de parents est organisée chaque année en septembre."; + let ajouts = 0; + function rendreFlux(){ + let tete = ''; + for(let i = 0; i < ajouts; i++){ tete += '

'+AJOUT+'

'; } + const vides = new Array(7).join('

 

'); + fluxA.innerHTML = "
Fiche d'information
" + tete + '

'+CORPS+'

' + vides + + "
Le déroulement d'une journée

"+SUITE+"

"; + fluxB.innerHTML = "
Fiche d'information
" + tete + '

'+CORPS+'

' + + "
Le déroulement d'une journée

"+SUITE+"

"; + } + document.getElementById('at-flux-plus').addEventListener('click', function(){ if(ajouts < 4){ ajouts++; rendreFlux(); } }); + document.getElementById('at-flux-reset').addEventListener('click', function(){ ajouts = 0; rendreFlux(); }); + rendreFlux(); +} + +/* ---------- numéro tapé contre champ inséré ---------- */ +const piedMain = document.getElementById('at-pied-main'); +if(piedMain){ + const piedChamp = document.getElementById('at-pied-champ'); + const noteChamp = document.getElementById('at-champ-note'); + let nb = 4; + function rendreChamp(){ + piedMain.innerHTML = 'Document mis à jour en septembre 2026     Page 1 sur 4'; + piedChamp.innerHTML = 'Document mis à jour en septembre 2026     Page ' + + '1 sur '+nb+''; + noteChamp.textContent = (nb === 4) + ? "Le document compte 4 pages. Les deux pieds de page disent la même chose. Ajoute une page." + : "Le document compte maintenant " + nb + " pages. À gauche, le total est faux et il faudra le corriger sur chaque page. À droite, il s'est recalculé tout seul."; + } + document.getElementById('at-page-plus').addEventListener('click', function(){ if(nb < 12){ nb++; rendreChamp(); } }); + document.getElementById('at-page-reset').addEventListener('click', function(){ nb = 4; rendreChamp(); }); + rendreChamp(); +} + +/* ---------- quiz module 4 ---------- */ +poserQuiz(document.getElementById('quiz4'), [ + {q:"Comment fais-tu commencer un titre en haut de la page suivante ?", + r:["En appuyant plusieurs fois sur Entrée","Avec Ctrl+Entrée","En agrandissant les marges"], + b:1, e:"Le saut de page manuel tient, même si tu ajoutes du texte avant. Les lignes vides, non."}, + {q:"Où règle-t-on les marges d'un document ?", + r:["Format, Paragraphe","Format, Style de page","Insertion, En-tête"], + b:1, e:"La marge définit où commence la zone de texte. Le retrait, lui, éloigne un paragraphe du bord de cette zone."}, + {q:"Tu tapes le numéro 1 dans le pied de page de la première page. Que voit-on page 3 ?", + r:["Le numéro 3","Le numéro 1","Rien"], + b:1, e:"Un texte tapé se répète tel quel sur toutes les pages. Il faut insérer un champ, pas un chiffre."}, + {q:"À quoi sert l'aperçu avant impression ?", + r:["À imprimer plus vite","À voir le document tel qu'il sortira de l'imprimante","À corriger l'orthographe"], + b:1, e:"On y vérifie les coupures de page, les en-têtes et l'équilibre général. Avant d'imprimer, pas après."}, + {q:"Tu envoies un courrier terminé aux parents. Quel format ?", + r:["Le PDF","Le fichier .odt","Une capture d'écran"], + b:0, e:"Le PDF est figé : le destinataire le voit comme tu l'as fait. Tu gardes ton .odt pour pouvoir le modifier."}, + {q:"Dans un en-tête, comment places-tu un texte à droite ?", + r:["Avec des espaces","Avec la touche Tab","En agrandissant la marge"], + b:1, e:"Les taquets sont déjà posés dans l'en-tête : une fois Tab pour le centre, deux fois pour la droite."} +]); + +})(); diff --git a/3tq-technique-sociale/files (2)/site-m3-m4.zip b/3tq-technique-sociale/files (2)/site-m3-m4.zip new file mode 100644 index 0000000..4ce0bdf Binary files /dev/null and b/3tq-technique-sociale/files (2)/site-m3-m4.zip differ diff --git a/3tq-technique-sociale/files.zip b/3tq-technique-sociale/files.zip new file mode 100644 index 0000000..06fac05 Binary files /dev/null and b/3tq-technique-sociale/files.zip differ diff --git a/3tq-technique-sociale/files/LISEZMOI-corriges.md b/3tq-technique-sociale/files/LISEZMOI-corriges.md new file mode 100644 index 0000000..99c86a5 --- /dev/null +++ b/3tq-technique-sociale/files/LISEZMOI-corriges.md @@ -0,0 +1,54 @@ +# Corrigés projetables, modules 3 et 4 + +Un fichier par exercice, en deux formats. + +Le `.odt` s'ouvre dans Writer. C'est celui à projeter en classe : les élèves voient le +résultat, et tu peux ouvrir Format, Paragraphe devant eux pour montrer d'où viennent les +réglages. Ctrl+F10 y fonctionne, et c'est l'usage principal : montrer qu'il n'y a ni ligne +vide, ni espace d'alignement. + +Le `.pdf` sert si tu veux seulement afficher ou imprimer, sans risque de modification +accidentelle pendant la projection. + +## Correspondance + +| Fichier | Exercice | Ce qu'il montre | +|---|---|---| +| `m03-ex1-corrige` | M3, exercice 1 | Mise en forme des caractères : polices, tailles, gras, italique, couleur | +| `m03-ex2-corrige` | M3, exercice 2 | Le même document, plus les réglages de paragraphe : alignements, retrait, espacement, interligne | +| `m03-ex3-corrige` | M3, exercice 3 | Le paragraphe encadré : bordure, fond, retraits, espacement intérieur | +| `m03-ex4-corrige` | M3, exercice 4 | Sous-titres identiques, dernier paragraphe nettoyé, remplacements effectués | +| `m03-ex5-corrige` | M3, exercice 5 | Le résultat du document annoté. Sert aussi de modèle à photocopier | +| `m04-ex1-corrige` | M4, exercice 1 | A4 portrait, marges 2,5 à gauche et 2 ailleurs | +| `m04-ex2-corrige` | M4, exercice 2 | Quatre pages, chaque section en haut d'une page par saut manuel | +| `m04-ex3-corrige` | M4, exercice 3 | En-tête avec filet et pied de page, sur les quatre pages | +| `m04-ex4-corrige` | M4, exercice 4 | Champs : date automatique en en-tête, Page n sur 4 en pied | +| `m04-ex5-corrige` | M4, exercice 5 | Document vérifié, prêt à exporter. Le PDF fourni est le résultat de l'export | + +Les quatre documents du module 4 sont le même fichier à quatre stades. Ouverts côte à côte, +ils montrent la construction du dossier d'un exercice à l'autre. + +## Deux écarts volontaires avec l'énoncé + +**M3, exercice 1.** Le texte de l'exercice contient une faute d'accord, « la participation +est gratuit ». Le corrigé affiche GRATUITE, c'est-à-dire la version corrigée. Projeter un +document fautif serait contre-productif, et la copie professeur prévoit un bonus pour +l'élève qui corrige spontanément. Si tu préfères afficher exactement ce que l'énoncé +demandait, le mot se remodifie en trois secondes dans le fichier. + +**M4, exercices 3 à 5.** L'en-tête porte le filet fin demandé à l'exercice 3, et il est +conservé aux exercices 4 et 5. Le pied de page n'en a pas. + +## Ce qui est réellement dans les fichiers + +Ce ne sont pas des images ni des captures : ce sont de vrais documents ODF, avec des styles +de paragraphe, des bordures, des tabulations dans l'en-tête et de vrais champs de +numérotation. Ajoute une page à `m04-ex4-corrige.odt` et le total se met à jour : la +démonstration de l'exercice 4 se fait donc directement dans le corrigé. + +La date de l'en-tête est un champ, réglé sur le 26 septembre 2026. À l'ouverture, Writer +peut l'actualiser à la date du jour selon la configuration du poste. C'est le comportement +normal d'un champ de date, et c'est justement ce que l'exercice 4 fait remarquer. + +Polices utilisées : Liberation Serif pour le texte, Liberation Sans pour les titres. Ce sont +les polices livrées avec LibreOffice, donc présentes sur tous les postes. diff --git a/3tq-technique-sociale/files/corriges-m3-m4.zip b/3tq-technique-sociale/files/corriges-m3-m4.zip new file mode 100644 index 0000000..1572089 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4.zip differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/LISEZMOI-corriges.md b/3tq-technique-sociale/files/corriges-m3-m4/LISEZMOI-corriges.md new file mode 100644 index 0000000..99c86a5 --- /dev/null +++ b/3tq-technique-sociale/files/corriges-m3-m4/LISEZMOI-corriges.md @@ -0,0 +1,54 @@ +# Corrigés projetables, modules 3 et 4 + +Un fichier par exercice, en deux formats. + +Le `.odt` s'ouvre dans Writer. C'est celui à projeter en classe : les élèves voient le +résultat, et tu peux ouvrir Format, Paragraphe devant eux pour montrer d'où viennent les +réglages. Ctrl+F10 y fonctionne, et c'est l'usage principal : montrer qu'il n'y a ni ligne +vide, ni espace d'alignement. + +Le `.pdf` sert si tu veux seulement afficher ou imprimer, sans risque de modification +accidentelle pendant la projection. + +## Correspondance + +| Fichier | Exercice | Ce qu'il montre | +|---|---|---| +| `m03-ex1-corrige` | M3, exercice 1 | Mise en forme des caractères : polices, tailles, gras, italique, couleur | +| `m03-ex2-corrige` | M3, exercice 2 | Le même document, plus les réglages de paragraphe : alignements, retrait, espacement, interligne | +| `m03-ex3-corrige` | M3, exercice 3 | Le paragraphe encadré : bordure, fond, retraits, espacement intérieur | +| `m03-ex4-corrige` | M3, exercice 4 | Sous-titres identiques, dernier paragraphe nettoyé, remplacements effectués | +| `m03-ex5-corrige` | M3, exercice 5 | Le résultat du document annoté. Sert aussi de modèle à photocopier | +| `m04-ex1-corrige` | M4, exercice 1 | A4 portrait, marges 2,5 à gauche et 2 ailleurs | +| `m04-ex2-corrige` | M4, exercice 2 | Quatre pages, chaque section en haut d'une page par saut manuel | +| `m04-ex3-corrige` | M4, exercice 3 | En-tête avec filet et pied de page, sur les quatre pages | +| `m04-ex4-corrige` | M4, exercice 4 | Champs : date automatique en en-tête, Page n sur 4 en pied | +| `m04-ex5-corrige` | M4, exercice 5 | Document vérifié, prêt à exporter. Le PDF fourni est le résultat de l'export | + +Les quatre documents du module 4 sont le même fichier à quatre stades. Ouverts côte à côte, +ils montrent la construction du dossier d'un exercice à l'autre. + +## Deux écarts volontaires avec l'énoncé + +**M3, exercice 1.** Le texte de l'exercice contient une faute d'accord, « la participation +est gratuit ». Le corrigé affiche GRATUITE, c'est-à-dire la version corrigée. Projeter un +document fautif serait contre-productif, et la copie professeur prévoit un bonus pour +l'élève qui corrige spontanément. Si tu préfères afficher exactement ce que l'énoncé +demandait, le mot se remodifie en trois secondes dans le fichier. + +**M4, exercices 3 à 5.** L'en-tête porte le filet fin demandé à l'exercice 3, et il est +conservé aux exercices 4 et 5. Le pied de page n'en a pas. + +## Ce qui est réellement dans les fichiers + +Ce ne sont pas des images ni des captures : ce sont de vrais documents ODF, avec des styles +de paragraphe, des bordures, des tabulations dans l'en-tête et de vrais champs de +numérotation. Ajoute une page à `m04-ex4-corrige.odt` et le total se met à jour : la +démonstration de l'exercice 4 se fait donc directement dans le corrigé. + +La date de l'en-tête est un champ, réglé sur le 26 septembre 2026. À l'ouverture, Writer +peut l'actualiser à la date du jour selon la configuration du poste. C'est le comportement +normal d'un champ de date, et c'est justement ce que l'exercice 4 fait remarquer. + +Polices utilisées : Liberation Serif pour le texte, Liberation Sans pour les titres. Ce sont +les polices livrées avec LibreOffice, donc présentes sur tous les postes. diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex1-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex1-corrige.odt new file mode 100644 index 0000000..f09ecfc Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex1-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex1-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex1-corrige.pdf new file mode 100644 index 0000000..0603c1d Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex1-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex2-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex2-corrige.odt new file mode 100644 index 0000000..c157e6a Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex2-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex2-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex2-corrige.pdf new file mode 100644 index 0000000..0fdf84e Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex2-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex3-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex3-corrige.odt new file mode 100644 index 0000000..2531c89 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex3-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex3-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex3-corrige.pdf new file mode 100644 index 0000000..4087293 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex3-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex4-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex4-corrige.odt new file mode 100644 index 0000000..4037be8 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex4-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex4-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex4-corrige.pdf new file mode 100644 index 0000000..94e3245 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex4-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex5-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex5-corrige.odt new file mode 100644 index 0000000..a581cc8 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex5-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m03-ex5-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex5-corrige.pdf new file mode 100644 index 0000000..18306bd Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m03-ex5-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex1-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex1-corrige.odt new file mode 100644 index 0000000..260fe6c Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex1-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex1-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex1-corrige.pdf new file mode 100644 index 0000000..9ad3c16 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex1-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex2-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex2-corrige.odt new file mode 100644 index 0000000..c3bbcc1 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex2-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex2-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex2-corrige.pdf new file mode 100644 index 0000000..e8cdc4d Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex2-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex3-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex3-corrige.odt new file mode 100644 index 0000000..147d496 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex3-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex3-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex3-corrige.pdf new file mode 100644 index 0000000..bcc77ea Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex3-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex4-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex4-corrige.odt new file mode 100644 index 0000000..ad9fe1c Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex4-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex4-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex4-corrige.pdf new file mode 100644 index 0000000..76d25a1 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex4-corrige.pdf differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex5-corrige.odt b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex5-corrige.odt new file mode 100644 index 0000000..f23de65 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex5-corrige.odt differ diff --git a/3tq-technique-sociale/files/corriges-m3-m4/m04-ex5-corrige.pdf b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex5-corrige.pdf new file mode 100644 index 0000000..a7547e6 Binary files /dev/null and b/3tq-technique-sociale/files/corriges-m3-m4/m04-ex5-corrige.pdf differ diff --git a/3tq-technique-sociale/files/m03-ex5-corrige.odt b/3tq-technique-sociale/files/m03-ex5-corrige.odt new file mode 100644 index 0000000..a581cc8 Binary files /dev/null and b/3tq-technique-sociale/files/m03-ex5-corrige.odt differ diff --git a/3tq-technique-sociale/files/m04-ex4-corrige.odt b/3tq-technique-sociale/files/m04-ex4-corrige.odt new file mode 100644 index 0000000..ad9fe1c Binary files /dev/null and b/3tq-technique-sociale/files/m04-ex4-corrige.odt differ diff --git a/4tq-agent-education/seance1/.~lock.S1_texte-brut.odt# b/4tq-agent-education/seance1/.~lock.S1_texte-brut.odt# deleted file mode 100644 index 9295b14..0000000 --- a/4tq-agent-education/seance1/.~lock.S1_texte-brut.odt# +++ /dev/null @@ -1 +0,0 @@ -,lrdlg,leradiologue.local,25.09.2026 11:18,file:///Users/lrdlg/Library/Application%20Support/LibreOffice/4; \ No newline at end of file diff --git a/assets/atelier-m3-m4.css b/assets/atelier-m3-m4.css index 99e39b4..3f12e51 100644 --- a/assets/atelier-m3-m4.css +++ b/assets/atelier-m3-m4.css @@ -41,6 +41,7 @@ .at-tri button{padding:.2rem .6rem;font-size:.85rem} .at-tri__lib.est-juste{color:var(--juste,#1E7A4C);font-weight:600} .at-tri__lib.est-faux{color:var(--erreur,#B03A2E)} +.at-tri__verdict{grid-column:1 / -1;font-size:.88rem;margin:0 0 .35rem} .at-score{font-weight:600;margin-top:.6rem} /* ---------- comparaison en deux colonnes ---------- */ diff --git a/assets/atelier-m3-m4.js b/assets/atelier-m3-m4.js index 624ff11..d693ae0 100644 --- a/assets/atelier-m3-m4.js +++ b/assets/atelier-m3-m4.js @@ -33,8 +33,13 @@ const poserQuiz = (typeof window.quiz === 'function') ? window.quiz : function(e ===================================================================== */ /* ---------- tri caractère ou paragraphe ---------- */ -const triEl = document.getElementById('at-tri'); -if(triEl){ +/* Le retour visuel ne dépend pas de la feuille de style : les couleurs et le + verdict sont écrits directement dans le DOM, pour que l'exercice fonctionne + même si atelier-m3-m4.css n'est pas chargé. */ +(function(){ + const triEl = document.getElementById('at-tri'); + if(!triEl) return; + const CP = [ ["Mettre un mot en gras","c"], ["Centrer un titre","p"], @@ -49,32 +54,77 @@ if(triEl){ ["Espacer deux paragraphes","p"], ["Changer la taille en points","c"] ]; + const NOM = {c:'Caractère', p:'Paragraphe'}; + const VERT = '#1E7A4C', ROUGE = '#B03A2E'; + const scoreEl = document.getElementById('at-tri-score'); - let faits = {}; - function rendre(){ - triEl.innerHTML = CP.map(function(r,i){ - const etat = faits[i]; - const cls = etat === undefined ? '' : (etat ? ' est-juste' : ' est-faux'); - return '
'+r[0]+'
' - + '' - + ''; - }).join(''); - const n = Object.keys(faits).length; - const bons = Object.keys(faits).filter(function(k){return faits[k];}).length; - scoreEl.textContent = n - ? bons+' sur '+n+' classés correctement' - + (n === CP.length ? (bons === CP.length ? '. Tout juste.' : '. Reprends ceux en rouge.') : '') - : ''; - } - triEl.addEventListener('click', function(e){ - const b = e.target.closest('button'); if(!b) return; - const i = +b.dataset.i; - faits[i] = (b.dataset.v === CP[i][1]); - rendre(); + const lignes = []; + + CP.forEach(function(r, i){ + const lib = document.createElement('div'); + lib.className = 'at-tri__lib'; + lib.textContent = r[0]; + + const bc = document.createElement('button'); + bc.type = 'button'; bc.textContent = 'C'; bc.dataset.v = 'c'; + const bp = document.createElement('button'); + bp.type = 'button'; bp.textContent = 'P'; bp.dataset.v = 'p'; + + const verdict = document.createElement('div'); + verdict.className = 'at-tri__verdict'; + verdict.style.gridColumn = '1 / -1'; + verdict.style.fontSize = '.88rem'; + verdict.style.margin = '0 0 .35rem'; + verdict.style.minHeight = '0'; + + triEl.appendChild(lib); triEl.appendChild(bc); triEl.appendChild(bp); + triEl.appendChild(verdict); + lignes.push({lib:lib, bc:bc, bp:bp, verdict:verdict, juste:null}); + + [bc, bp].forEach(function(b){ + b.addEventListener('click', function(){ + const choix = b.dataset.v; + const ok = (choix === r[1]); + const L = lignes[i]; + L.juste = ok; + L.lib.style.color = ok ? VERT : ROUGE; + L.lib.style.fontWeight = ok ? '600' : '400'; + L.bc.setAttribute('aria-pressed', String(choix === 'c')); + L.bp.setAttribute('aria-pressed', String(choix === 'p')); + L.verdict.style.color = ok ? VERT : ROUGE; + L.verdict.textContent = ok + ? NOM[choix] + ', exact.' + : NOM[choix] + ', non. C\u2019est un réglage de ' + NOM[r[1]].toLowerCase() + '.'; + majScore(); + }); + }); }); - document.getElementById('at-tri-reset').addEventListener('click', function(){ faits = {}; rendre(); }); - rendre(); -} + + function majScore(){ + if(!scoreEl) return; + const faits = lignes.filter(function(L){ return L.juste !== null; }); + const bons = faits.filter(function(L){ return L.juste; }).length; + if(!faits.length){ scoreEl.textContent = ''; return; } + scoreEl.textContent = bons + ' sur ' + faits.length + ' classés correctement' + + (faits.length === CP.length + ? (bons === CP.length ? '. Tout juste.' : '. Reprends ceux en rouge.') + : ''); + } + + const reset = document.getElementById('at-tri-reset'); + if(reset){ + reset.addEventListener('click', function(){ + lignes.forEach(function(L){ + L.juste = null; + L.lib.style.color = ''; L.lib.style.fontWeight = ''; + L.verdict.textContent = ''; + L.bc.setAttribute('aria-pressed','false'); + L.bp.setAttribute('aria-pressed','false'); + }); + majScore(); + }); + } +})(); /* ---------- atelier de mise en forme ---------- */ const apercu = document.getElementById('at-apercu'); @@ -105,7 +155,8 @@ if(apercu){ } ['at-police','at-taille','at-retrait','at-espace','at-interligne','at-bordure','at-gras','at-italique'] .forEach(function(id){ document.getElementById(id).addEventListener('input', maj); }); - document.getElementById('at-align').addEventListener('click', function(e){ + const alignEl = document.getElementById('at-align'); + if(alignEl) alignEl.addEventListener('click', function(e){ const b = e.target.closest('button'); if(!b) return; document.querySelectorAll('#at-align button').forEach(function(x){ x.setAttribute('aria-pressed','false'); }); b.setAttribute('aria-pressed','true'); @@ -175,7 +226,8 @@ if(page){ } ['at-m-haut','at-m-bas','at-m-gauche','at-m-droite','at-entete','at-pied'] .forEach(function(id){ document.getElementById(id).addEventListener('input', majPage); }); - document.getElementById('at-orient').addEventListener('click', function(e){ + const orientEl = document.getElementById('at-orient'); + if(orientEl) orientEl.addEventListener('click', function(e){ const b = e.target.closest('button'); if(!b) return; document.querySelectorAll('#at-orient button').forEach(function(x){ x.setAttribute('aria-pressed','false'); }); b.setAttribute('aria-pressed','true');