CGM_Public/pretix_original
2
0
Fork 1
mirror of https://github.com/pretix/pretix.git synced 2026-05-07 15:34:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

UI: Improve panel collapse visibility (Z#23132549) (#3709)

Browse Source 
* Move collapse indicator in panels before label

* only hide collapse indicator in panel titles

* remove unneeded collapse-indicators in pretix-control

* remove unneeded collapse-indicators in presale

* move collapse-indicator to left in variants-toggle-button

* remove chevron and use default collapse-indicator in control-variants
This commit is contained in:
Richard Schreiber
2023-11-13 14:23:28 +01:00
committed by GitHub
parent c2ababb9d6
commit 69c2a1b3c2
13 changed files with 75 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
src/pretix/static/pretixcontrol/scss/main.scss
View File

@@ -482,7 +482,7 @@ td > .dl-horizontal {
transform: rotate(180deg);
}
.panel-title a[data-toggle="collapse"], details h3.panel-title, details h4.panel-title {
.panel-title a[data-toggle="collapse"], details .panel-title {
display: flex;
padding: 10px 15px;
margin: -10px -15px;
@@ -490,6 +490,37 @@ td > .dl-horizontal {
justify-content: space-between;
outline: 0;
text-decoration: none;
position: relative;
padding-left: 30px;
}
details strong.panel-title {
display: inline-block;
}
.panel-title a[data-toggle="collapse"] .collapse-indicator,
details .panel-title .collapse-indicator {
/* hide old collapse indicators until they are all removed from HTML */
display: none;
}
.panel-title a[data-toggle="collapse"]::before,
details .panel-title::before {
position: absolute;
top: 50%;
left: 10px;
margin-top: -.5em;
content: "";
width: 1em;
height: 1em;
font: normal normal normal 14px/1 FontAwesome;
display: inline-block;
text-align: center;
transform: rotate(-90deg);
transition: transform 150ms ease-in 0s;
}
.panel-title a:not(.collapsed)::before,
details.details-open .panel-title::before {
transform: rotate(0deg);
}
.panel-title a[data-toggle="collapse"]:hover {