Individual main_content IDs

src/components/Article.vue

 <template>
   <article v-bind:class="{'v-sheet v-card rounded-xl': !articleLookup, dictionary, 'collapsable': collapsable, 'collapsed': collapsed}" v-if="article">
-    <Header :lemmas="article.lemmas" :dictionary="dictionary" :article_id="article.article_id" />
+    <Header :article_number="article_number" :lemmas="article.lemmas" :dictionary="dictionary" :article_id="article.article_id" />
     <InflectionButton :lemmas="article.lemmas" :dictionary="dictionary" :article_id="article.article_id"/>
     
     <div class="article_content" :class="$vuetify.breakpoint.name" v-if="!collapsed">
@@ -76,6 +76,7 @@ export default {
   props: {
     article: Object,
     articleLookup: Boolean,
+    article_number: Number
 
   },
   data: function() {

src/components/Autocomplete.vue

@@ -24,7 +24,7 @@
         :dense="$vuetify.breakpoint.mobile"
       >
       <template v-slot:append>
-        <a class="accessibility_link" href="#main_content">Gå videre til hovedinnholdet</a>
+        <a class="accessibility_link" href="#main_content_0">Gå videre til hovedinnholdet</a>
 
                 <a href="#top_menu" class="accessibility_link"
                    @click="$store.commit('toggle', 'menuOpen')"

src/components/Header.vue

 <!-- eslint-disable -->
 <template>
   <div class = "header">
-    <router-link id="main_content"  :to="$parent.link_to_self.ref" @click.native="$parent.details_click($parent.link_to_self)" class="article_header"><h2>{{header_text}}</h2>
+    
+    <router-link tabindex="0" :id="'main_content_'+article_number"  :to="$parent.link_to_self.ref" @click.native="$parent.details_click($parent.link_to_self)" class="article_header"><h2>{{header_text}}</h2>
     <span :aria-label="hgno_arabic" class="hgno" v-if="$store.state.showHGNO">{{hgno}}</span></router-link>
     <span class="dict-label">{{dict_label}}</span>
     <h2 class="secondary_header" v-if="secondary_header_text.length">{{secondary_header_text}}</h2>
@@ -43,7 +44,8 @@ export default {
   props: {
     lemmas: Array,
     dictionary: String,
-    article_id: Number
+    article_id: Number,
+    article_number: Number
   },
   computed: {
     header_text: function() {

src/components/SearchResults.vue

@@ -8,6 +8,7 @@
         <li  class="article_container" v-for="(result, index) in both_dicts" :key="index + both_hash">
           <Article
               :article="result"
+              :article_number="index"
               @article-click="article_link_click"
               @details-click="details_click">
           </Article>
@@ -17,6 +18,7 @@
         <li  class="article_container" v-for="(result, index) in results_bm" :key="index + bm_hash">
           <Article
               :article="result"
+              :article_number="index"
               @article-click="article_link_click"
               @details-click="details_click">
           </Article>
@@ -26,6 +28,7 @@
         <li class="article_container" v-for="(result, index) in results_nn" :key="index + nn_hash">
           <Article
               :article="result"
+              :article_number="index + count_bm"
               @article-click="article_link_click"
               @details-click="details_click"
               :class="right_col_class_name">