dropdown right position
All checks were successful
Deploy / Deploy to Production (push) Successful in 12s

This commit is contained in:
Julie Blanc 2026-01-21 17:33:23 +01:00
parent 43ad7241d4
commit d5e458afd8
4 changed files with 37 additions and 9 deletions

View file

@ -67,10 +67,21 @@
// Variante : dropdown à droite du bouton
&--position-right .dropdown__content {
top: 0;
left: 100%;
top: auto;
bottom: 0;
left: calc(100% + var(--padding-inner));
margin-top: 0;
margin-left: 4px;
&::before{
content: "";
transform: rotate(0deg);
font-size: 14px;
position: absolute;
top: auto;
bottom: 4px;
left: -12px;
}
}
&.is-open {

View file

@ -1061,11 +1061,21 @@ button.sort[data-sort-type=up] .arrow {
right: 16px;
}
.dropdown--position-right .dropdown__content {
top: 0;
left: 100%;
top: auto;
bottom: 0;
left: calc(100% + var(--padding-inner));
margin-top: 0;
margin-left: 4px;
}
.dropdown--position-right .dropdown__content::before {
content: "◀";
transform: rotate(0deg);
font-size: 14px;
position: absolute;
top: auto;
bottom: 4px;
left: -12px;
}
.dropdown.is-open .dropdown__content {
opacity: 1;
visibility: visible;

File diff suppressed because one or more lines are too long

View file

@ -47,10 +47,17 @@
<span class="text">Télégarcher le&nbsp;PDF</span>
</a>
</button>
<label for="share-banner__aside" class="btn--bold-inline btn--light no-link">
<span class="icon"><?= svg('assets/icons/share.svg') ?></span>
<span class="text">Partager</span>
</label>
<div class="dropdown dropdown--position-right">
<button class="dropdown__trigger btn--bold-inline btn--light no-link">
<span class="icon"><?= svg('assets/icons/share.svg') ?></span>
<span class="text">Partager</span>
</button>
<div class="dropdown__content">
<?php snippet('modal-share') ?>
</div>
</div>
</div>