only scroll body

client/src/styles/partials/bdsettings/contentview.scss

@@ -11,10 +11,21 @@
             padding: 50px 0;
         }
 
+        .bd-onlinePhHeader {
+            padding: 0 20px 0 0;
+        }
+
         .bd-onlinePhBody {
+            margin-top: 10px;
+
             .bd-spinnerContainer {
                 padding: 0;
             }
+
+            .bd-scroller {
+                padding: 0 20px 0 0;
+            }
+
         }
 
         h3 {

client/src/styles/partials/bdsettings/remotecard.scss

@@ -1,8 +1,7 @@
 .bd-remoteCard {
-    display: flex;
     flex-direction: column;
     margin-top: 10px;
-    padding: 10px 0;
+    padding: 10px;
     border-radius: 0;
     border-bottom: 1px solid rgba(114, 118, 126, .3);
 

client/src/styles/partials/sidebarview/settingswrap.scss

@@ -120,8 +120,14 @@
         }
 
         .bd-settingswrapContents {
-            padding: 0 20px;
-            margin-bottom: 84px;
+            padding: 0 0 0 20px;
+        }
+
+        .bd-scroller {
+            .bd-settingswrapContents {
+                margin-bottom: 84px;
+                padding: 0 20px;
+            }
         }
     }
 }

client/src/ui/components/bd/SettingsWrapper.vue

@@ -10,7 +10,16 @@
 
 <template>
     <div class="bd-settingswrap">
-        <ScrollerWrap :scrollend="scrollend">
+        <div v-if="noscroller" class="bd-flex bd-flexCol">
+            <div class="bd-settingswrapHeader">
+                <span class="bd-settingswrapHeaderText">{{ headertext }}</span>
+                <slot name="header" />
+            </div>
+            <div class="bd-settingswrapContents bd-flex bd-flexGrow bd-flexCol">
+                <slot />
+            </div>
+        </div>
+        <ScrollerWrap v-else :scrollend="scrollend">
             <div class="bd-settingswrapHeader">
                 <span class="bd-settingswrapHeaderText">{{ headertext }}</span>
                 <slot name="header" />
@@ -27,7 +36,7 @@
     import { ScrollerWrap } from '../common';
 
     export default {
-        props: ['headertext', 'scrollend'],
+        props: ['headertext', 'scrollend', 'noscroller'],
         components: {
             ScrollerWrap
         }

client/src/ui/components/bd/ThemesView.vue

@@ -9,7 +9,7 @@
 */
 
 <template>
-    <SettingsWrapper headertext="Themes" :scrollend="scrollend">
+    <SettingsWrapper headertext="Themes" :noscroller="true">
         <div class="bd-tabbar" slot="header">
             <div class="bd-button" :class="{'bd-active': local}" @click="showLocal">
                 <h3>Installed</h3>
@@ -34,12 +34,12 @@
                         <div class="bd-spinner7"/>
                     </div>
                 </div>
-                <div class="bd-onlinePhBody" v-if="!loadingOnline && onlineThemes">
+                <ScrollerWrap class="bd-onlinePhBody" v-if="!loadingOnline && onlineThemes" :scrollend="scrollend">
                     <RemoteCard v-if="onlineThemes && onlineThemes.docs" v-for="theme in onlineThemes.docs" :key="theme.id" :item="theme" />
                     <div v-if="loadingMore" class="bd-spinnerContainer">
                         <div class="bd-spinner7"/>
                     </div>
-                </div>
+                </ScrollerWrap>
             </div>
         </div>
     </SettingsWrapper>
@@ -50,7 +50,7 @@
     import { ThemeManager, BdWebApi } from 'modules';
     import { Modals } from 'ui';
     import { ClientLogger as Logger } from 'common';
-    import { MiRefresh } from '../common';
+    import { MiRefresh, ScrollerWrap } from '../common';
     import SettingsWrapper from './SettingsWrapper.vue';
     import ThemeCard from './ThemeCard.vue';
     import RemoteCard from './RemoteCard.vue';
@@ -69,7 +69,7 @@
         },
         components: {
             SettingsWrapper, ThemeCard, RemoteCard,
-            MiRefresh,
+            MiRefresh, ScrollerWrap,
             RefreshBtn
         },
         methods: {