Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Responsive #8

Closed
DJaeger opened this issue Jun 27, 2017 · 16 comments
Closed

Responsive #8

DJaeger opened this issue Jun 27, 2017 · 16 comments

Comments

@DJaeger
Copy link

DJaeger commented Jun 27, 2017

Could you please tell me in which way the modal dialog boxes are responsive as mentioned in the description?
Within the css the dimensions are defined with pixel values and there are also no media queries
Also when testing it with the demo code on mobile phones it is breaking the viewport.

@stefangabos
Copy link
Owner

You'll have to use the custom_class property and specify a width in percentages

@DJaeger
Copy link
Author

DJaeger commented Jun 28, 2017

If it needs customizing it shouldn't be declared as responsive in the description.
How about modifying the themes to be responsive by default?
For example by setting "max-width: 100%" (Just an idea to make it responsive out of my head)?

@stefangabos
Copy link
Owner

max-width: 100% sounds right. I'll look into it later today. Thanks!

@stefangabos
Copy link
Owner

Adding

@media (max-width: 574px) {
    width: 100%;
}

to .ZebraDialog seems fine. Note that this uses Twitter Bootstrap's break-point of 574px

@DJaeger
Copy link
Author

DJaeger commented Jun 28, 2017

Sounds great.
Why not adding max-width for all screen widths, just to be save?

@stefangabos
Copy link
Owner

stefangabos commented Jun 28, 2017

Sounds good, I will add that also

@DJaeger
Copy link
Author

DJaeger commented Jun 28, 2017

👍

@DJaeger
Copy link
Author

DJaeger commented Jun 28, 2017

I have also seen, that the calculation of the dialog/modal position seems to calculate negative top positions, if the modal is higher than the viewport.

@discotizer
Copy link

I can confirm this. I'm fighting with this issue (dialog height exceeds display height) right now. Will check if the max-height does the trick here too.

@stefangabos
Copy link
Owner

stefangabos commented Jul 3, 2017 via email

@stefangabos
Copy link
Owner

Guys, is this ok now, can I close it?

@DJaeger
Copy link
Author

DJaeger commented Jul 4, 2017

I will check

@discotizer
Copy link

Yes, this works for me! Thanks for the fix.

@DJaeger
Copy link
Author

DJaeger commented Jul 5, 2017

It's still exceeding the viewport height.
Could it be, that its because I use the AJAX source?

@stefangabos
Copy link
Owner

Make sure you are downloading the latest commit and not the release

@DJaeger
Copy link
Author

DJaeger commented Jul 5, 2017

I have tested with the raw dist files, but I will test again and give you feedback

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants