From 11060136c4bf2ec1d39e0d0d6951b9093e3edc06 Mon Sep 17 00:00:00 2001
From: Eduardo San Martin Morote <posva@users.noreply.github.com>
Date: Thu, 17 Sep 2020 19:21:10 +0200
Subject: [PATCH] feat: top and bottom slots for sidebar and page (#90)

---
 src/client/theme-default/Layout.vue            | 18 ++++++++++++++++--
 src/client/theme-default/components/Page.vue   |  5 ++++-
 .../theme-default/components/SideBar.vue       |  4 ++++
 3 files changed, 24 insertions(+), 3 deletions(-)

diff --git a/src/client/theme-default/Layout.vue b/src/client/theme-default/Layout.vue
index fb446a38cdba..5b777afc64d6 100644
--- a/src/client/theme-default/Layout.vue
+++ b/src/client/theme-default/Layout.vue
@@ -5,7 +5,14 @@
       <ToggleSideBarButton @toggle="toggleSidebar" />
     </header>
     <aside :class="{ open }">
-      <SideBar/>
+      <SideBar>
+        <template #top>
+          <slot name="sidebar-top" />
+        </template>
+        <template #bottom>
+          <slot name="sidebar-bottom" />
+        </template>
+      </SideBar>
     </aside>
     <div
       class="sidebar-mask"
@@ -13,7 +20,14 @@
       @click="toggleSidebar(false)"
     />
     <main>
-      <Page />
+      <Page>
+        <template #top>
+          <slot name="page-top" />
+        </template>
+        <template #bottom>
+          <slot name="page-bottom" />
+        </template>
+      </Page>
     </main>
   </div>
   <Debug />
diff --git a/src/client/theme-default/components/Page.vue b/src/client/theme-default/components/Page.vue
index bf496041ece8..68e66c419314 100644
--- a/src/client/theme-default/components/Page.vue
+++ b/src/client/theme-default/components/Page.vue
@@ -1,8 +1,10 @@
 <template>
   <div class="content">
+    <slot name="top" />
     <Content />
     <NextAndPrevLinks />
     <PageEdit />
+    <slot name="bottom" />
   </div>
 </template>
 
@@ -10,7 +12,7 @@
 import NextAndPrevLinks from './NextAndPrevLinks.vue'
 import PageEdit from './PageEdit.vue'
 export default {
-  components:{ NextAndPrevLinks, PageEdit }
+  components: { NextAndPrevLinks, PageEdit }
 }
 </script>
 
@@ -18,6 +20,7 @@ export default {
 .content {
   margin: 0 auto;
   padding: 0.025rem 2.5rem 2rem;
+  /* if this is moved to a variable, add it to BuySellAds.vue */
   max-width: 50rem;
 }
 
diff --git a/src/client/theme-default/components/SideBar.vue b/src/client/theme-default/components/SideBar.vue
index cdb9e4f97316..97025fec6cfa 100644
--- a/src/client/theme-default/components/SideBar.vue
+++ b/src/client/theme-default/components/SideBar.vue
@@ -1,9 +1,13 @@
 <template>
   <NavBarLinks class="show-mobile" />
 
+  <slot name="top" />
+
   <ul class="sidebar">
     <SideBarItem v-for="item of items" :item="item" />
   </ul>
+
+  <slot name="bottom" />
 </template>
 
 <script src="./SideBar"></script>