I found part of the bug for mobile (the empty space on the side) - Still need to fix the profile picture and social media icons (as they create space).
Move the language button and its logic. Modify the sidebar (add navigation buttons for mobile). Fix the display bug for the Subscription list.
This commit is contained in:
@@ -74,7 +74,8 @@
|
||||
class="flex flex-row justify-center"
|
||||
@click="feedHandler"
|
||||
>
|
||||
<v-icon>mdi-television</v-icon>
|
||||
<img src="/images/hutopymedia/icons/feedfollow.svg" alt="feed follow icon"
|
||||
style="filter: invert(0.5) brightness(0.0); width: 32px; height: 32px;" />
|
||||
</v-btn>
|
||||
<v-btn
|
||||
variant="plain"
|
||||
@@ -92,14 +93,6 @@
|
||||
<v-icon class="mx-2 cursor-pointer" @click.stop="toggleSearch">mdi-magnify</v-icon>
|
||||
</template>
|
||||
|
||||
<v-btn
|
||||
variant="text"
|
||||
class="p-0 mx-0 min-w-0"
|
||||
@click="toggleLanguage"
|
||||
>
|
||||
{{ selectedLanguage === 'fr' ? 'Fr' : 'En' }}
|
||||
</v-btn>
|
||||
|
||||
<div class="text-center">
|
||||
<v-menu open-on-click>
|
||||
<template v-slot:activator="{ props }">
|
||||
@@ -168,10 +161,8 @@ import { useRouter } from 'vue-router';
|
||||
import { useSideBarStore } from '@/stores/sideBarStore.js';
|
||||
import { useUserStore } from "@/stores/userStore.js";
|
||||
import { useAuthStore } from "@/stores/authStore.js";
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useDisplay } from 'vuetify';
|
||||
|
||||
const { locale } = useI18n();
|
||||
const authStore = useAuthStore();
|
||||
const userStore = useUserStore();
|
||||
const sideBarStore = useSideBarStore();
|
||||
@@ -186,9 +177,6 @@ watch(smAndDown, (val) => {
|
||||
isSmallScreen.value = val;
|
||||
});
|
||||
|
||||
let selectedLanguage = ref(locale.value);
|
||||
initializeLocale();
|
||||
|
||||
const onSearch = () => {
|
||||
const query = searchQuery.value.trim();
|
||||
if (!query) {
|
||||
@@ -228,19 +216,6 @@ onBeforeMount(() => {
|
||||
onBeforeUnmount(() => {
|
||||
document.removeEventListener('click', handleClickOutside);
|
||||
});
|
||||
|
||||
function initializeLocale(){
|
||||
const preferredLocale = localStorage.getItem('preferredLocale');
|
||||
selectedLanguage = ref(preferredLocale === null ? locale.value : preferredLocale);
|
||||
locale.value = selectedLanguage.value;
|
||||
}
|
||||
|
||||
function toggleLanguage() {
|
||||
const lang = selectedLanguage.value === 'fr' ? 'en' : 'fr';
|
||||
locale.value = lang;
|
||||
selectedLanguage.value = lang;
|
||||
localStorage.setItem('preferredLocale', lang);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
Reference in New Issue
Block a user