rayan/bruno
1
0
Fork 0
mirror of https://github.com/usebruno/bruno.git synced 2026-07-07 14:08:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: vscode themed menubar

Browse Source
This commit is contained in:
Anoop M D
2022-01-31 10:36:29 +05:30
parent 42fa05bc0f
commit 87907eeb53
11 changed files with 169 additions and 72 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
packages/grafnode-components/src/components/Sidebar/MenuBar/StyledWrapper.js Normal file
View File

@@ -0,0 +1,17 @@
import styled from 'styled-components';
const Wrapper = styled.div`
background-color: rgb(44, 44, 44);
color: rgba(255, 255, 255, 0.5);
.menu-item {
padding: 0.6rem;
cursor: pointer;
&:hover, &.active {
color: rgba(255, 255, 255);
}
}
`;
export default Wrapper;

37
packages/grafnode-components/src/components/Sidebar/MenuBar/index.js Normal file
View File

@@ -0,0 +1,37 @@
import React from 'react';
import { IconCode, IconStack, IconGitPullRequest, IconUser, IconUsers, IconSettings, IconLayoutGrid } from '@tabler/icons';
import StyledWrapper from './StyledWrapper';
const MenuBar = () => {
return (
<StyledWrapper className="h-full flex flex-col">
<div className="flex flex-col">
<div className="menu-item active">
<IconCode size={28} strokeWidth={1.5}/>
</div>
<div className="menu-item">
<IconStack size={28} strokeWidth={1.5}/>
</div>
<div className="menu-item">
<IconGitPullRequest size={28} strokeWidth={1.5}/>
</div>
<div className="menu-item">
<IconUsers size={28} strokeWidth={1.5}/>
</div>
<div className="menu-item">
<IconLayoutGrid size={28} strokeWidth={1.5}/>
</div>
</div>
<div className="flex flex-col flex-grow justify-end">
<div className="menu-item">
<IconUser size={28} strokeWidth={1.5}/>
</div>
<div className="menu-item">
<IconSettings size={28} strokeWidth={1.5}/>
</div>
</div>
</StyledWrapper>
);
};
export default MenuBar;