Blurred screen

[eveningkid]

Hi everyone,

I'm facing an issue for weeks now. Long story short, the app is correctly showing up on desktop (using the latest version for Chrome) but when it is loaded from the Chrome application on my Android smartphone, the whole screen is blurred.

For now, I've figured out that it is only caused by the ionic-material css file. I believe the transform properties are involved in all that mess!

If anyone have any idea, I'd be sincerely grateful.

Thank you for your time. :smile:

[newmesiss]

Chrome has the option to view your project with different devices. you are testing with that ??

[eveningkid]

Sure I am.. :disappointed:

[hotrush]

same issue. my code:

<ion-view hide-nav-bar="true" hide-back-button="true" can-swipe-back="false">
  <ion-content scroll="false">
    <h1>Login</h1>
    <ion-list class="animate-ripple">
      <ion-item menu-close>
        <button ng-click="authenticate('vk')" class="button button-block icon-left ion-social-facebook">
          Sign in with VK
        </button>
      </ion-item>
      <ion-item menu-close>
        <button ng-click="authenticate('facebook')" class="button button-block icon-left ion-social-facebook">
          Sign in with FB
        </button>
      </ion-item>
      <ion-item menu-close>
        <button ng-click="authenticate('google')" class="button button-block icon-left ion-social-google">
          Sign in with G+
        </button>
      </ion-item>
    </ion-list>
  </ion-content>
</ion-view>

and

$timeout(function(){
  ionicMaterialMotion.ripple();
},0);

works in chrome, but 2nd and 3rd list items are blurred on android device