diff --git a/src/App.vue b/src/App.vue index da3d641d07612bdf6ef55926640de68d0eb8fd7e..593ef3f9ff23cce971ef5e31a7a2bfeefb7923dd 100644 --- a/src/App.vue +++ b/src/App.vue @@ -7,15 +7,30 @@ </header> <main :class="(article.error || article.lemmas.length || search_results.length || waiting) ? '' : 'welcome '"> <div class="search_container"> - <Autocomplete @submit="select_result" :endpoint="api_pref"> - </Autocomplete> <div class="lang_select_container"> - <select class="lang_select" name="lang" v-model="lang"> - <option value="bob,nob">Begge ordbøker </option> - <option value="bob">Bokmål</option> - <option value="nob">Nynorsk</option> - </select> + <v-radio-group row v-model="lang"> + <template v-slot:label> + <span>VIS TREFF PÅ</span> + </template> + <v-radio value="bob,nob" color="rgb(188, 71, 123)"> + <template v-slot:label> + <span>Begge ordbøker</span> + </template> + </v-radio> + <v-radio value="bob" color="rgb(188, 71, 123)"> + <template v-slot:label> + <span>Bokmål</span> + </template> + </v-radio> + <v-radio value="nob" label="Nynorsk" color="rgb(188, 71, 123)"> + <template v-slot:label> + <span>Nynorsk</span> + </template> + </v-radio> + </v-radio-group> </div> + <Autocomplete @submit="select_result" :endpoint="api_pref"> + </Autocomplete> </div> <div id="spinner"> <v-progress-circular indeterminate color="rgb(188, 71, 123)" size="120" v-show="waiting"></v-progress-circular> @@ -440,11 +455,14 @@ footer { } .search_container { - display: flex; - flex-direction: row; + max-width: 1400px; padding-top: 50px; } +.v-label span { + color: rgba(86, 0, 39, 1) +} + li.suggestion { font-weight: bold; padding-left: 20px; diff --git a/src/components/Autocomplete.vue b/src/components/Autocomplete.vue index 53ff431484845f2cd9e50db2ef975d436dd5ff71..ddf7df5973d6618b6d91be3e05b687c4d339926d 100644 --- a/src/components/Autocomplete.vue +++ b/src/components/Autocomplete.vue @@ -6,7 +6,8 @@ :search-input.sync="search" item-text="label" :menu-props="{maxHeight: 500, transition: 'fade-transition'}" - append-icon="search" + prepend-inner-icon="search" + append-icon="undefined" return-object hide-no-data no-filter