initial commit

web/src/shared/components/Sidebar/Sidebar.stories.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import NormalizeStyles from 'App/NormalizeStyles';
+import BaseStyles from 'App/BaseStyles';
+import Sidebar from './index';
+
+import Navbar from 'shared/components/Navbar';
+
+export default {
+  component: Sidebar,
+  title: 'Sidebar',
+  parameters: {
+    backgrounds: [
+      { name: 'white', value: '#ffffff' },
+      { name: 'gray', value: '#cdd3e1', default: true },
+    ],
+  },
+};
+
+export const Default = () => {
+  return (
+    <>
+      <NormalizeStyles />
+      <BaseStyles />
+      <Navbar />
+      <Sidebar />
+    </>
+  );
+};
+

web/src/shared/components/Sidebar/Styles.ts

@@ -0,0 +1,15 @@
+import styled from 'styled-components';
+
+export const Container = styled.div`
+  position: fixed;
+  z-index: 99;
+  top: 0px;
+  left: 80px;
+  height: 100vh;
+  width: 230px;
+  overflow-x: hidden;
+  overflow-y: auto;
+  padding: 0px 16px 24px;
+  background: rgb(244, 245, 247);
+  border-right: 1px solid rgb(223, 225, 230);
+`;

web/src/shared/components/Sidebar/index.tsx

@@ -0,0 +1,9 @@
+import React from 'react';
+
+import { Container } from './Styles';
+
+const Sidebar = () => {
+  return <Container></Container>;
+};
+
+export default Sidebar;