diff --git a/src/App.vue b/src/App.vue index bf23aeb0f55a4b4ad07bfe69383d873c8988c5cb..60545a227bfde517be9b8ddc107c4b76fe3a468c 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,7 +1,7 @@ <template> - <div id="app"> + <main id="app"> <img alt="Vue logo" src="./assets/logo.png"> - <div class=""> + <header> <form class="" action="search" method="get"> <input placeholder="Søk..." name="q" /> <select class="" name="lang"> @@ -10,11 +10,11 @@ </select> <input type="submit" name="" value="Yay!"> </form> - </div> - <img id="spinner" :class="waiting ? 'show' : 'hide'" src="./assets/spinner.gif" alt="" /> + </header> + <img id="spinner" :class="waiting ? 'show' : 'hide'" src="./assets/spinner.gif" alt="Venter på innhold" /> <SearchResults :hits="search_results" :lang="query_lang" /> <Article :article="article" /> - </div> + </main> </template> <script> diff --git a/src/components/Article.vue b/src/components/Article.vue index 45bdffb7dc55d94e27d2152c406be969f0fed1c3..e5de71e7577a03fae6e282ad5395520c10bc9582 100644 --- a/src/components/Article.vue +++ b/src/components/Article.vue @@ -1,25 +1,25 @@ <template> - <div class="article" v-show="article.lemmas.length"> + <article v-show="article.lemmas.length"> <Header :lemmas="article.lemmas" /> - <div class="" v-if="article.body.pronunciation.length"> + <section v-if="article.body.pronunciation.length"> <h3>Uttale</h3> <ul> <DefElement v-for="(element, index) in article.body.pronunciation" :key="index" :body='element' /> </ul> - </div> - <div class="" v-if="article.body.etymology"> + </section> + <section v-if="article.body.etymology"> <h3>Etymologi</h3> <ul> <DefElement v-for="(element, index) in article.body.etymology" :key="index" :body='element' /> </ul> - </div> - <div class=""> + </section> + <section> <h3>Definisjoner</h3> <ol> <Definition v-for="(definition, index) in definitions" :key="index" :body='definition' /> </ol> - </div> - </div> + </section> + </article> </template> <script> @@ -55,7 +55,7 @@ export default { <!-- Add "scoped" attribute to limit CSS to this component only --> <style> -.article { +article { margin-top: 30px; } diff --git a/src/components/SearchResults.vue b/src/components/SearchResults.vue index 9e737554cd23ef940dafb7beb51c09032ae26f67..72cf9a31b42bb70a246d32918adcca78a51d9019 100644 --- a/src/components/SearchResults.vue +++ b/src/components/SearchResults.vue @@ -1,12 +1,12 @@ <template> - <div class=""> + <section class=""> <h2 v-if="hits.length">Søkeresultater</h2> <ul> <li v-for="(result, index) in extended_results" :key="index"> <a :href="'/' + lang + '/' + result.id">{{result.label}}</a> ({{result.classification}}) </li> </ul> - </div> + </section> </template> <script>