added comments for sourcing of code
parent
29d68d8b9b
commit
bd008c5961
|
|
@ -1,9 +1,9 @@
|
||||||
<template>
|
<template>
|
||||||
<input type="text" v-model="input" placeholder="Search..." />
|
<input type="text" v-model="input" placeholder="Search..." />
|
||||||
<div class="exerciseList">
|
<div class="exerciseList">
|
||||||
<li class="exerciseItem" v-for="exercise in filterExercises()" :key="exercise.name">
|
<ul class="exerciseItem" v-for="exercise in filterExercises()" :key="exercise.name">
|
||||||
<button class="button">{{ exercise.name }}</button>
|
<button class="button">{{ exercise.name }}</button>
|
||||||
</li>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -44,6 +44,8 @@ onMounted(async () => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
|
// filter exercises with help from https://blog.logrocket.com/create-search-bar-vue/ last accessed 05.05.2023
|
||||||
let input = ref('');
|
let input = ref('');
|
||||||
function filterExercises(){
|
function filterExercises(){
|
||||||
return exercises.value.filter((exercise) => {
|
return exercises.value.filter((exercise) => {
|
||||||
|
|
|
||||||
|
|
@ -19,6 +19,7 @@
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
|
// styling for the navbar (with reference to https://css-tricks.com/snippets/css/a-guide-to-flexbox/#aa-flexbox-properties last accessed 05.05.2023)
|
||||||
.navbar{
|
.navbar{
|
||||||
display: flex;
|
display: flex;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue