Welcome to the LimeSurvey Community Forum

Ask the community, share ideas, and connect with other LimeSurvey users!

alignment of popup box

  • KompetenzZ
  • KompetenzZ's Avatar Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
5 years 3 months ago - 5 years 3 months ago #178893 by KompetenzZ
Replied by KompetenzZ on topic alignment of popup box
Hi,

I discovered that when the modal-button is opened on a small screen width, the modal-dialog is shifted down to the bottom of the page, outside of the screen. I also tried to center the modal-dialog with getbootstrap.com/docs/4.0/components/modal/#vertically-centered but it has no effect. I think this problem has to do with my custumized theme, because there isn't this problem with the standard shipped themes.
When I change in theme options "bootswatch theme" to another theme than spacelab, it works. But I would like to use my current bootswatch theme "spacelab".

Do you have any idea how to vertical align the modal-dialog to the top?


Here is a test survey with the problem in spacelab:
food-boku.limequery.com/519354?lang=de


If necessary, here is my theme and survey.

File Attachment:

File Name: extends1_b...fix2.zip
File Size:191 KB

File Attachment:

File Name: limesurvey...3542.lss
File Size:39 KB


LS Version: 3.14

Cheers kompetenzz
Last edit: 5 years 3 months ago by KompetenzZ.
The topic has been locked.
  • tpartner
  • tpartner's Avatar
  • Offline
  • LimeSurvey Community Team
  • LimeSurvey Community Team
More
5 years 3 months ago #178895 by tpartner
Replied by tpartner on topic alignment of popup box
Try adding something like this to custom.css:

Code:
@media (max-width: 768px) {
  .bd-example-modal-lg.in {
    position: absolute;
    top: 20px;
    bottom: auto;
  }
}

Cheers,
Tony Partner

Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
The topic has been locked.
  • KompetenzZ
  • KompetenzZ's Avatar Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
5 years 3 months ago #178896 by KompetenzZ
Replied by KompetenzZ on topic alignment of popup box
Thank you for the quick response. The only problem left now is that I cannot scroll down (on smartphone) until the end of the modal-dialog. I mean the scroll function is disabled now.

Cheers kompetenzz
The topic has been locked.
  • KompetenzZ
  • KompetenzZ's Avatar Topic Author
  • Offline
  • Premium Member
  • Premium Member
More
5 years 3 months ago #178898 by KompetenzZ
Replied by KompetenzZ on topic alignment of popup box
Together we solved this problem, I adapted it a bit, thank you very much :)
Here is the custom.css code if anyone needs this:

Code:
@media (max-width: 768px) {
    .modal {
        position: fixed;
    top: 14px;
    bottom: auto;
 
    }
}
 
@media (max-width: 768px) {
    .modal-body {
        position: relative;
        padding: 12px;
        height: 52vh;
        overflow-y: scroll;
    }
}

Cheers kompetenzz
The topic has been locked.

Lime-years ahead

Online-surveys for every purse and purpose