refactor: Update buttons with new styles

src/components/ButtonAddGoalOrChallenge.vue

 <template>
     <button
-        class="w-full max-w-60 max-h-12 font-bold py-2 rounded-full flex items-center justify-start pl-4 space-x-2 focus:outline-none focus:ring-2 focus:ring-green-700 focus:ring-opacity-50 shadow-md transition duration-300 ease-in-out text-xs md:text-sm lg:text-base"
+        class="primary w-full max-w-60 py-2 flex items-center justify-start pl-4 space-x-2 focus:outline-none focus:ring-2 focus:ring-opacity-50 shadow-md text-xs md:text-sm lg:text-base"
         @click="routeToGoalOrChallenge"
     >
         <svg

src/components/FormLogin.vue

@@ -115,7 +115,7 @@ watch(
             <button
                 name="submit"
                 :disabled="'' == username.valueOf() || '' == password.valueOf()"
-                class="grow-0"
+                class="primary grow-0"
                 @click="submitForm"
             >
                 Logg inn

src/components/NavBarComponent.vue

@@ -24,9 +24,13 @@
         </div>
 
         <div v-if="!isHamburger" class="flex justify-center w-40">
-            <button class="focus:ring focus:ring-black-300" @click="openModal">Logg ut</button>
+            <button class="primary bg-[#95e35d] logout focus:ring focus:ring-black-300" @click="openModal">Logg ut</button>
         </div>
-        <button v-if="isHamburger" @click="toggleMenu">☰</button>
+        <button
+            class="primary logout" 
+            v-if="isHamburger" 
+            @click="toggleMenu">☰
+        </button>
     </nav>
 
     <div v-if="hamburgerOpen" class="flex flex-col bg-white border border-slate-300 z-50">
@@ -36,7 +40,7 @@
             >💰Spareutfordringer</router-link
         >
         <router-link to="/profil" @click="hamburgerOpen = false">🤭Profil</router-link>
-        <button class="focus:ring focus:ring-black-300 bg-transparent" @click="openModal">
+        <button class="focus:ring focus:ring-black-300" @click="openModal">
             Logg ut
         </button>
     </div>
@@ -49,13 +53,13 @@
         <template v-slot:buttons>
             <button
                 @click="logout"
-                class="active-button font-bold py-2 px-4 w-1/2 border-2 disabled:border-transparent"
+                class="primary"
             >
                 Logg ut
             </button>
             <button
                 @click="closeModal"
-                class="active-button font-bold py-2 px-4 w-1/2 border-2 disabled:border-transparent bg-red-400 hover:bg-red-300"
+                class="primary danger"
             >
                 Avbryt
             </button>

src/components/PageControl.vue

@@ -17,18 +17,18 @@ defineProps({
 
 <template>
     <div v-if="totalPages > 0" class="flex justify-center gap-4">
-        <button :disabled="currentPage === 0" @click="onPageChange(currentPage - 1)">
+        <button 
+            class="primary"
+            :disabled="currentPage === 0" @click="onPageChange(currentPage - 1)">
             Forrige
         </button>
         <p>{{ currentPage + 1 }} / {{ totalPages }}</p>
-        <button :disabled="currentPage === totalPages - 1" @click="onPageChange(currentPage + 1)">
+        <button 
+            class="primary"
+            :disabled="currentPage === totalPages - 1" @click="onPageChange(currentPage + 1)">
             Neste
         </button>
     </div>
 </template>
 
-<style scoped>
-button:disabled:hover {
-    background-color: #cbcbcb;
-}
-</style>
+<style scoped></style>