Updated navigation.

This commit is contained in:
Mike Cao 2023-03-21 21:28:36 -07:00
parent 611169c65f
commit fc2a8f3d9f
13 changed files with 156 additions and 123 deletions

View file

@ -1,62 +1,49 @@
.navbar {
position: relative;
display: flex;
flex-direction: column;
flex-direction: row;
align-items: center;
height: 60px;
background: var(--base75);
height: 100%;
width: 200px;
border-right: 2px solid var(--base200);
border-bottom: 1px solid var(--base200);
padding: 0 20px;
}
.header {
.logo {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
font-size: 16px;
font-weight: 700;
padding: 20px 0;
cursor: pointer;
min-width: 0;
}
.header:hover .icon {
visibility: visible;
}
.icon {
visibility: hidden;
position: absolute;
right: -10px;
border-radius: 100%;
color: var(--base50);
background: var(--base800);
height: 20px;
width: 20px;
}
.minimized.navbar {
width: 60px;
}
.minimized .text {
display: none;
}
.footer {
flex: 1;
.links {
display: flex;
flex-direction: column;
justify-content: flex-end;
padding: 20px;
flex-direction: row;
gap: 20px;
padding: 0 40px;
flex: 1;
font-weight: 700;
}
.buttons {
.links a {
display: flex;
align-items: center;
justify-content: center;
gap: 10px;
color: var(--font-color100);
}
.minimized .buttons {
flex-direction: column;
.links a:hover {
color: var(--primary400);
}
.actions {
display: flex;
flex-direction: row;
align-items: center;
justify-content: flex-end;
min-width: 0;
}