YvvandClaude Opus 5.5
28a6daf382
Règle f, selon la précision de DA du 03/11 après 17h35 : au-dessus d'un oiseau perché, le vide
se mesure du haut de son dessin jusqu'à la plus basse ligne de texte ou au plus bas bloc qui
passe au-dessus de sa largeur peinte. Les lignes de son propre titre comptent, et l'en-tête
collant aussi en haut de page. Quinze perchés en défaut sur bb8fad9 changent de pose, sans
sortir de la liste fermée :
- accueil :
- le DJ se tient derrière le pupitre de la console, seule sa tête dépasse ;
- l'accordéoniste passe en S, visible à partir de 1200 px ;
- la factrice passe à 76 px ;
- la lectrice sort 20 px plus bas ;
- au téléphone, l'oiseau de l'intitulé est un oiseau plat : codeuse, maraîchère, potier, et le
cycliste livreur sur productions collectives ;
- authentification, tarifs de l'eau, commande : en marge droite, sur l'arête haute de la carte ;
- en musique : le danseur passe en S ;
- évènement :
- l'acrobate se tient avant la devise ;
- le régisseur passe en S, posé sur l'arête des cartes ;
- le clown passe en M ;
- le marionnettiste se tient sur le filet du pied de page (option 1 d'orch). Son décalage
est tiré de --seal-block, le bloc du sceau défini dans le layout ;
- chapitres : le calligraphe se tient sur le filet du titre, le typographe sur celui de la
navigation, le cartonnier en marge des boutons. Plus aucune hauteur en %.
Règle g, rectangle du bloc (décision d'orch) : le porteur de serveur et l'administrateur réseau
sortent de la découpe des coins arrondis.
La liste fermée (docs/da-oiseaux.md) reçoit les précisions d'orch :
- e vaut pour un oiseau « libre » dont le centre sort de son bloc ;
- g se mesure sur le rectangle du bloc ;
- un oiseau derrière une carte reste « derrière ».
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
60 lines
1.9 KiB
Vue
60 lines
1.9 KiB
Vue
<template>
|
||
<div class="app-layout grid grid-cols-1 min-h-dvh">
|
||
<LayoutTheHeader />
|
||
<main class="app-main">
|
||
<slot />
|
||
|
||
<!-- 益 Yì (Increase, #42) — sceau hexagramme (traits épais, coins nets, ~carré) -->
|
||
<svg class="app-seal" viewBox="0 0 112 105" fill="currentColor" aria-hidden="true">
|
||
<!-- Line 6 (top) — yang -->
|
||
<rect x="6" y="6" width="100" height="8"/>
|
||
<!-- Line 5 — yang -->
|
||
<rect x="6" y="23" width="100" height="8"/>
|
||
<!-- Line 4 — yin -->
|
||
<rect x="6" y="40" width="42" height="8"/>
|
||
<rect x="64" y="40" width="42" height="8"/>
|
||
<!-- Line 3 — yin -->
|
||
<rect x="6" y="57" width="42" height="8"/>
|
||
<rect x="64" y="57" width="42" height="8"/>
|
||
<!-- Line 2 — yin -->
|
||
<rect x="6" y="74" width="42" height="8"/>
|
||
<rect x="64" y="74" width="42" height="8"/>
|
||
<!-- Line 1 (bottom) — yang -->
|
||
<rect x="6" y="91" width="100" height="8"/>
|
||
</svg>
|
||
</main>
|
||
<LayoutTheFooter />
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
useScrollTracking()
|
||
</script>
|
||
|
||
<style scoped>
|
||
.app-layout {
|
||
grid-template-rows: auto 1fr auto;
|
||
}
|
||
|
||
/* The seal's block, between the page and the footer: a bird of a page that stands on the footer's
|
||
top rule takes its offset from here (evenement, the puppeteer) */
|
||
.app-main {
|
||
--seal-w: 44px;
|
||
--seal-mt: 2rem;
|
||
--seal-mb: 1rem;
|
||
--seal-block: calc(var(--seal-mt) + var(--seal-w) * 105 / 112 + var(--seal-mb));
|
||
}
|
||
|
||
/* === Seal — 益 Yì (Increase) === */
|
||
.app-seal {
|
||
display: block;
|
||
width: var(--seal-w);
|
||
/* its height follows the viewBox: width × 105 / 112 (in --seal-block) */
|
||
margin: var(--seal-mt) 1.5rem var(--seal-mb) auto;
|
||
color: hsl(var(--color-accent));
|
||
opacity: 0.28;
|
||
filter: drop-shadow(1px 1px 0.5px rgba(0,0,0,0.25))
|
||
drop-shadow(-0.5px -0.5px 0.5px rgba(255,255,255,0.15));
|
||
}
|
||
</style>
|