Shopify themes, liquid, logos, and UX
We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more
Hello my website is TuneToyz.com my website popup looks good on PC, but I want it to be changed so it looks like how it is on PC to be on mobile. The mobile popup is too long. I am using the app Ecomsendpopups for this but I have inserted my own custom css.
Ontop of the app doing a bunch of react class divitis stuff , theres a bunch of style rules that force "!important" overcomplicating everything.
So your gonna constantly stub your toe on specificity issues or weird behavior when a rule should work but it can't.
Avoid using !important clear as many of the rules as possible.
Apply a view-height the container or wrapper and clear the internal min-heights etc like the following,
either in the app or a custom css setting AFTER fixing the other specificity issues
.ecomsend__Modal__Container {
max-height: 90vh;
}
Contact paull.newton+shopifyforum@gmail.com for the solutions you need
Save time & money ,Ask Questions The Smart Way
Problem Solved? ✔Accept and Like solutions to help future merchants
Answers powered by coffee Thank Paul with a ☕ Coffee for more answers or donate to eff.org
Hi @TuneToyz
You can edit theme code:
file name base.css, in line 3678
._adminModalContainer_4tu8s_251 ._modalContent_4tu8s_22 {
min-height: 671px !important;
}
to
._adminModalContainer_4tu8s_251 ._modalContent_4tu8s_22 {
min-height: 548px !important;
}