reworked color theme for the project

main
roberts 2023-05-19 08:34:03 +02:00
parent 9bca0225dd
commit 0a677bf743
11 changed files with 27 additions and 27 deletions

View File

@ -1,9 +1,9 @@
<template>
<input class="search " type="text" v-model="input" placeholder="Search..." />
<input class="search text-white font-bold py-2 px-2 rounded mt-5" type="text" v-model="input" placeholder="Search..." />
<div class="flex">
<div class="exerciseList">
<ul class="exerciseItem" v-for="exercise in filterExercises()" :key="exercise.name">
<button @click="exerciseClick(exercise)" class="btn bg-secondary-button hover:bg-accent text-text font-bold py-2 px-4" >{{ exercise.name }}</button>
<button @click="exerciseClick(exercise)" class="btn bg-secondary-button hover:bg-accent text-white font-bold py-2 px-2 rounded" >{{ exercise.name }}</button>
</ul>
</div>
<div v-for="selectedExercise in selectedExercises" :key="selectedExercise" class="show">

View File

@ -25,7 +25,7 @@
width: 100%;
height: 4rem;
justify-content: start;
background: rgb(91, 154, 102);
background: #0a0e06;
}
.navbar-nav{
display: flex;
@ -36,15 +36,13 @@
.nav-item{
margin-left: 1rem;
margin-right: 1rem;
color: white;
color: #e7f1df;
text-decoration: none;
}
.nav-item:hover{
color: rgb(91, 154, 102);
background: #4510b7;
border-radius: 0.5rem;
transition: 0.5s;
// color: rgb(91, 154, 102);
color: #699f65
}
.logo{

View File

@ -1,5 +1,5 @@
<template>
<div class="text-3xl font-bold underline text-blue-500">
<div class="text-white">
<h1>Back</h1>
<ExerciseList muscle="Back"/>
</div>

View File

@ -1,5 +1,5 @@
<template>
<div class="biceps">
<div class="biceps text-text">
<h1>Biceps</h1>
<ExerciseList muscle="Biceps"/>
</div>

View File

@ -1,5 +1,5 @@
<template>
<div class="flex">
<div class="text-white">
<div class="w-1/2">
<h1>Chest</h1>
<ExerciseList muscle="Chest"/>

View File

@ -1,5 +1,5 @@
<template>
<div class="legs">
<div class="legs text-white">
<h1>Legs</h1>
<ExerciseList muscle="Legs"/>
</div>

View File

@ -1,5 +1,5 @@
<template>
<div class="shoulder">
<div class="shoulder text-white">
<h1>Shoulder</h1>
<ExerciseList muscle="Shoulder"/>
</div>

View File

@ -1,5 +1,5 @@
<template>
<div class="triceps">
<div class="triceps text-white ">
<h1>Triceps</h1>
<ExerciseList muscle="Triceps"/>
</div>

View File

@ -1,10 +1,9 @@
<template>
//TODO make view resposive on button click add
<div class="w-2/3 mx-auto">
<div class="warmup-sets mt-12 w-2/3">
<div class="warmup-sets mt-2">
<label>Warm-Up Sets</label>
<button @click="warmUpAddSet()"
class="add-btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2 rounded ml-5">
class="bg-accent hover:bg-primary-button text-white font-bold py-2 px-2 rounded ml-5">
Add
</button>
<div>
@ -13,7 +12,8 @@
<div class="ml-3">
<input
v-model="weightInput.warmUpSetsWeight[warmUpSetCount]"
type="number" class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1"
type="number"
class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none block rounded-md sm:text-sm "
placeholder="Weight (kg)"
onkeypress='return event.charCode >= 48 && event.charCode <= 57'/>
</div>
@ -22,7 +22,7 @@
<input
v-model="weightInput.warmUpReps[warmUpSetCount]"
type="number"
class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1"
class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none block rounded-md sm:text-sm "
placeholder="Reps"
onkeypress='return event.charCode >= 48 && event.charCode <= 57'/>
</div>
@ -32,7 +32,7 @@
<div class="working-set mt-5">
<label>Working Sets</label>
<button @click="workingAddSet()"
class="add-btn bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-2 rounded ml-7">
class="bg-accent hover:bg-primary-button text-white font-bold py-2 px-2 rounded ml-7">
Add
</button>
@ -43,7 +43,7 @@
<input
v-model="weightInput.workingSetsWeight[workingSetCount]"
type="number"
class="mt-1 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1"
class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none block rounded-md sm:text-sm "
placeholder="Weight (Kg)"
onkeypress='return event.charCode >= 48 && event.charCode <= 57'/>
</div>
@ -51,7 +51,7 @@
<div class="ml-3">
<input v-model="weightInput.workingReps[workingSetCount]"
type="number"
class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none focus:border-sky-500 focus:ring-sky-500 block rounded-md sm:text-sm focus:ring-1"
class="mt-1 px-3 py-2 bg-black border shadow-sm border-slate-300 placeholder-slate-400 focus:outline-none block rounded-md sm:text-sm "
placeholder="Reps"
onkeypress='return event.charCode >= 48 && event.charCode <= 57'> <!-- https://stackoverflow.com/questions/66172698/textbox-which-accepts-only-numbers-in-vue-js -->
</div>
@ -63,7 +63,7 @@
</template>
<script setup>
import { useWeightInputStore } from '@/stores/storeWeight';
import { useWeightInputStore } from '@/stores/storeInput';
const selectedExercise = defineProps({
selectedExercise: String

View File

@ -8,10 +8,12 @@ export default {
extend: {
colors: {
'primary-button':'#5b9a66',
'secondary-button':'#0d1406',
'background':'#000000',
'text': '#daeafb',
'accent': '#b574f1',
// 'secondary-button':'#0d1406',
'secondary-button':'#699f65',
'background':'#131d0c',
'text': '#e7f1df',
'accent': '#361f47',
'accent2': '#63992e',
}
},
},