fix: display problem in sidebar mobile mode

sendya · sendya · commit 2ddf9e9d839c · 2018-11-24T16:13:13.000+08:00
diff --git a/src/components/page/GlobalLayout.vue b/src/components/page/GlobalLayout.vue
@@ -47,7 +47,7 @@
       </a-drawer>
     </template>
 
-    <a-layout :class="[layoutMode]" :style="{ paddingLeft: fixedSideMenu ? `${sidebarOpened ? 256 : 80}px` : '0' }">
+    <a-layout :class="[layoutMode]" :style="{ paddingLeft: fixedSideMenu && device === 'desktop' ? `${sidebarOpened ? 256 : 80}px` : '0' }">
       <!-- layout header -->
       <global-header :mode="layoutMode" :theme="theme" :collapsed="collapsed" :device="device" @toggle="toggle"/>
 
@@ -149,8 +149,14 @@
           overflow-y: auto;
         }
       }
+      .sidemenu {
+        .ant-header-fixedHeader {
 
-
+          &.ant-header-side-opened, &.ant-header-side-closed  {
+            width: 100%
+          }
+        }
+      }
 
     }
 

Original file line number	Diff line number	Diff line change
`@@ -47,7 +47,7 @@`
`47`	`47`	`</a-drawer>`
`48`	`48`	`</template>`
`49`	`49`
`50`		- <a-layout :class="[layoutMode]" :style="{ paddingLeft: fixedSideMenu ? `${sidebarOpened ? 256 : 80}px` : '0' }">
	`50`	+ <a-layout :class="[layoutMode]" :style="{ paddingLeft: fixedSideMenu && device === 'desktop' ? `${sidebarOpened ? 256 : 80}px` : '0' }">
`51`	`51`	`<!-- layout header -->`
`52`	`52`	`<global-header :mode="layoutMode" :theme="theme" :collapsed="collapsed" :device="device" @toggle="toggle"/>`
`53`	`53`
`@@ -149,8 +149,14 @@`
`149`	`149`	`overflow-y: auto;`
`150`	`150`	`}`
`151`	`151`	`}`
	`152`	`+ .sidemenu {`
	`153`	`+ .ant-header-fixedHeader {`
`152`	`154`
`153`		`-`
	`155`	`+ &.ant-header-side-opened, &.ant-header-side-closed {`
	`156`	`+ width: 100%`
	`157`	`+ }`
	`158`	`+ }`
	`159`	`+ }`
`154`	`160`
`155`	`161`	`}`
`156`	`162`