I want to design a two different UI for mobile and website, but it should be responsive. I have created a chat app and we want to display like WhatsApp web and WhatsApp mobile screen, currently, I have designed the same blaze template and by using CSS I restricted only the left panel ( like conversation listing) visible in mobile and both left and the right panel displayed in Web.
What I think is UI wise, I have done what I am supposed to do. But my template has same ids for mobile and website.
Problem occurs when I am trying to add the functionality, There are certain errors we are facing like
Also I am getting this error and unable to solve this
Uncaught Error: Must be attached at Blaze._DOMRange.DOMRange.containsElement (blaze.js:650) at Blaze._DOMRange.<anonymous> (blaze.js:2612) at HandlerRec.delegatedHandler (blaze.js:863) at HTMLBodyElement.<anonymous> (blaze.js:901) at HTMLBodyElement.wrapper
While using mobile app and switching to screen 2, screen 2 does not work untill reload and once we reload and goes back to screen 1, then screen 1 does not work, giving the same error again.
Please let me know if there are some error in the approach we are using. Any help would be appreciated