mirror of
https://github.com/IliesAllali/parenthese.git
synced 2026-11-12 00:12:14 +00:00
fix(invite): libellés courts de la barre famille sous 420 px
Sous 420 px, « Ajouter un souvenir » et « Ajouter une personne » passaient sur deux lignes : « Souvenir » et « Personne » tiennent sur une ligne. Le libellé complet reste en aria-label et en title. Co-Authored-By: Claude Haiku 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
721c8111f2
commit
6c5cacab0f
2 files changed
+13
-4
No files matched your search
@@ -355,6 +355,12 @@
|
||||
white-space: normal;
|
||||
text-align: center;
|
||||
}
|
||||
.contextual-navbar--family .nav-family-label-short { display: none; }
|
||||
/* Sous 420 px, trois libellés complets passent sur deux lignes : on prend les courts, sur une ligne */
|
||||
@media (max-width: 419px) {
|
||||
.contextual-navbar--family .nav-family-label-full { display: none; }
|
||||
.contextual-navbar--family .nav-family-label-short { display: inline; white-space: nowrap; }
|
||||
}
|
||||
.contextual-navbar--family .nav-more-wrapper { flex: 1; display: flex; }
|
||||
.contextual-navbar--family .nav-dropdown-wrapper { margin-left: 0; align-self: center; }
|
||||
/* Le zoom passe au-dessus de la barre pleine largeur */
|
||||
|
||||
@@ -167,13 +167,16 @@ function ContextualNavbar({
|
||||
onClick={onEditClick}
|
||||
active={editModeActive}
|
||||
/>
|
||||
<button type="button" className="nav-family-btn nav-family-btn--primary" onClick={onAddSouvenirClick}>
|
||||
{/* Sous 420 px, un libellé court tient sur une ligne ; le libellé complet reste en aria-label et en title */}
|
||||
<button type="button" className="nav-family-btn nav-family-btn--primary" onClick={onAddSouvenirClick} aria-label={t('Ajouter un souvenir')} title={t('Ajouter un souvenir')}>
|
||||
<ImagePlus size={20} strokeWidth={2} aria-hidden="true" />
|
||||
<span>{t('Ajouter un souvenir')}</span>
|
||||
<span className="nav-family-label-full">{t('Ajouter un souvenir')}</span>
|
||||
<span className="nav-family-label-short" aria-hidden="true">{t('Souvenir')}</span>
|
||||
</button>
|
||||
<button type="button" className="nav-family-btn" onClick={onAddPersonClick}>
|
||||
<button type="button" className="nav-family-btn" onClick={onAddPersonClick} aria-label={t('Ajouter une personne')} title={t('Ajouter une personne')}>
|
||||
<UserPlus size={20} strokeWidth={2} aria-hidden="true" />
|
||||
<span>{t('Ajouter une personne')}</span>
|
||||
<span className="nav-family-label-full">{t('Ajouter une personne')}</span>
|
||||
<span className="nav-family-label-short" aria-hidden="true">{t('Personne')}</span>
|
||||
</button>
|
||||
<div ref={moreRef} className="nav-more-wrapper">
|
||||
<button type="button" className={`nav-family-btn nav-family-btn--more${moreOpen ? ' is-open' : ''}`} onClick={() => setMoreOpen((v) => !v)} aria-expanded={moreOpen} aria-haspopup="menu">
|
||||
|
||||
Reference in new issue
Block a user