侧面菜单缩小和放大的标志 - 离子

Question

我是离子新用户，我一直在努力为侧边栏菜单添加徽标，当您从纵向切换到横向时，该徽标将缩小/展开。见下面的例子，

为什么我要缩小徽标，以便所有项目可以一起显示，用户不必滚动。这也适用于较小的屏幕（如果所有项目都不能在一个屏幕上显示，则徽标应缩小它的大小以腾出空间。）

这是我的模板，

<ion-side-menu side="left">

  <ion-header-bar class="logo">
  < img src="/images/logo.png" />
  </ion-header-bar>

  <ion-content>
    <ion-list>
      <ion-item menu-close ui-sref="x.1" class="item-icon-left"> 1 </ion-item>
      <ion-item menu-close ui-sref="x.2" class="item-icon-left"> 2 </ion-item>
      <ion-item menu-close ui-sref="x.3" class="item-icon-left"> 3 </ion-item>
    </ion-list>
  </ion-content>

</ion-side-menu>

和CSS

.logo img {
        max-height:     56px;
        max-width:      120px;
        margin:     0 auto;
        margin-top: 20px;
        display:    block;

}