danielvici123/esp-projekt
Archived
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Settings added (only one part), notification started and highlight added

Browse Source
This commit is contained in:
danielvici123
2024-11-10 18:10:28 +01:00
parent 860cd027cd
commit 2352c25c05
20 changed files with 526 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/components/settings_components/settings_sidebar.vue Normal file
View File

@@ -0,0 +1,25 @@
<script setup lang="ts">
import { defineEmits } from 'vue';
import { ref } from 'vue';
const emit = defineEmits(['updateSetting']);
const selectedSetting = ref('');
function updateSetting(setting: string) {
selectedSetting.value = setting;
emit('updateSetting', setting);
console.log(`Setting selected (SS): ${setting}`);
}
</script>
<template>
<div class="text-grau2 font-bold space-y-4 pl-2 pt-5">
<label class="flex text-center shadow-2xl rounded-lg" :class="{'text-weiss': selectedSetting === 'setting_account' || selectedSetting === ''}" @click="updateSetting('setting_account')"><img class="pr-2" src="../../assets/icons/user.png" alt=""> Account</label>
<label class="flex text-center shadow-2xl rounded-lg" :class="{'text-weiss': selectedSetting === 'setting_privacy'}" @click="updateSetting('setting_privacy')"><img class="pr-2" src="../../assets/icons/shield.png" alt=""> Privacy and Saftey</label>
<label class="flex text-center shadow-2xl rounded-lg" :class="{'text-weiss': selectedSetting === 'setting_message'}" @click="updateSetting('setting_messages')"><img class="pr-2" src="../../assets/icons/mail.png" alt=""> Messages</label>
<label class="flex text-center shadow-2xl rounded-lg" :class="{'text-weiss': selectedSetting === 'setting_other'}" @click="updateSetting('setting_other')"><img class="pr-2" src="../../assets/icons/other.png" alt=""> Other</label>
</div>
</template>
<style scoped>
</style>