Finally I fixed the god damn navbar, tailwind to the rescue

This commit is contained in:
ajdj100
2023-05-24 07:24:31 -04:00
parent 03a82ca88a
commit 0f13944eb4
7 changed files with 39 additions and 48 deletions

View File

@@ -25,7 +25,7 @@ export default {
<!-- TODO: Connect these buttons to the scripts, figure out if I can turn this into a component or summ -->
<navitem icon="carbon:user" link="/profile" @click="setActive('#user')" :active="activeButton === '#user'" />
<hr>
<hr class="text-white">
<navitem icon="carbon:home" link="/" @click="setActive('#home')" :active="activeButton === '#home'" />
<navitem icon="carbon:events" link="/users" @click="setActive('#users')" :active="activeButton === '#users'"/>
<navitem icon="carbon:align-box-bottom-left" link="#" @click="setActive('#docs')" :active="activeButton === '#docs'"/>

View File

@@ -35,23 +35,25 @@ export default {
</script>
<template>
<RouterLink :to="link" class="button" :class="{active: active}">
<Icon :icon="icon" />
</RouterLink>
<div class="aspect-square flex items-center place-content-center">
<RouterLink :to="link" class="button" :class="{ active: active }">
<Icon :icon="icon" />
</RouterLink>
</div>
</template>
<style scoped>
.button {
color: var(--white);
font-size: 30px;
overflow: hidden;
height: 40px;
font-size: 35px;
/* overflow: hidden; */
/* height: 40px; */
display: flex;
align-items: center;
justify-content: center;
margin: 10px 10px;
padding: 5px;
margin: 10px;
padding: 10px;
transition: color 0.2s ease-in-out;
}