identité 2 : un oiseau perché seulement où il y a du vide au-dessus, l'en-tête tient à 768 px
Avis du studio DA du 03/11 (07h00) et relecture de 8ccdda3 :
- règle du perché : il faut au-dessus de l'arête un vide au moins égal à la hauteur
de l'oiseau, sinon il va en marge ou derrière la carte. Les perchés entre cartes
rapprochées (numérique, logiciel-libre, économique, sommaire du livre, commande,
citoyenne, événement) passent en marge, derrière, ou partent ;
- productions-collectives : 8 oiseaux ramenés à 4, sans colonne ni chevauchement.
Les oiseaux retirés vont sur des pages qui en avaient peu : monnaie-libre
(boulangère, vigneronne), tarifs-eau (potier), décision (tisserand),
cloud-libre (imprimeuse 3D). Les 61 restent rendus ;
- pas trois oiseaux sur la même verticale (commande, numérique) ;
- au téléphone, l'oiseau de la page se tient au bout de la ligne de l'intitulé ;
- seuil 1024 pour un perché dont le bloc n'a de vide au-dessus qu'en deux colonnes
(accordéoniste et factrice de l'accueil) ;
- numerique/[slug] : les oiseaux des sections larges tiennent dans 152 px de marge
à 1200 px ;
- en-tête : de 768 à 1023 px, boutons resserrés au lieu d'un débordement ; le
logotype du kit ne change pas.
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
@@ -13,8 +13,11 @@
|
||||
// libre placed only by left / right / top / bottom (an empty area next to its block)
|
||||
//
|
||||
// Birds in the margin, behind a block or free need room around the column: they show from
|
||||
// 1200 px wide, the perched ones from 768 px (`seuil` overrides); under 768 px, only a bird
|
||||
// marked `mobile`.
|
||||
// 1200 px wide, the perched ones from 768 px (`seuil` overrides, for instance 1024 for a perched
|
||||
// bird whose block has no void above it until the grid splits in two); under 768 px, only a
|
||||
// bird marked `mobile`.
|
||||
// A perched bird needs, above its edge, a void at least as tall as itself (DA rule of 03/11);
|
||||
// where blocks stand close, the bird goes in the margin or behind the block.
|
||||
//
|
||||
// Drawing rules of the studio DA (kit README, §2.5): one colour (currentColor), proportions
|
||||
// intact and never cropped, 72 px wide at least, opacity 0.18-0.28 next to text and 0.10-0.14
|
||||
@@ -42,7 +45,7 @@ const props = withDefaults(defineProps<{
|
||||
mobileSeul?: boolean
|
||||
/** Narrowest window (px) where the bird shows: 1200 by default for the margin, behind
|
||||
* and free poses, 768 for a perched bird */
|
||||
seuil?: 768 | 1200
|
||||
seuil?: 768 | 1024 | 1200
|
||||
ton?: 'primary' | 'accent'
|
||||
op?: number
|
||||
}>(), { pose: 'perche', w: 80, ecart: '2.5rem', ton: 'primary' })
|
||||
@@ -73,6 +76,7 @@ const classes = computed(() => [
|
||||
'oiseau-pose--mobile': props.mobile || props.mobileSeul,
|
||||
'oiseau-pose--mobile-seul': props.mobileSeul,
|
||||
'oiseau-pose--large': (props.seuil ?? (props.pose === 'perche' ? 768 : 1200)) >= 1200,
|
||||
'oiseau-pose--moyen': props.seuil === 1024,
|
||||
'oiseau-pose--accent': props.ton === 'accent',
|
||||
},
|
||||
])
|
||||
@@ -122,6 +126,12 @@ const classes = computed(() => [
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1023px) {
|
||||
.oiseau-pose--moyen {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.oiseau-pose--mobile-seul {
|
||||
display: none;
|
||||
|
||||
Reference in New Issue
Block a user