feat: move about & rules pages to the sidebar layout

src/components/Sidebar/index.tsx

@@ -30,6 +30,7 @@ export const Sidebar: FC<PropsWithChildren<
   HTMLAttributes<HTMLDivElement>
 >> = props => {
   const { children, ...restProps } = props
+  const isBorderVisible = children === undefined ? false : true
 
   return (
     <SC.SidebarWrapper {...restProps}>
@@ -40,7 +41,7 @@ export const Sidebar: FC<PropsWithChildren<
         <SC.Inner>
           {children}
 
-          <SC.Menu>
+          <SC.Menu borderVisibility={isBorderVisible}>
             <MenuItem to="/about">about</MenuItem>
             <MenuItem to="/rules">rules</MenuItem>
             <MenuItem to="/resources">resources</MenuItem>

src/components/Sidebar/styles.tsx

@@ -34,7 +34,8 @@ export const Inner = styled.div`
 export const Menu = styled.nav`
   display: flex;
   flex-direction: column;
-  border-top: 1px dashed #a5a5a5;
+  border-top: ${props =>
+    props.borderVisibility ? "1px dashed #a5a5a5" : "none"};
   margin: 20px 0 40px;
   padding-top: 20px;
 `