Meteor Same Template different UI


#1

Hi Everyone,

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