jbourdon/social-media
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixe header

Browse Source
This commit is contained in:
PascalMarchesseault
2024-08-30 09:57:57 -04:00
parent 8cf9eddb5c
commit 5e8b8e0a93
1 changed files with 13 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/views/main/Header.vue
View File

@@ -79,8 +79,7 @@
<v-btn <v-btn
variant="text" variant="text"
class="p-0 mx-0 min-w-0" class="p-0 mx-0 min-w-0"
style="min-width: 24px;"
@click="toggleLanguage" @click="toggleLanguage"
> >
{{ selectedLanguage === 'fr' ? 'Fr' : 'En' }} {{ selectedLanguage === 'fr' ? 'Fr' : 'En' }}
@@ -90,7 +89,7 @@
<v-menu open-on-hover> <v-menu open-on-hover>
<template v-slot:activator="{ props }"> <template v-slot:activator="{ props }">
<div v-bind="props" class="flex align-center font-sans py-1 px-2 rounded-lg hover:bg-gray-100"> <div v-bind="props" class="flex align-center font-sans py-1 px-2 rounded-lg hover:bg-gray-100">
<span class="max-w-xs hidden md:block"> <span class="max-w-xs hidden md:block capitalize">
{{ userStore.alias }} {{ userStore.alias }}
</span> </span>
<img <img
@@ -232,12 +231,22 @@ function toggleLanguage() {
.nav-button:hover { .nav-button:hover {
@apply bg-[#903175] text-gray-200; @apply bg-[#903175] text-gray-200;
} }
/* Explorer & feed others */
.absolute-center { .absolute-center {
position: absolute; position: absolute;
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
display: flex; display: flex;
gap: 6px; gap: 6px;
align-items: center; align-items: center;
} }
/* Explorer & feed center mobile */
@media (max-width: 640px) {
.absolute-center {
left: 65%;
transform: translateX(-55%);
}
}
</style> </style>