873 lines
25 KiB
Plaintext
873 lines
25 KiB
Plaintext
---
|
||
import GlossaryLayout from "../../layouts/GlossaryLayout.astro";
|
||
|
||
const sections = [
|
||
{
|
||
id: "mise-en-scene",
|
||
title: "Verbes de mise en scène d’archicration",
|
||
intro:
|
||
"Ces verbes décrivent l’ouverture analytique de la scène : rendre visible, rendre adressable, ouvrir un format d’épreuve, exposer une décision ou un dispositif à la discussion instituée.",
|
||
items: [
|
||
{
|
||
index: "01",
|
||
term: "Mettre en scène d’archicration",
|
||
definition:
|
||
"Exposer un pouvoir, une décision, un fondement ou un dispositif à une épreuve instituée.",
|
||
example:
|
||
"Dans certaines procédures administratives, la décision est effectivement mise en scène d’archicration, même si l’épreuve reste très encadrée.",
|
||
},
|
||
{
|
||
index: "02",
|
||
term: "Exposer à l’épreuve",
|
||
definition:
|
||
"Rendre une décision, une norme, un critère, un acteur ou un dispositif susceptible d’être discuté, évalué, confronté.",
|
||
example:
|
||
"Les paramètres du modèle sont exposés à l’épreuve dans une procédure contradictoire.",
|
||
},
|
||
{
|
||
index: "03",
|
||
term: "Rendre visible en scène",
|
||
definition:
|
||
"Permettre que les mécanismes de décision apparaissent dans un espace où ils peuvent être observés, compris et discutés.",
|
||
example:
|
||
"La commission rend enfin visible en scène le travail des experts.",
|
||
},
|
||
{
|
||
index: "04",
|
||
term: "Rendre adressable",
|
||
definition:
|
||
"Rendre possible l’adresse d’une plainte, d’une contestation ou d’une demande à un destinataire identifiable.",
|
||
example:
|
||
"L’agence rend les décisions plus adressables en désignant clairement les responsables de la procédure.",
|
||
},
|
||
{
|
||
index: "05",
|
||
term: "Ouvrir une scène",
|
||
definition:
|
||
"Instaurer un lieu, un temps, un format où une épreuve d’archicration peut se dérouler.",
|
||
example:
|
||
"L’institution a ouvert une scène dédiée aux contestations des usagers.",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: "difficulte-dacces",
|
||
title: "Verbes de difficulté d’accès à la scène",
|
||
intro:
|
||
"Ces verbes décrivent non pas encore la fermeture totale, mais l’éloignement, la fragilisation ou la sélection asymétrique de l’accès à la scène.",
|
||
items: [
|
||
{
|
||
index: "06",
|
||
term: "Rendre difficile la mise en scène",
|
||
definition:
|
||
"Créer des conditions techniques, institutionnelles ou symboliques qui compliquent l’instauration d’une épreuve.",
|
||
example:
|
||
"La fragmentation des opérateurs rend difficile la mise en scène d’une contestation collective.",
|
||
},
|
||
{
|
||
index: "07",
|
||
term: "Entraver la mise en épreuve",
|
||
definition:
|
||
"Limiter explicitement ou implicitement la possibilité de mettre quelque chose en archicration.",
|
||
example:
|
||
"La confidentialité excessive entrave la mise en épreuve de la décision.",
|
||
},
|
||
{
|
||
index: "08",
|
||
term: "Distendre la scène",
|
||
definition:
|
||
"Rendre la scène d’épreuve distante, abstraite, inaccessible dans le temps ou dans l’espace.",
|
||
example:
|
||
"La procédure européenne distend la scène en éloignant les lieux de recours.",
|
||
},
|
||
{
|
||
index: "09",
|
||
term: "Filtrer l’accès à la scène",
|
||
definition:
|
||
"Imposer des conditions de compétence, de statut ou de ressources qui limitent les participants possibles.",
|
||
example:
|
||
"Le comité technique filtre l’accès à la scène au profit des experts.",
|
||
},
|
||
{
|
||
index: "10",
|
||
term: "Maintenir hors-scène",
|
||
definition:
|
||
"Laisser des dimensions essentielles d’une décision hors des formats où elles pourraient être discutées.",
|
||
example:
|
||
"Les choix budgétaires sont maintenus hors-scène, relégués aux coulisses de la gestion.",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: "fermeture-capture",
|
||
title: "Verbes de fermeture, d’oblitération ou de capture scénique",
|
||
intro:
|
||
"Ici, il ne s’agit plus seulement d’accès difficile mais de mécanismes actifs de neutralisation de l’épreuve. Le lexique insiste d’ailleurs sur la nécessité de ne pas confondre capturer, fermer, déplacer, saturer ou simuler une scène.",
|
||
items: [
|
||
{
|
||
index: "11",
|
||
term: "Oblitérer la scène",
|
||
definition:
|
||
"Conserver l’apparence d’une scène d’épreuve tout en vidant son efficacité.",
|
||
example:
|
||
"La consultation publique oblitère la scène : elle existe formellement mais n’a aucune prise réelle.",
|
||
},
|
||
{
|
||
index: "12",
|
||
term: "Capturer la scène",
|
||
definition:
|
||
"Contrôler entièrement le déroulement, les critères et les issues de l’épreuve, de sorte qu’elle ne puisse réellement déstabiliser le dispositif.",
|
||
example:
|
||
"Le comité interne capture la scène d’évaluation, qui devient autoréférentielle.",
|
||
},
|
||
{
|
||
index: "13",
|
||
term: "Fermer la scène",
|
||
definition:
|
||
"Supprimer les formats d’épreuve ou rendre impossible toute confrontation effective.",
|
||
example:
|
||
"La réforme ferme la scène en remplaçant les audiences par des décisions automatisées.",
|
||
},
|
||
{
|
||
index: "14",
|
||
term: "Déplacer la scène",
|
||
definition:
|
||
"Transférer l’espace d’épreuve dans un lieu technique ou opaque qui échappe aux personnes concernées.",
|
||
example:
|
||
"La scène de décision a été déplacée dans les algorithmes de scoring.",
|
||
},
|
||
{
|
||
index: "15",
|
||
term: "Saturer la scène",
|
||
definition:
|
||
"Produire un volume de normes, de critères, de procédures ou de données tel que l’épreuve devient impraticable ou illisible.",
|
||
example:
|
||
"L’avalanche de documents sature la scène et neutralise toute possibilité de contradiction.",
|
||
},
|
||
{
|
||
index: "16",
|
||
term: "Simuler une scène",
|
||
definition:
|
||
"Mettre en forme un rituel d’épreuve qui n’ouvre aucune possibilité réelle de reconfiguration.",
|
||
example:
|
||
"Le débat télévisé simule une scène sans produire aucune mise en épreuve effective.",
|
||
},
|
||
],
|
||
},
|
||
{
|
||
id: "verbes-ponts",
|
||
title: "Verbes-ponts entre scènes et archicrates",
|
||
intro:
|
||
"Ces verbes décrivent ce qui se joue dans la relation entre les détenteurs de prises régulatrices et les formats où ils doivent comparaître, répondre ou être mis en cause.",
|
||
items: [
|
||
{
|
||
index: "17",
|
||
term: "Répondre en scène",
|
||
definition:
|
||
"Être en position de devoir justifier, expliciter, défendre une décision dans un format institué.",
|
||
example:
|
||
"L’archicrate monétaire répond en scène lors de l’audition parlementaire.",
|
||
},
|
||
{
|
||
index: "18",
|
||
term: "Être mis en scène d’archicration",
|
||
definition:
|
||
"Être amené à comparaître ou à se justifier dans un cadre institué, avec effet possible sur le dispositif.",
|
||
example:
|
||
"Les autorités sanitaires ont été mises en scène d’archicration après l’incident.",
|
||
},
|
||
{
|
||
index: "19",
|
||
term: "Rendre possible une scène",
|
||
definition:
|
||
"Créer les conditions institutionnelles, pratiques, temporelles ou matérielles permettant à une épreuve d’avoir lieu.",
|
||
example:
|
||
"L’ouverture des données rend possible une scène d’examen externe.",
|
||
},
|
||
],
|
||
},
|
||
];
|
||
|
||
const totalCount = sections.reduce((sum, section) => sum + section.items.length, 0);
|
||
---
|
||
|
||
<GlossaryLayout
|
||
title="Verbes de la scène"
|
||
version="1.0"
|
||
stickyMode="glossary-portal"
|
||
>
|
||
<Fragment slot="aside">
|
||
<nav class="verbs-aside" aria-label="Navigation des verbes de la scène">
|
||
<div class="verbs-aside__block">
|
||
<a class="verbs-aside__back" href="/glossaire/">← Retour au glossaire</a>
|
||
<div class="verbs-aside__title">Verbes de la scène</div>
|
||
<div class="verbs-aside__meta">{totalCount} verbes cartographiés</div>
|
||
</div>
|
||
|
||
<div class="verbs-aside__block">
|
||
<h2 class="verbs-aside__heading">Dans cette page</h2>
|
||
<ul class="verbs-aside__list">
|
||
{sections.map((section) => (
|
||
<li><a href={`#${section.id}`}>{section.title}</a></li>
|
||
))}
|
||
</ul>
|
||
</div>
|
||
|
||
<div class="verbs-aside__block">
|
||
<h2 class="verbs-aside__heading">Renvois utiles</h2>
|
||
<ul class="verbs-aside__list">
|
||
<li><a href="/glossaire/scene-depreuve/">Scène d’épreuve</a></li>
|
||
<li><a href="/glossaire/archicration/">Archicration</a></li>
|
||
<li><a href="/glossaire/obliteration-archicratique/">Oblitération archicratique</a></li>
|
||
<li><a href="/glossaire/archicration-obliteree/">Archicration oblitérée</a></li>
|
||
<li><a href="/glossaire/synchrotopie/">Synchrotopie</a></li>
|
||
<li><a href="/glossaire/hypotopie/">Hypotopie</a></li>
|
||
<li><a href="/glossaire/hypertopie/">Hypertopie</a></li>
|
||
<li><a href="/glossaire/atopie/">Atopie</a></li>
|
||
</ul>
|
||
</div>
|
||
</nav>
|
||
</Fragment>
|
||
|
||
<section class="verbs-page" data-verbs-page>
|
||
<div class="verbs-hero glossary-page-hero" data-verbs-hero>
|
||
<p class="verbs-kicker">Mini-glossaire systémique</p>
|
||
<h1>Verbes de la scène archicratique</h1>
|
||
|
||
<p class="verbs-intro">
|
||
Cette page ne rassemble pas des notions de régime, de topologie ou de processus,
|
||
mais des verbes d’analyse. Elle sert à qualifier ce qui arrive à une scène :
|
||
comment elle s’ouvre, comment elle s’éloigne, comment elle se ferme,
|
||
comment elle est capturée, et comment un archicrate peut encore y répondre.
|
||
</p>
|
||
|
||
<div class="verbs-hero-collapsible">
|
||
<div
|
||
class="verbs-hero-more"
|
||
id="verbs-hero-more"
|
||
data-verbs-more
|
||
aria-hidden="false"
|
||
>
|
||
<p class="verbs-intro">
|
||
Elle constitue ainsi un outil de description fin, complémentaire des fiches
|
||
consacrées aux scènes, aux topologies et aux dynamiques archicratiques.
|
||
</p>
|
||
</div>
|
||
|
||
<button
|
||
class="verbs-hero-toggle"
|
||
id="verbs-hero-toggle"
|
||
data-verbs-more-toggle
|
||
type="button"
|
||
aria-controls="verbs-hero-more"
|
||
aria-expanded="false"
|
||
hidden
|
||
>
|
||
lire la suite
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
{sections.map((section) => (
|
||
<section class="verbs-section">
|
||
<div class="verbs-section__head">
|
||
<h2 id={section.id}>{section.title}</h2>
|
||
<span class="verbs-section__count">
|
||
{section.items.length} verbe{section.items.length > 1 ? "s" : ""}
|
||
</span>
|
||
</div>
|
||
|
||
<p class="verbs-section__intro">{section.intro}</p>
|
||
|
||
<div class="verbs-cards">
|
||
{section.items.map((item) => (
|
||
<article class="verbs-card">
|
||
<div class="verbs-card__index">{item.index}</div>
|
||
<h3>{item.term}</h3>
|
||
<p class="verbs-card__definition">{item.definition}</p>
|
||
<p class="verbs-card__example">
|
||
<strong>Exemple :</strong> {item.example}
|
||
</p>
|
||
</article>
|
||
))}
|
||
</div>
|
||
</section>
|
||
))}
|
||
|
||
<section class="verbs-section verbs-section--final">
|
||
<h2>Portée d’ensemble</h2>
|
||
<p>
|
||
Ces verbes permettent de distinguer plus finement les niveaux du paradigme :
|
||
une <a href="/glossaire/scene-depreuve/">scène</a> dit où quelque chose peut comparaître,
|
||
une topologie comme la <a href="/glossaire/synchrotopie/">synchrotopie</a> ou l’
|
||
<a href="/glossaire/atopie/">atopie</a> dit comment cela se distribue,
|
||
un processus comme la <a href="/glossaire/desarchicration/">désarchicration</a>
|
||
dit ce qui se transforme, et ces verbes disent ce qu’on fait concrètement à la scène.
|
||
</p>
|
||
</section>
|
||
</section>
|
||
|
||
<script is:inline>
|
||
(() => {
|
||
const boot = () => {
|
||
const body = document.body;
|
||
const root = document.documentElement;
|
||
const hero = document.querySelector("[data-verbs-hero]");
|
||
const follow = document.getElementById("reading-follow");
|
||
const heroMore = document.getElementById("verbs-hero-more");
|
||
const heroToggle = document.getElementById("verbs-hero-toggle");
|
||
|
||
if (!body || !root || !hero || !follow) return;
|
||
|
||
const BODY_CLASS = "is-verbes-de-la-scene-page";
|
||
const FOLLOW_ON_CLASS = "verbs-follow-on";
|
||
const EXPANDED_CLASS = "verbs-hero-expanded";
|
||
const mqMobile = window.matchMedia("(max-width: 860px)");
|
||
const AUTO_COLLAPSE_DELTA = 160;
|
||
|
||
let expandedAtY = null;
|
||
let lastScrollY = window.scrollY || 0;
|
||
|
||
body.classList.add(BODY_CLASS);
|
||
|
||
const heroHeight = () =>
|
||
Math.max(0, Math.round(hero.getBoundingClientRect().height || 0));
|
||
|
||
const stripLocalSticky = () => {
|
||
document.querySelectorAll(".verbs-section__head").forEach((el) => {
|
||
el.classList.remove("is-sticky");
|
||
el.removeAttribute("data-sticky-active");
|
||
});
|
||
};
|
||
|
||
const computeFollowOn = () =>
|
||
!mqMobile.matches &&
|
||
follow.classList.contains("is-on") &&
|
||
follow.style.display !== "none" &&
|
||
follow.getAttribute("aria-hidden") !== "true";
|
||
|
||
const applyLocalStickyHeight = () => {
|
||
const h = mqMobile.matches ? 0 : heroHeight();
|
||
|
||
if (typeof window.__archiSetLocalStickyHeight === "function") {
|
||
window.__archiSetLocalStickyHeight(h);
|
||
} else {
|
||
root.style.setProperty("--glossary-local-sticky-h", `${h}px`);
|
||
}
|
||
};
|
||
|
||
const syncFollowState = () => {
|
||
const on = computeFollowOn();
|
||
body.classList.toggle(FOLLOW_ON_CLASS, on);
|
||
return on;
|
||
};
|
||
|
||
const collapseHero = () => {
|
||
if (!body.classList.contains(EXPANDED_CLASS)) return;
|
||
|
||
body.classList.remove(EXPANDED_CLASS);
|
||
expandedAtY = null;
|
||
|
||
if (heroMore) {
|
||
heroMore.setAttribute("aria-hidden", "true");
|
||
}
|
||
|
||
if (heroToggle) {
|
||
heroToggle.hidden = false;
|
||
heroToggle.setAttribute("aria-expanded", "false");
|
||
}
|
||
|
||
try {
|
||
window.__archiUpdateFollow?.();
|
||
} catch {}
|
||
|
||
schedule();
|
||
};
|
||
|
||
const expandHero = () => {
|
||
body.classList.add(EXPANDED_CLASS);
|
||
expandedAtY = window.scrollY || 0;
|
||
|
||
if (heroMore) {
|
||
heroMore.setAttribute("aria-hidden", "false");
|
||
}
|
||
|
||
if (heroToggle) {
|
||
heroToggle.hidden = true;
|
||
heroToggle.setAttribute("aria-expanded", "true");
|
||
}
|
||
|
||
try {
|
||
window.__archiUpdateFollow?.();
|
||
} catch {}
|
||
|
||
schedule();
|
||
};
|
||
|
||
const syncHeroState = () => {
|
||
const followOn = computeFollowOn();
|
||
const expanded = body.classList.contains(EXPANDED_CLASS);
|
||
const collapsed = followOn && !expanded;
|
||
|
||
if (!followOn || mqMobile.matches) {
|
||
body.classList.remove(EXPANDED_CLASS);
|
||
expandedAtY = null;
|
||
|
||
if (heroMore) {
|
||
heroMore.setAttribute("aria-hidden", "false");
|
||
}
|
||
|
||
if (heroToggle) {
|
||
heroToggle.hidden = true;
|
||
heroToggle.setAttribute("aria-expanded", "false");
|
||
}
|
||
|
||
return;
|
||
}
|
||
|
||
if (heroMore) {
|
||
heroMore.setAttribute("aria-hidden", collapsed ? "true" : "false");
|
||
}
|
||
|
||
if (heroToggle) {
|
||
heroToggle.hidden = !collapsed;
|
||
heroToggle.setAttribute("aria-expanded", expanded ? "true" : "false");
|
||
}
|
||
};
|
||
|
||
const maybeAutoCollapseOnScroll = () => {
|
||
if (mqMobile.matches) {
|
||
lastScrollY = window.scrollY || 0;
|
||
return;
|
||
}
|
||
|
||
if (!computeFollowOn()) {
|
||
lastScrollY = window.scrollY || 0;
|
||
return;
|
||
}
|
||
|
||
if (!body.classList.contains(EXPANDED_CLASS)) {
|
||
lastScrollY = window.scrollY || 0;
|
||
return;
|
||
}
|
||
|
||
if (expandedAtY == null) {
|
||
lastScrollY = window.scrollY || 0;
|
||
return;
|
||
}
|
||
|
||
const currentY = window.scrollY || 0;
|
||
const scrollingDown = currentY > lastScrollY;
|
||
const delta = currentY - expandedAtY;
|
||
|
||
if (scrollingDown && delta >= AUTO_COLLAPSE_DELTA) {
|
||
collapseHero();
|
||
}
|
||
|
||
lastScrollY = currentY;
|
||
};
|
||
|
||
const syncAll = () => {
|
||
stripLocalSticky();
|
||
syncFollowState();
|
||
syncHeroState();
|
||
applyLocalStickyHeight();
|
||
};
|
||
|
||
let raf = 0;
|
||
const schedule = () => {
|
||
if (raf) return;
|
||
raf = requestAnimationFrame(() => {
|
||
raf = 0;
|
||
requestAnimationFrame(syncAll);
|
||
});
|
||
};
|
||
|
||
heroToggle?.addEventListener("click", () => {
|
||
expandHero();
|
||
});
|
||
|
||
const onScroll = () => {
|
||
maybeAutoCollapseOnScroll();
|
||
schedule();
|
||
};
|
||
|
||
const followObserver = new MutationObserver(schedule);
|
||
followObserver.observe(follow, {
|
||
attributes: true,
|
||
attributeFilter: ["class", "style", "aria-hidden"],
|
||
subtree: false,
|
||
});
|
||
|
||
const heroResizeObserver =
|
||
typeof ResizeObserver !== "undefined"
|
||
? new ResizeObserver(schedule)
|
||
: null;
|
||
|
||
heroResizeObserver?.observe(hero);
|
||
|
||
window.addEventListener("scroll", onScroll, { passive: true });
|
||
window.addEventListener("resize", schedule);
|
||
window.addEventListener("pageshow", schedule);
|
||
|
||
if (document.fonts?.ready) {
|
||
document.fonts.ready.then(schedule).catch(() => {});
|
||
}
|
||
|
||
if (mqMobile.addEventListener) {
|
||
mqMobile.addEventListener("change", schedule);
|
||
} else if (mqMobile.addListener) {
|
||
mqMobile.addListener(schedule);
|
||
}
|
||
|
||
schedule();
|
||
};
|
||
|
||
if (document.readyState === "loading") {
|
||
document.addEventListener("DOMContentLoaded", boot, { once: true });
|
||
} else {
|
||
boot();
|
||
}
|
||
})();
|
||
</script>
|
||
</GlossaryLayout>
|
||
|
||
<style>
|
||
.verbs-page{
|
||
padding: 8px 0 24px;
|
||
}
|
||
|
||
.verbs-hero{
|
||
position: sticky;
|
||
top: calc(var(--sticky-header-h, 0px) + var(--page-gap, 12px));
|
||
z-index: 11;
|
||
margin: 0 0 24px;
|
||
padding: 18px 18px 20px;
|
||
border: 1px solid rgba(127,127,127,0.18);
|
||
border-radius: 28px;
|
||
background:
|
||
linear-gradient(180deg, rgba(0,0,0,0.60), rgba(0,0,0,0.92)),
|
||
radial-gradient(900px 240px at 20% 0%, rgba(0,217,255,0.08), transparent 60%);
|
||
backdrop-filter: blur(10px);
|
||
-webkit-backdrop-filter: blur(10px);
|
||
display: grid;
|
||
row-gap: 14px;
|
||
transition:
|
||
margin-bottom 180ms ease,
|
||
border-radius 180ms ease,
|
||
padding 180ms ease,
|
||
row-gap 180ms ease;
|
||
}
|
||
|
||
.verbs-kicker{
|
||
margin: 0;
|
||
font-size: 12px;
|
||
letter-spacing: .08em;
|
||
text-transform: uppercase;
|
||
opacity: .72;
|
||
}
|
||
|
||
.verbs-hero h1{
|
||
margin: 0;
|
||
font-size: clamp(2.2rem, 4vw, 3.15rem);
|
||
line-height: 1.02;
|
||
letter-spacing: -.04em;
|
||
font-weight: 850;
|
||
transition: font-size 180ms ease;
|
||
}
|
||
|
||
.verbs-intro{
|
||
max-width: 76ch;
|
||
margin: 0;
|
||
font-size: 1.04rem;
|
||
line-height: 1.55;
|
||
opacity: .94;
|
||
transition:
|
||
font-size 180ms ease,
|
||
line-height 180ms ease,
|
||
max-width 180ms ease;
|
||
}
|
||
|
||
.verbs-hero-collapsible{
|
||
display: grid;
|
||
row-gap: 6px;
|
||
}
|
||
|
||
.verbs-hero-more{
|
||
display: grid;
|
||
row-gap: 14px;
|
||
max-height: 12rem;
|
||
overflow: hidden;
|
||
opacity: 1;
|
||
transition:
|
||
max-height 220ms ease,
|
||
opacity 180ms ease;
|
||
}
|
||
|
||
.verbs-hero-toggle{
|
||
display: none;
|
||
align-self: flex-start;
|
||
width: fit-content;
|
||
margin: 0;
|
||
padding: 0;
|
||
border: 0;
|
||
background: transparent;
|
||
color: inherit;
|
||
font: inherit;
|
||
font-size: 11px;
|
||
line-height: 1.2;
|
||
letter-spacing: .01em;
|
||
text-transform: none;
|
||
opacity: .56;
|
||
cursor: pointer;
|
||
text-decoration: underline;
|
||
text-underline-offset: .12em;
|
||
text-decoration-thickness: 1px;
|
||
}
|
||
|
||
.verbs-hero-toggle:hover{
|
||
opacity: .84;
|
||
}
|
||
|
||
.verbs-hero-toggle:focus-visible{
|
||
outline: 2px solid rgba(0,217,255,0.24);
|
||
outline-offset: 4px;
|
||
border-radius: 4px;
|
||
}
|
||
|
||
.verbs-hero-toggle[hidden]{
|
||
display: none !important;
|
||
}
|
||
|
||
.verbs-section{
|
||
margin-top: 34px;
|
||
scroll-margin-top: calc(var(--sticky-offset-px, 96px) + 28px);
|
||
}
|
||
|
||
.verbs-section h2{
|
||
scroll-margin-top: calc(var(--sticky-offset-px, 96px) + 28px);
|
||
}
|
||
|
||
.verbs-section__head{
|
||
display: flex;
|
||
align-items: baseline;
|
||
justify-content: space-between;
|
||
gap: 12px;
|
||
flex-wrap: wrap;
|
||
margin-bottom: 10px;
|
||
position: static;
|
||
}
|
||
|
||
.verbs-section__count{
|
||
font-size: 13px;
|
||
opacity: .72;
|
||
white-space: nowrap;
|
||
}
|
||
|
||
.verbs-section__intro{
|
||
max-width: 78ch;
|
||
margin: 0;
|
||
opacity: .92;
|
||
}
|
||
|
||
.verbs-cards{
|
||
display: grid;
|
||
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
|
||
gap: 12px;
|
||
margin-top: 14px;
|
||
}
|
||
|
||
.verbs-card{
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 8px;
|
||
padding: 14px 16px;
|
||
border: 1px solid rgba(127,127,127,0.22);
|
||
border-radius: 16px;
|
||
background: rgba(127,127,127,0.05);
|
||
transition: background 120ms ease, border-color 120ms ease, transform 120ms ease;
|
||
}
|
||
|
||
.verbs-card:hover{
|
||
transform: translateY(-1px);
|
||
background: rgba(127,127,127,0.08);
|
||
border-color: rgba(0,217,255,0.16);
|
||
}
|
||
|
||
.verbs-card__index{
|
||
font-size: 12px;
|
||
line-height: 1.3;
|
||
font-weight: 800;
|
||
letter-spacing: .08em;
|
||
opacity: .72;
|
||
}
|
||
|
||
.verbs-card h3{
|
||
margin: 0;
|
||
font-size: 15px;
|
||
line-height: 1.3;
|
||
}
|
||
|
||
.verbs-card__definition,
|
||
.verbs-card__example{
|
||
margin: 0;
|
||
font-size: 14px;
|
||
line-height: 1.5;
|
||
opacity: .92;
|
||
}
|
||
|
||
.verbs-section--final{
|
||
margin-top: 42px;
|
||
}
|
||
|
||
.verbs-aside{
|
||
display: flex;
|
||
flex-direction: column;
|
||
gap: 14px;
|
||
}
|
||
|
||
.verbs-aside__block{
|
||
border: 1px solid rgba(127,127,127,0.22);
|
||
border-radius: 16px;
|
||
padding: 12px;
|
||
background: rgba(127,127,127,0.05);
|
||
}
|
||
|
||
.verbs-aside__back{
|
||
display: inline-block;
|
||
margin-bottom: 8px;
|
||
font-size: 13px;
|
||
font-weight: 700;
|
||
text-decoration: none;
|
||
}
|
||
|
||
.verbs-aside__title{
|
||
font-size: 14px;
|
||
font-weight: 800;
|
||
letter-spacing: .2px;
|
||
line-height: 1.25;
|
||
}
|
||
|
||
.verbs-aside__meta{
|
||
margin-top: 8px;
|
||
font-size: 12px;
|
||
line-height: 1.35;
|
||
opacity: .78;
|
||
}
|
||
|
||
.verbs-aside__heading{
|
||
margin: 0 0 10px;
|
||
font-size: 13px;
|
||
font-weight: 800;
|
||
opacity: .9;
|
||
}
|
||
|
||
.verbs-aside__list{
|
||
list-style: none;
|
||
margin: 0;
|
||
padding: 0;
|
||
}
|
||
|
||
.verbs-aside__list li{
|
||
margin: 6px 0;
|
||
}
|
||
|
||
.verbs-aside__list a{
|
||
text-decoration: none;
|
||
font-size: 13px;
|
||
line-height: 1.3;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page #reading-follow){
|
||
z-index: 10;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page.verbs-follow-on .verbs-hero){
|
||
margin-bottom: 0;
|
||
padding: 12px 16px 14px;
|
||
row-gap: 10px;
|
||
border-bottom-left-radius: 0;
|
||
border-bottom-right-radius: 0;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page.verbs-follow-on .verbs-hero h1){
|
||
font-size: clamp(1.9rem, 3.2vw, 2.55rem);
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page.verbs-follow-on .verbs-intro){
|
||
max-width: 68ch;
|
||
font-size: .98rem;
|
||
line-height: 1.48;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page.verbs-follow-on:not(.verbs-hero-expanded) .verbs-hero-more){
|
||
max-height: 0;
|
||
opacity: 0;
|
||
overflow: hidden;
|
||
pointer-events: none;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page.verbs-follow-on:not(.verbs-hero-expanded) .verbs-hero-toggle){
|
||
display: inline-flex;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page.verbs-follow-on #reading-follow .reading-follow__inner){
|
||
border-top-left-radius: 0;
|
||
border-top-right-radius: 0;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page .verbs-section__head.is-sticky),
|
||
:global(body.is-verbes-de-la-scene-page .verbs-section__head[data-sticky-active="true"]){
|
||
position: static !important;
|
||
top: auto !important;
|
||
z-index: auto !important;
|
||
padding: 0 !important;
|
||
border: 0 !important;
|
||
background: transparent !important;
|
||
box-shadow: none !important;
|
||
backdrop-filter: none !important;
|
||
-webkit-backdrop-filter: none !important;
|
||
}
|
||
|
||
@media (max-width: 860px){
|
||
.verbs-hero{
|
||
position: static;
|
||
border-radius: 22px;
|
||
margin-bottom: 20px;
|
||
padding: 14px 14px 16px;
|
||
row-gap: 12px;
|
||
}
|
||
|
||
.verbs-intro{
|
||
max-width: none;
|
||
}
|
||
|
||
.verbs-hero-more{
|
||
max-height: none;
|
||
opacity: 1;
|
||
overflow: visible;
|
||
}
|
||
|
||
.verbs-hero-toggle{
|
||
display: none !important;
|
||
}
|
||
|
||
:global(body.is-verbes-de-la-scene-page.verbs-follow-on .verbs-hero){
|
||
border-radius: 22px;
|
||
margin-bottom: 20px;
|
||
padding: 14px 14px 16px;
|
||
row-gap: 12px;
|
||
}
|
||
}
|
||
|
||
@media (prefers-color-scheme: dark){
|
||
.verbs-card,
|
||
.verbs-aside__block{
|
||
background: rgba(255,255,255,0.04);
|
||
}
|
||
|
||
.verbs-card:hover{
|
||
background: rgba(255,255,255,0.07);
|
||
}
|
||
}
|
||
</style> |