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

dropdown css

Browse source
This commit is contained in:
Julie Blanc 2026-02-25 17:00:54 +01:00
parent d0b21ac4bb
commit 662a55863d
6 changed files with 153 additions and 116 deletions
Download patch file Download diff file Expand all files Collapse all files

63
assets/css/style.css
View file

@ -1269,7 +1269,6 @@ button.sort[data-sort-type=up] .arrow {
position: absolute;
top: 100%;
left: 0;
min-width: 180px;
margin-top: var(--padding-inner);
background-color: var(--color-bg);
border: var(--border);
@ -1292,8 +1291,10 @@ button.sort[data-sort-type=up] .arrow {
list-style: none;
margin: 0;
padding: var(--padding-inner);
min-width: 180px;
}
.dropdown__content a, .dropdown__content button {
.dropdown__content a,
.dropdown__content button {
display: block;
width: 100%;
padding: 0.75em 1ch;
@ -1305,7 +1306,8 @@ button.sort[data-sort-type=up] .arrow {
border: none;
cursor: pointer;
}
.dropdown__content a:hover, .dropdown__content button:hover {
.dropdown__content a:hover,
.dropdown__content button:hover {
background-color: var(--grey-800);
}
.dropdown--align-right .dropdown__content {
@ -1322,26 +1324,7 @@ button.sort[data-sort-type=up] .arrow {
transform: translateY(0);
}
.dropdown--position-mobile .dropdown__content {
top: auto;
bottom: calc(var(--h-block) + var(--padding-inner) * 2);
left: auto;
right: 0;
margin-top: 0;
margin-left: 4px;
}
.dropdown--position-mobile .dropdown__content::before {
font-family: Arial;
content: "◀";
transform: rotate(-90deg);
font-size: 14px;
position: absolute;
top: auto;
bottom: -13px;
left: auto;
right: 10%;
}
.dropdown--position-mobile.is-open .dropdown__content {
transform: translateX(0);
background-color: red;
}
@media screen and (min-width: 768px) {
.dropdown--position-panel .dropdown__content {
@ -1368,22 +1351,38 @@ button.sort[data-sort-type=up] .arrow {
@media screen and (max-width: 560px) {
.dropdown .dropdown__content {
width: calc(100vw - var(--padding-body) * 2);
left: auto;
right: 0;
background-color: blue !important;
}
.dropdown .dropdown__content .modal--share {
width: 100%;
}
}
@media screen and (max-width: 1280px) {
[data-template=investigations] .dropdown .dropdown__content {
left: auto;
right: 0;
}
[data-template=investigations] .dropdown .dropdown__content::before {
left: auto;
right: 16px;
}
#bottom-bar .dropdown .dropdown__content {
top: auto;
bottom: calc(var(--h-block) + var(--padding-inner) * 2);
left: auto;
right: 0;
margin-top: 0;
margin-left: 4px;
}
#bottom-bar .dropdown .dropdown__content::before {
font-family: Arial;
content: "◀";
transform: rotate(-90deg);
font-size: 14px;
position: absolute;
top: auto;
bottom: -13px;
left: auto;
right: 10%;
}
#bottom-bar .dropdown.is-open .dropdown__content {
transform: translateX(0);
}
.main__single .page__content,
#investigation__content {
font-size: var(--fs-text);