arthur/artsite
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/artsite.git synced 2026-01-23 09:51:50 +01:00
Code Issues 1 Packages Projects Releases Wiki Activity

Update header styles and improve visitor tooltip design

Browse Source 
Adjusted header alignment for better responsiveness. Enhanced visitor tooltip by refining spacing, adding background color, and improving text readability for both light and dark themes.
This commit is contained in:
Arthur Danjou
2025-01-28 16:47:53 +01:00
parent 9fc569a521
commit 86b5669947
2 changed files with 6 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
app/components/AppHeader.vue
View File

@@ -108,7 +108,7 @@ defineShortcuts({
</script>
<template>
<header class="flex items-center justify-between my-8 gap-2">
<header class="flex md:items-center justify-between my-8 gap-2">
<NuxtLinkLocale
class="handwriting text-xl sm:text-3xl text-nowrap gap-2 font-bold duration-300 text-gray-600 hover:text-black dark:text-gray-400 dark:hover:text-white"
to="/"

8
app/components/AppVisitors.vue
View File

@@ -3,10 +3,12 @@ const { isLoading, visitors } = useVisitors()
</script>
<template>
<div class="fixed bottom-4 right-8">
<div class="fixed bottom-4 right-4">
<UTooltip text="Visitors currently on my portfolio" placement="left">
<nav v-if="!isLoading" class="text-xs flex space-x-1 items-center border border-green-400 dark:border-green-600 px-2 rounded-xl">
<div>{{ visitors }}</div>
<nav v-if="!isLoading" class="text-xs flex space-x-1 items-center border border-green-400 dark:border-green-600 px-2 rounded-xl bg-white dark:bg-black">
<p class="text-neutral-700 dark:text-neutral-300">
{{ visitors }}
</p>
<div class="h-3 w-3 bg-green-200 dark:bg-green-600 rounded-full border-2 border-green-400 dark:border-green-800" />
</nav>
</UTooltip>