added new pagination

src/i18n/en.json

@@ -96,5 +96,8 @@
 	"contextmenu.download": "Download",
 	"contextmenu.open": "Open",
 	"contextmenu.openInExplorer": "Open in Explorer",
-	"contextmenu.openOnSpinShare": "Open on SpinShare"
+	"contextmenu.openOnSpinShare": "Open on SpinShare",
+
+	"songrow.navigation.previous": "PREVIOUS",
+	"songrow.navigation.next": "NEXT"
 }
\ No newline at end of file

src/views/StartupHotSongs.vue

 <template>
-    <SongRow
-        :title="$t('startup.hotsongs.header')">
+    <SongRow>
         <template v-slot:controls>
-            <div :class="'item ' + (hotSongsOffset == 0 ? 'disabled' : '')" v-on:click="hotPrevious()"><i class="mdi mdi-chevron-left"></i></div>
-            <div :class="'item ' + (hotSongs.length < 11 ? 'disabled' : '')" v-on:click="hotNext()"><i class="mdi mdi-chevron-right"></i></div>
+            <div :class="'button ' + (hotSongsOffset == 0 ? 'button-disabled' : '')" v-on:click="hotPrevious()"><i class="mdi mdi-chevron-left"></i> {{ $t('songrow.navigation.previous' )}}</div>
+            <div :class="'button ' + (hotSongs.length < 11 ? 'button-disabled' : '')" v-on:click="hotNext()">{{ $t('songrow.navigation.next' )}} <i class="mdi mdi-chevron-right"></i></div>
         </template>
         <template v-slot:song-list>
             <SongItemPlaceholder

src/views/StartupNewSongs.vue

 <template>
-    <SongRow
-        :title="$t('startup.newsongs.header')">
+    <SongRow>
         <template v-slot:controls>
-            <div :class="'item ' + (newSongsOffset == 0 ? 'disabled' : '')" v-on:click="newPrevious()"><i class="mdi mdi-chevron-left"></i></div>
-            <div :class="'item ' + (newSongs.length < 11 ? 'disabled' : '')" v-on:click="newNext()"><i class="mdi mdi-chevron-right"></i></div>
+            <div :class="'button ' + (newSongsOffset == 0 ? 'button-disabled' : '')" v-on:click="newPrevious()"><i class="mdi mdi-chevron-left"></i> {{ $t('songrow.navigation.previous' )}}</div>
+            <div :class="'button ' + (newSongs.length < 11 ? 'button-disabled' : '')" v-on:click="newNext()">{{ $t('songrow.navigation.next' )}} <i class="mdi mdi-chevron-right"></i></div>
         </template>
         <template v-slot:song-list>
             <SongItemPlaceholder

src/views/StartupPopularSongs.vue

 <template>
-    <SongRow
-        :title="$t('startup.popularsongs.header')">
+    <SongRow>
         <template v-slot:controls>
-            <div :class="'item ' + (popularSongsOffset == 0 ? 'disabled' : '')" v-on:click="popularPrevious()"><i class="mdi mdi-chevron-left"></i></div>
-            <div :class="'item ' + (popularSongs.length < 11 ? 'disabled' : '')" v-on:click="popularNext()"><i class="mdi mdi-chevron-right"></i></div>
+            <div :class="'button ' + (popularSongsOffset == 0 ? 'button-disabled' : '')" v-on:click="popularPrevious()"><i class="mdi mdi-chevron-left"></i> {{ $t('songrow.navigation.previous' )}}</div>
+            <div :class="'button ' + (popularSongs.length < 11 ? 'button-disabled' : '')" v-on:click="popularNext()">{{ $t('songrow.navigation.next' )}} <i class="mdi mdi-chevron-right"></i></div>
         </template>
         <template v-slot:song-list>
             <SongItemPlaceholder