diff options
| -rw-r--r-- | resources/assets/stylesheets/scss/responsive.scss | 8 | ||||
| -rw-r--r-- | resources/vue/components/responsive/ResponsiveContentBar.vue | 5 |
2 files changed, 11 insertions, 2 deletions
diff --git a/resources/assets/stylesheets/scss/responsive.scss b/resources/assets/stylesheets/scss/responsive.scss index 57047bc..8fb48bf 100644 --- a/resources/assets/stylesheets/scss/responsive.scss +++ b/resources/assets/stylesheets/scss/responsive.scss @@ -631,8 +631,16 @@ $sidebarOut: -330px; } } + #page-content-wrapper { + display: flex; + flex-direction: row; + flex-wrap: wrap; + grid-gap: unset; + } + #content-wrapper { flex: 1; + grid-column: unset; margin-top: 75px; min-height: calc(100vh - 150px); } diff --git a/resources/vue/components/responsive/ResponsiveContentBar.vue b/resources/vue/components/responsive/ResponsiveContentBar.vue index 051b83f..0a18bf5 100644 --- a/resources/vue/components/responsive/ResponsiveContentBar.vue +++ b/resources/vue/components/responsive/ResponsiveContentBar.vue @@ -66,6 +66,7 @@ export default { toggleSidebar() { const sidebar = document.getElementById('sidebar'); + const wrapper = document.getElementById('page-content-wrapper'); const content = document.getElementById('content-wrapper'); const pageTitle = document.getElementById('page-title-container'); if (this.sidebarOpen) { @@ -80,7 +81,7 @@ export default { } if (!document.documentElement.classList.contains('responsive-display')) { - document.body.style.display = 'flex'; + wrapper.style.display = 'flex'; } this.sidebarOpen = false; @@ -99,7 +100,7 @@ export default { } if (!document.documentElement.classList.contains('responsive-display')) { - document.body.style.display = 'grid'; + wrapper.style.display = 'grid'; } this.sidebarOpen = true; |