studio-variable/index-main
4
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

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

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

15
assets/css/components/_dropdown.scss
View file

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

14
assets/css/style.css
View file

@ -1061,11 +1061,21 @@ button.sort[data-sort-type=up] .arrow {
right: 16px; right: 16px;
} }
.dropdown--position-right .dropdown__content { .dropdown--position-right .dropdown__content {
top: 0; top: auto;
left: 100%; bottom: 0;
left: calc(100% + var(--padding-inner));
margin-top: 0; margin-top: 0;
margin-left: 4px; 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 { .dropdown.is-open .dropdown__content {
opacity: 1; opacity: 1;
visibility: visible; visibility: visible;

2
assets/css/style.css.map
View file

File diff suppressed because one or more lines are too long

15
site/templates/report.php
View file

@ -47,10 +47,17 @@
<span class="text">Télégarcher le&nbsp;PDF</span> <span class="text">Télégarcher le&nbsp;PDF</span>
</a> </a>
</button> </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> <div class="dropdown dropdown--position-right">
</label> <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> </div>