formatting

src/components/Sidebar/SidebarElements.jsx

@@ -1,12 +1,10 @@
-import styled from 'styled-components'
-import {Link as LinkS} from 'react-scroll'
-import {Link as LinkR} from 'react-router-dom'
-import {FaTimes} from 'react-icons/fa'
-
-
+import { FaTimes } from "react-icons/fa";
+import { Link as LinkR } from "react-router-dom";
+import { Link as LinkS } from "react-scroll";
+import styled from "styled-components";
 
 export const SidebarContainer = styled.aside`
-    position:fixed ; 
+    position: fixed;
     z-index: 999;
     width: 100%;
     height: 100%;
@@ -16,18 +14,17 @@ export const SidebarContainer = styled.aside`
     top: 0;
     left: 0;
     transition: 0.3s ease-in-out;
-    opacity: ${({ isOpen }) => (isOpen ? '100%' :  '0')};
-    top: ${({ isOpen }) => (isOpen ? '0' : '-100%')};   
- 
-`
+    opacity: ${({ isOpen }) => (isOpen ? "100%" : "0")};
+    top: ${({ isOpen }) => (isOpen ? "0" : "-100%")};
+`;
 
 export const CloseIcon = styled(FaTimes)`
-    color: #fff ; 
+    color: #fff;
     &:hover {
         color: #01bf71;
         transition: 0.2s ease-in-out;
     }
-`
+`;
 
 export const Icon = styled.div`
     position: absolute;
@@ -37,25 +34,25 @@ export const Icon = styled.div`
     font-size: 2rem;
     cursor: pointer;
     outline: none;
-`
+`;
 
 export const SidebarWrapper = styled.div`
     color: #ffffff;
-`
+`;
 
 export const SidebarMenu = styled.ul`
     display: grid;
     grid-template-columns: 1fr;
-    grid-template-rows: repeat(6,80px);
+    grid-template-rows: repeat(6, 80px);
     text-align: center;
 
-    @media screen and (max-width: 480px){
-        grid-template-rows: repeat(6, 60px) ; 
+    @media screen and (max-width: 480px) {
+        grid-template-rows: repeat(6, 60px);
     }
-`
+`;
 
 export const SidebarLink = styled(LinkS)`
-    display: flex ;
+    display: flex;
     align-items: center;
     justify-content: center;
     font-size: 1.5rem;
@@ -70,14 +67,14 @@ export const SidebarLink = styled(LinkS)`
         color: #01bf71;
         transition: 0.2s ease-in-out;
     }
-`
+`;
 
-export const SideBtnWrap = styled.div` 
+export const SideBtnWrap = styled.div`
     display: flex;
     justify-content: center;
-`
+`;
 
-export const SidebarRoute = styled(LinkR)` 
+export const SidebarRoute = styled(LinkR)`
     border-radius: 50px;
     background: #01bf71;
     white-space: nowrap;
@@ -95,4 +92,4 @@ export const SidebarRoute = styled(LinkR)`
         background: #fff;
         color: #010606;
     }
-`
+`;