Andreas/wekan
1
0
Fork 0
mirror of https://github.com/wekan/wekan.git synced 2026-01-24 10:16:09 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 5

Fix popups positioning. Part 2.

Browse source 
Thanks to xet7 !
This commit is contained in:
Lauri Ojansivu 2025-10-15 23:19:07 +03:00
parent ab0ebab240
commit 00ddec7575
1 changed files with 61 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

75
client/components/main/popup.css
View file

@ -85,21 +85,68 @@
width: 100%;
padding: 0 1.3vw 1.3vh;
box-sizing: border-box;
/* Ensure content is not shifted left */
margin-left: 0 !important;
transform: none !important;
}
/* Utility: remove left gutter inside specific popups */
.pop-over .content .flush-left {
margin-left: -1.3vw;
margin-left: 0;
padding-left: 0;
width: calc(100% + 2.6vw);
width: 100%;
}
/* Swimlane popups: remove left gutter, align content fully left */
.pop-over .content form.swimlane-color-popup,
.pop-over .content .swimlane-height-popup {
margin-left: -1.3vw;
margin-left: 0;
padding-left: 0;
width: calc(100% + 2.6vw);
width: 100%;
}
/* Color selection popups: ensure proper alignment */
.pop-over .content form.swimlane-color-popup .palette-colors,
.pop-over .content form.edit-label .palette-colors,
.pop-over .content form.create-label .palette-colors {
margin-left: 0;
padding-left: 0;
width: 100%;
}
/* Color palette items: ensure proper positioning */
.pop-over .content .palette-colors .palette-color {
margin-left: 0;
margin-right: 2px;
margin-bottom: 2px;
}
/* Global fix for all popup content to prevent left shifting */
.pop-over .content * {
margin-left: 0 !important;
transform: none !important;
}
/* Override any potential left shifting for specific elements */
.pop-over .content form,
.pop-over .content .palette-colors,
.pop-over .content .pop-over-list,
.pop-over .content .flush-left {
margin-left: 0 !important;
padding-left: 0 !important;
transform: none !important;
}
/* Fix popup depth containers that cause left shifting */
.pop-over .popup-container-depth-1,
.pop-over .popup-container-depth-2,
.pop-over .popup-container-depth-3,
.pop-over .popup-container-depth-4,
.pop-over .popup-container-depth-5,
.pop-over .popup-container-depth-6 {
transform: none !important;
margin-left: 0 !important;
padding-left: 0 !important;
}
/* Ensure buttons don’t reserve left space; align to flow */
@ -130,7 +177,7 @@
.pop-over .at-form .at-error,
.pop-over .at-form .at-result {
padding: 8px 12px;
margin: -8px -10px 10px;
margin: 0 0 10px 0;
}
.pop-over .at-form .at-error {
background: #ef9a9a;
@ -174,7 +221,7 @@
font-weight: 700;
padding: 1.5px 10px;
position: relative;
margin: 0 -10px;
margin: 0;
text-decoration: none;
overflow: hidden;
line-height: 33px;
@ -333,12 +380,12 @@
margin: 48px 0px 0px 0px;
}
.pop-over .content-container {
width: 1000%;
width: 100%;
height: 100%;
max-height: 100%;
}
.pop-over .content-container .content {
width: calc(10% - 20px);
width: calc(100% - 20px);
height: calc(100% - 20px);
padding: 10px;
}
@ -360,21 +407,21 @@
margin: 0px 0px;
}
.pop-over .popup-container-depth-1 {
transform: translateX(-10%);
transform: none !important;
}
.pop-over .popup-container-depth-2 {
transform: translateX(-20%);
transform: none !important;
}
.pop-over .popup-container-depth-3 {
transform: translateX(-30%);
transform: none !important;
}
.pop-over .popup-container-depth-4 {
transform: translateX(-40%);
transform: none !important;
}
.pop-over .popup-container-depth-5 {
transform: translateX(-50%);
transform: none !important;
}
.pop-over .popup-container-depth-6 {
transform: translateX(-60%);
transform: none !important;
}
}