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

Clean sidebar layout

Browse Source
This commit is contained in:
Jonathan Bourdon
2025-02-10 23:13:24 -05:00
parent 479753bf3e
commit 3057cbdf16
1 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/views/main/SideBar.vue
View File

@@ -34,7 +34,7 @@ function toggleLanguage() {
</script> </script>
<template> <template>
<nav class="fixed flex flex-col h-full bg-hBackground border-r border-hOnBackground max-w-64 px-1"> <nav class="container">
<div class="mt-4 px-4"> <div class="mt-4 px-4">
<router-link to="/@hutopy"> <router-link to="/@hutopy">
<img src="/images/hutopy-logo.png" <img src="/images/hutopy-logo.png"
@@ -44,8 +44,7 @@ function toggleLanguage() {
<div class="flex-grow"></div> <div class="flex-grow"></div>
<div class="flex flex-col gap-2 p-4">
<div class="flex flex-col gap-4 p-4">
<div class="flex items-center justify-start"> <div class="flex items-center justify-start">
<img :src="userProfileStore.portraitUrl" <img :src="userProfileStore.portraitUrl"
@@ -110,16 +109,21 @@ function toggleLanguage() {
<style scoped> <style scoped>
.container {
@apply fixed flex flex-col h-full max-w-64;
@apply border-r;
@apply bg-hBackground border-[#3d3d3d] text-hOnBackground;
}
.profile { .profile {
@apply ml-4 text-lg font-sans capitalize text-hOnBackground; @apply ml-4 text-lg font-sans capitalize;
@apply font-sans font-semibold; @apply font-sans font-semibold;
} }
.action { .action {
@apply w-full flex items-center gap-4 px-4 py-2 rounded; @apply w-full flex items-center gap-4 px-4 py-2 rounded;
@apply capitalize text-base font-sans font-medium; @apply capitalize text-base font-sans font-medium;
@apply bg-hSecondary text-hOnSecondary; @apply bg-hBackground hover:bg-hSurface; /* FIXME: The hover value is not semantically correct */
@apply hover:brightness-90;
} }
</style> </style>