Merge branch 'add_explanation_split_infinitive' into 'master'

Add explanation split infinitive

See merge request spraksamlingane/beta.ordbok.uib.no!67

src/components/Header.vue

@@ -9,9 +9,8 @@
     <span v-if="split_inf" tabindex="0"> (kløyvd infinitiv: <i>-a</i>
       <v-menu rounded="0" v-model="menu" offset-x max-width="200px">
         <template v-slot:activator="{ on, attrs }">
-          <v-btn v-bind="attrs" v-on="on" depressed min-width="14px" max-width="14px" class="help-button" x-small
-            color="primary">
-            <v-icon middle x-small>$vuetify.icons.value.info</v-icon>
+          <v-btn x-small icon v-on="on" v-bind="attrs" class="info-button">
+            <v-icon color="primary" size="14px">$vuetify.icons.value.info</v-icon>
           </v-btn>
         </template>
         <v-card rounded="0" class="info-card">
@@ -136,11 +135,11 @@ article h2.secondary_header {
   padding-bottom: 4px;
 }
 
-.help-button {
+.info-button {
   margin-left: 6px;
-  margin-right: 2px;
-  margin-bottom: 4px;
-  color: var(--v-primary-base);
+  margin-right: -2px;
+  height: 10px;
+  width: 10px;
 }
 
 .info-card {

src/plugins/vuetify.js

@@ -2,10 +2,10 @@ import Vue from 'vue';
 import 'material-design-icons-iconfont/dist/material-design-icons.css';
 import Vuetify from 'vuetify/lib/framework';
 import { library } from '@fortawesome/fontawesome-svg-core'
-import { faShareAltSquare, faInfo} from '@fortawesome/free-solid-svg-icons'
+import { faShareAltSquare, faInfoCircle} from '@fortawesome/free-solid-svg-icons'
 import { faFacebookSquare, faTwitterSquare} from '@fortawesome/free-brands-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
-library.add(faFacebookSquare, faTwitterSquare, faShareAltSquare, faInfo)
+library.add(faFacebookSquare, faTwitterSquare, faShareAltSquare, faInfoCircle)
 Vue.component('font-awesome-icon', FontAwesomeIcon);
 
 Vue.use(Vuetify);
@@ -32,7 +32,7 @@ const FONTAWESOME_ICONS = {
   info: {
     component: FontAwesomeIcon,
     props: {
-      icon:  ["fa", "info"]
+      icon:  ["fa", "info-circle"]
     }
   }
 }