WIP

src/components/DictionaryView.vue

@@ -4,7 +4,32 @@
       <Autocomplete v-on:submit="select_result" :api="get_search_endpoint">
       </Autocomplete>
       <SearchToolbar v-if="$store.state.showSearchToolbar" @updatePos="update_pos"  @updateScope="update_scope"/>
-      <v-container><v-row><v-col cols="6"><v-pagination circle :length="100"></v-pagination></v-col><v-col cols="6"><v-pagination circle :length="100"></v-pagination></v-col></v-row></v-container>
+      <v-card rounded="xl">
+      <v-container v-if="!article && article_info && total_results > 20"><v-row>
+        <v-col cols = 1>Vis</v-col>
+        <v-col cols=2>
+        <v-select :items="[10,20,30,40,50]"
+/> </v-col><v-col v-if="article.info.meta.nn" cols=6>av {{article_info.meta.bm.total}} treff i
+        Bokmålsordboka</v-col>
+
+                <v-col cols = 1>Vis</v-col>
+        <v-col cols=1>
+        <v-text-field
+  _items="[10]"
+  value="10"
+  hide-details
+  dense
+  rounded
+  outlined
+  label="test"
+  single-line
+  type="number"
+/> </v-col><v-col v-if="article.info.meta.nn" cols = "">av {{article_info.meta.nn.total}} treff i
+        Nynorskordboka</v-col>
+        
+        </v-row>
+      <v-row><v-col cols="6"><v-pagination :value="2" circle :length="100"></v-pagination></v-col>
+                          <v-col cols="6"><v-pagination circle :length="100"></v-pagination></v-col></v-row></v-container></v-card>
     </div>
     
     <SearchResults  :results_bm="search_results.bm || []"
@@ -41,6 +66,7 @@
       <p v-if="error[0]">{{error[0]}}</p>
       <p v-if="error[1]">{{error[1]}}</p>
     </div>
+    
   </main>
 </template>
 
@@ -57,7 +83,7 @@ import { setup } from 'axios-cache-adapter'
 const SEARCH_ENDPOINT = process.env.VUE_APP_SEARCH_ENDPOINT
 const ARTICLE_ENDPOINT= process.env.VUE_APP_ARTICLE_ENDPOINT
 
-const dicts = {'nn': 'Nynorskorboka',
+const dicts = {'nn': 'Nynorskordboka',
                'bm': 'Bokmålsordboka',
                'bm,nn': 'ordbøkene'}
 
@@ -235,6 +261,8 @@ export default {
       article_info: null,
       nn_page: null,
       bm_page: null,
+      bm_pp: null,
+      nn_pp: null
     }
   },
   computed: {

src/components/SearchResults.vue

 <template>
   <section id="search_results">
     <div class="flex-container" :class="$vuetify.breakpoint.name">
-      <div v-if="!this.$vuetify.breakpoint.mdAndUp">
-        <div v-if="count_bm" class="results-count">Treff i Bokmålsordboka: {{count_bm}}</div>
-        <div v-if="count_nn" class="results-count">Treff i Nynorskorboka: {{count_nn}}</div>
-      </div>
-      <ul class="hits" v-if="!this.$vuetify.breakpoint.mdAndUp">
-      <li v-if="this.$vuetify.breakpoint.mdAndUp" class="results-count">BM: {{count_bm}}, NN: {{count_nn}}</li>
+
+      <ul class="hits" v-if="$vuetify.breakpoint.mobile">
+      <li class="results-count"><span>Bokmål: {{count_bm}} treff</span><span> Nynorsk: {{count_nn}} treff</span></li>
         <li  class="article_container" v-for="(result, index) in both_dicts" :key="index + both_hash" tabindex="-1">
           <Article
               :article="result"
@@ -15,8 +12,8 @@
           </Article>
         </li>
       </ul>
-      <ul class="hits" v-if="this.$vuetify.breakpoint.mdAndUp">
-      <li v-if="this.$vuetify.breakpoint.mdAndUp" class="results-count">Treff i Bokmålsordboka: {{count_bm}}</li>
+      <ul class="hits" v-if="!$vuetify.breakpoint.mobile && count_bm">
+      <li class="results-count">Bokmålsordboka: {{count_bm}} treff</li>
         <li  class="article_container" v-for="(result, index) in results_bm" :key="index + bm_hash" tabindex="-1">
           <Article
               :article="result"
@@ -25,8 +22,8 @@
           </Article>
         </li>
       </ul>
-      <ul class="hits" v-if="this.$vuetify.breakpoint.mdAndUp">
-        <li v-if="this.$vuetify.breakpoint.mdAndUp" class="results-count">Treff i Nynorskorboka: {{count_nn}}</li>
+      <ul class="hits" v-if="!$vuetify.breakpoint.mobile && count_nn">
+        <li class="results-count">Nynorskorboka: {{count_nn}} treff</li>
         <li class="article_container" v-for="(result, index) in results_nn" :key="index + nn_hash" tabindex="-1">
           <Article
               :article="result"