From f09f742304108dce8beb63afed85028e8edd8a2b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Malin=20Haugland=20H=C3=B8li?= <malin.holi@gmail.com>
Date: Thu, 2 May 2024 12:53:03 +0200
Subject: [PATCH] refactor: :ambulance: Update buttons with new styles
---
src/components/ButtonAddGoalOrChallenge.vue | 2 +-
src/components/FormLogin.vue | 2 +-
src/components/NavBarComponent.vue | 14 +++++++++-----
src/components/PageControl.vue | 14 +++++++-------
4 files changed, 18 insertions(+), 14 deletions(-)
diff --git a/src/components/ButtonAddGoalOrChallenge.vue b/src/components/ButtonAddGoalOrChallenge.vue
index 3516e5c..cbda9d4 100644
--- a/src/components/ButtonAddGoalOrChallenge.vue
+++ b/src/components/ButtonAddGoalOrChallenge.vue
@@ -1,6 +1,6 @@
<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
diff --git a/src/components/FormLogin.vue b/src/components/FormLogin.vue
index 3635800..02b3e9c 100644
--- a/src/components/FormLogin.vue
+++ b/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
diff --git a/src/components/NavBarComponent.vue b/src/components/NavBarComponent.vue
index f73a9e9..1da034d 100644
--- a/src/components/NavBarComponent.vue
+++ b/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>
diff --git a/src/components/PageControl.vue b/src/components/PageControl.vue
index 3ed526b..93ad991 100644
--- a/src/components/PageControl.vue
+++ b/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>
--
GitLab