Finally I fixed the god damn navbar, tailwind to the rescue
This commit is contained in:
@@ -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'"/>
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user