feat: add version tag on the sidebar.

This commit is contained in:
a.bouhuolia
2021-04-06 22:48:24 +02:00
parent d4174bff16
commit 56dc4603ae
3 changed files with 32 additions and 8 deletions

View File

@@ -1,4 +1,5 @@
import React from 'react';
import { Menu, MenuItem } from '@blueprintjs/core';
import SidebarContainer from 'components/Sidebar/SidebarContainer';
import SidebarHead from 'components/Sidebar/SidebarHead';
import SidebarMenu from 'components/Sidebar/SidebarMenu';
@@ -13,6 +14,10 @@ export default function Sidebar() {
<div className="sidebar__menu">
<SidebarMenu />
</div>
<div class="sidebar__version">
0.0.1-beta version.
</div>
</SidebarContainer>
)
}

View File

@@ -24,8 +24,8 @@
padding: 0.7rem 0.5rem;
background: #f5f5f5;
font-size: 14px;
color: #505e71;
font-weight: 500;
color: #3b495d;
font-weight: 600;
border-bottom: 1px solid rgb(224, 224, 224);
> div{

View File

@@ -23,6 +23,12 @@
}
}
.ScrollbarsCustom-Content{
display: flex;
flex-direction: column;
height: 100%;
}
&:hover {
.ScrollbarsCustom-Thumb {
@@ -102,6 +108,19 @@
&__scroll-wrapper {
height: 100%;
}
&__version{
margin-top: auto;
padding: 0 20px 20px;
font-size: 12px;
color: rgba(255, 255, 255, 0.6);
}
&__inner{
height: 100%;
display: flex;
flex-direction: column;
}
&-menu {
background: transparent;
@@ -227,7 +246,8 @@
}
}
.sidebar__menu {
.sidebar__menu,
.sidebar__version {
transition: opacity 0.3s ease-in-out;
opacity: 0;
}
@@ -248,11 +268,10 @@
opacity: 0;
transition-delay: 0s;
}
.sidebar__head-organization{
opacity: 1;
}
.sidebar__menu {
.sidebar__head-organization,
.sidebar__menu,
.sidebar__version {
opacity: 1;
}