Maquettes Claude Design avec visio de classe
This commit is contained in:
parent
238070ae54
commit
236d2d3567
243 changed files with 27992 additions and 0 deletions
11
design/_build/helpers.js
Normal file
11
design/_build/helpers.js
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
|
||||
var ICON={grid:'<path d="M3 3h7v7H3zM14 3h7v7h-7zM3 14h7v7H3zM14 14h7v7h-7z"/>',alert:'<path d="M10.3 3.9 1.8 18a2 2 0 0 0 1.7 3h17a2 2 0 0 0 1.7-3L13.7 3.9a2 2 0 0 0-3.4 0zM12 9v4M12 17h.01"/>',users:'<path d="M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2"/><circle cx="9" cy="7" r="4"/>',note:'<path d="M12 20h9M16.5 3.5a2.1 2.1 0 0 1 3 3L7 19l-4 1 1-4Z"/>',shield:'<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>',book:'<path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20V2H6.5A2.5 2.5 0 0 0 4 4.5v15z"/>',chat:'<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/>',check:'<path d="M20 6 9 17l-5-5"/>',download:'<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4M7 10l5 5 5-5M12 15V3"/>',help:'<circle cx="12" cy="12" r="10"/><path d="M9.1 9a3 3 0 0 1 5.8 1c0 2-3 3-3 3M12 17h.01"/>',map:'<path d="M1 6v16l7-4 8 4 7-4V2l-7 4-8-4-7 4zM8 2v16M16 6v16"/>',trophy:'<path d="M6 9H4a2 2 0 0 1 0-4h2M18 9h2a2 2 0 0 0 0-4h-2M4 22h16M18 2H6v7a6 6 0 0 0 12 0V2z"/>',play:'<path d="m6 3 14 9-14 9V3z"/>',search:'<circle cx="11" cy="11" r="8"/><path d="m21 21-4.3-4.3"/>',spark:'<path d="M12 3v4M12 17v4M3 12h4M17 12h4M5.6 5.6l2.8 2.8M15.6 15.6l2.8 2.8M5.6 18.4l2.8-2.8M15.6 8.4l2.8-2.8"/>'};
|
||||
var I=function(n,c){return '<svg viewBox="0 0 24 24" class="'+(c||'h-4 w-4')+' shrink-0" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">'+ICON[n]+'</svg>';};
|
||||
var navi=function(i,t,n,act){return '<li><a href="#'+t+'" class="flex items-center gap-3 border-2 '+(act?'border-black bg-black text-white':'border-transparent hover:border-black')+' px-3 py-2 text-sm font-bold">'+I(i)+'<span class="flex-1">'+n+'</span></a></li>';};
|
||||
var panel=function(ic,id,t,body,extra,bg){return '<section id="'+id+'" class="border-2 border-black bg-white" aria-labelledby="t-'+id+'"><div class="flex flex-wrap items-center justify-between gap-3 border-b-2 border-black p-4 '+(bg||'')+'"><h2 id="t-'+id+'" class="flex items-center gap-2 text-lg font-black">'+I(ic)+t+'</h2>'+(extra||'')+'</div>'+body+'</section>';};
|
||||
var kpi=function(k,v,d,bar){return '<li class="flex flex-col border-2 border-black bg-white p-4"><div class="flex items-center justify-between gap-2"><p class="text-sm font-bold">'+k+'</p><span class="h-2.5 w-2.5 '+bar+'"></span></div><p class="mt-2 font-mono text-3xl font-semibold leading-none">'+v+'</p><p class="mt-3 text-xs font-bold">'+d+'</p></li>';};
|
||||
var btn=function(t,ic,cls){return '<button type="button" class="inline-flex h-11 items-center gap-2 border-2 border-black px-4 text-sm font-extrabold '+(cls||'bg-white hover:bg-[#FFFBEA]')+'">'+(ic?I(ic):'')+t+'</button>';};
|
||||
var shell=function(aside,title,kicker,sub,actions,body){return '\n <div class="border-b-2 border-black bg-[#F6F5F1]"><div class="mx-auto grid max-w-[1600px] lg:grid-cols-[240px_minmax(0,1fr)]"><aside class="border-b-2 border-black bg-white p-5 lg:border-b-0 lg:border-r-2">'+aside+'</aside><div class="min-w-0 p-5 lg:p-8"><div class="flex flex-wrap items-end justify-between gap-4"><div><p class="font-mono text-xs font-semibold">'+kicker+'</p><h1 class="mt-1 text-4xl font-black tracking-tight">'+title+'</h1><p class="mt-1 font-semibold">'+sub+'</p></div><div class="flex flex-wrap gap-3">'+actions+'</div></div>'+body+'</div></div></div>\n';};
|
||||
var P={accueil:'Apercu%20accueil%20Blade.html','labs.index':'apercu-labs.html','labs.essai':'apercu-lab-essai.html','labs.web':'apercu-lab-web.html','cours.index':'apercu-cours.html','cours.cm':'apercu-cours-ipv4-cm.html',etablissements:'apercu-etablissements.html',tarifs:'apercu-tarifs.html',login:'apercu-connexion.html',register:'apercu-inscription.html',examen:'apercu-examen.html',suivi:'apercu-suivi.html',pourquoi:'apercu-pourquoi.html',fonctionnalites:'apercu-fonctionnalites.html',legal:'apercu-legal.html',banque:'apercu-banque.html',ide:'apercu-ide.html',bibliotheque:'apercu-bibliotheque.html',generateur:'apercu-generateur.html','quiz.projection':'apercu-quiz-projection.html','quiz.eleve':'apercu-quiz-eleve.html',devoirs:'apercu-devoirs.html',maison:'apercu-maison.html','td.imprimable':'apercu-td-imprimable.html',cockpit:'apercu-cockpit.html','espace.eleve':'apercu-espace-eleve.html','vie.scolaire':'apercu-vie-scolaire.html','fiche.eleve':'apercu-fiche-eleve.html',correction:'apercu-correction.html','sujet.creer':'apercu-sujet.html',messagerie:'apercu-messagerie.html','export.ent':'apercu-export.html',aide:'apercu-aide.html','cours.fiche':'apercu-cours-fiche.html',paiement:'apercu-paiement.html','paiement.ok':'apercu-paiement-ok.html',facturation:'apercu-facturation.html',academie:'apercu-academie.html'};
|
||||
var R={};Object.keys(P).forEach(function(k){R[P[k]]=k;});
|
||||
var toBlade=function(s){return s.replace(/href="([^"#:]+?\.html)(#[^"]*)?"/g,function(m,u,x){return R[u]?'href="{{ route(\''+R[u]+'\') }}'+(x||'')+'"':m;}).replace(/src="(images\/[^"]+|js\/[^"]+)"/g,"src=\"{{ asset('$1') }}\"");};
|
||||
4
design/_build/pro.js
Normal file
4
design/_build/pro.js
Normal file
|
|
@ -0,0 +1,4 @@
|
|||
var rot=/^(?:[a-z0-9]+:)?-?rotate-(?:1|2|3|6|12|\[[^\]]+\])$/,tr=/^(?:(?:sm|md|lg|xl|2xl):)?-?translate-[xy]-(?:3|4|6|8|10|12|16)$/;var fix=h=>{h=h.replace(/Parce qu’un BTS peut changer une vie\. Il a changé la mienne\./g,'Parce que les études peuvent changer une vie. Elles ont changé la mienne, pourquoi pas la vôtre ?');
|
||||
h=h.replace(/<span[^>]*class="[^"]*(?:etoile flotte|zigzag absolute)[^"]*"[^>]*><\/span>/g,'');
|
||||
h=h.replace(/class="([^"]*)"/g,(m,c)=>'class="'+c.split(/\s+/).filter(x=>x&&!rot.test(x)&&!tr.test(x)).map(x=>x.replace(/^((?:[a-z]+:)?)shadow-\[(?:6|8|10)px_(?:6|8|10)px_0px_(#[0-9A-Fa-f]+)\]$/,'$1shadow-[4px_4px_0px_$2]').replace(/^xl:text-8xl$/,'xl:text-7xl').replace(/^xl:text-\[7\.5rem\]$/,'xl:text-7xl')).join(' ')+'"');
|
||||
return h.replace(/'lg:translate-y-4'|'lg:translate-y-6'/g,"''");};
|
||||
24
design/_build/sy.js
Normal file
24
design/_build/sy.js
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
// Générateur des pages vitrine épurées (utilisé uniquement à la construction)
|
||||
var SY = (function () {
|
||||
var INK = '#0b1220', TXT = '#3c4043', MUT = '#5f6368', BLUE = '#0b57d0', HAIR = '#e3e5e8', SOFT = '#f8f9fa';
|
||||
var P = { accueil: 'Apercu%20accueil%20Blade.html', register: 'apercu-inscription.html', login: 'apercu-connexion.html', tarifs: 'apercu-tarifs.html', etablissements: 'apercu-etablissements.html', fonctionnalites: 'apercu-fonctionnalites.html', 'cours.index': 'apercu-cours.html', 'labs.essai': 'apercu-lab-essai.html', 'td.imprimable': 'apercu-td-imprimable.html', 'cours.fiche': 'apercu-cours-fiche.html', legal: 'apercu-legal.html', pourquoi: 'apercu-pourquoi.html', 'espace.etablissement': 'apercu-espace-etablissement.html', integration: 'apercu-integration.html', aide: 'apercu-aide.html', ressource: 'apercu-ressource.html' };
|
||||
var mk = function (blade) {
|
||||
var u = function (r, q) { return blade ? "{{ route('" + r + "') }}" + (q || '') : P[r] + (q || ''); };
|
||||
var S = {
|
||||
u: u,
|
||||
wrap: function (w, inner, pad, bg) { return '<section style="padding:' + (pad || '112px 20px') + ';background:' + (bg || '#fff') + '"><div style="max-width:' + w + 'px;margin:0 auto">' + inner + '</div></section>'; },
|
||||
kicker: function (t, center) { return '<p style="margin:0;font-size:15px;font-weight:700;color:' + BLUE + (center ? ';text-align:center' : '') + '">' + t + '</p>'; },
|
||||
h1: function (t) { return '<h1 style="margin:20px 0 0;font-size:clamp(40px,6vw,72px);line-height:1.04;font-weight:800;letter-spacing:-0.03em;color:' + INK + ';text-align:center;text-wrap:balance">' + t + '</h1>'; },
|
||||
h2: function (t, center) { return '<h2 style="margin:12px 0 0;font-size:clamp(30px,4vw,44px);line-height:1.1;font-weight:800;letter-spacing:-0.02em;color:' + INK + (center ? ';text-align:center' : '') + ';text-wrap:balance">' + t + '</h2>'; },
|
||||
lead: function (t, center) { return '<p style="margin:24px ' + (center ? 'auto' : '0') + ' 0;max-width:660px;font-size:20px;line-height:1.6;font-weight:500;color:' + TXT + (center ? ';text-align:center' : '') + ';text-wrap:pretty">' + t + '</p>'; },
|
||||
cta: function (t, href, note) { return '<div style="margin-top:44px;display:flex;flex-direction:column;align-items:center;gap:14px"><a href="' + href + '" style="display:inline-flex;align-items:center;height:56px;padding:0 32px;border-radius:999px;background:' + BLUE + ';color:#fff;font-size:17px;font-weight:700;text-decoration:none">' + t + '</a>' + (note ? '<p style="margin:0;font-size:14px;font-weight:600;color:' + MUT + '">' + note + '</p>' : '') + '</div>'; },
|
||||
link: function (t, href) { return '<a href="' + href + '" style="font-size:16px;font-weight:700;color:' + BLUE + ';text-decoration:none">' + t + '</a>'; },
|
||||
cols: function (items, min) { return '<ul style="margin:56px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(' + (min || 240) + 'px,1fr));gap:56px 48px">' + items.map(function (it) { return '<li>' + (it.k ? '<p style="margin:0;font-size:' + (it.big ? '40px' : '14px') + ';font-weight:800;color:' + BLUE + ';letter-spacing:-0.01em">' + it.k + '</p>' : '') + '<h3 style="margin:' + (it.k ? '12px' : '0') + ' 0 0;font-size:20px;font-weight:800;letter-spacing:-0.01em;color:' + INK + '">' + it.t + '</h3>' + (it.d ? '<p style="margin:10px 0 0;font-size:16px;line-height:1.65;font-weight:500;color:' + TXT + '">' + it.d + '</p>' : '') + (it.a ? '<p style="margin:16px 0 0">' + S.link(it.a[0], it.a[1]) + '</p>' : '') + '</li>'; }).join('') + '</ul>'; },
|
||||
steps: function (items) { return '<ol style="margin:48px 0 0;padding:0;list-style:none;display:grid;gap:28px">' + items.map(function (s, i) { return '<li style="display:grid;grid-template-columns:56px 1fr;gap:16px;align-items:baseline"><span style="font-size:28px;font-weight:800;color:' + BLUE + ';font-variant-numeric:tabular-nums">' + String(i + 1).padStart(2, '0') + '</span><div><p style="margin:0;font-size:20px;font-weight:700;color:' + INK + '">' + s[0] + '</p>' + (s[1] ? '<p style="margin:6px 0 0;font-size:16px;line-height:1.6;font-weight:500;color:' + TXT + '">' + s[1] + '</p>' : '') + '</div></li>'; }).join('') + '</ol>'; },
|
||||
frame: function (inner) { return '<div style="margin-top:72px;border-radius:24px;overflow:hidden;background:#fff;border:1px solid ' + HAIR + ';box-shadow:0 1px 2px rgba(15,23,42,.06),0 24px 48px -24px rgba(15,23,42,.18)">' + inner + '</div>'; },
|
||||
INK: INK, TXT: TXT, MUT: MUT, BLUE: BLUE, HAIR: HAIR, SOFT: SOFT
|
||||
};
|
||||
return S;
|
||||
};
|
||||
return { mk: mk };
|
||||
})();
|
||||
Loading…
Add table
Add a link
Reference in a new issue