removed logo muted

www/reference/src/components/ColorModeToggler/index.js

@@ -7,18 +7,18 @@ import { ThemeToggler } from 'gatsby-plugin-dark-mode'
 import { useColorMode } from 'theme-ui'
 
 export default function ColorModeToggler () {
-  const [colorMode, setColorMode] = useColorMode()
+  const [, setColorMode] = useColorMode()
   
   return (
     <ThemeToggler>
         {({ theme, toggleTheme }) => (
           <button onClick={() => {
-            const mode = theme == 'dark' ? 'light' : 'dark';
+            const mode = theme === 'dark' ? 'light' : 'dark';
             toggleTheme(mode);
             setColorMode(mode);
           }} className="dark-mode-toggler">
-            {theme == "light" && <LightMode />}
+            {theme === "light" && <LightMode />}
-            {theme == "dark" && <DarkMode />}
+            {theme === "dark" && <DarkMode />}
           </button>
         )}
     </ThemeToggler>

www/reference/src/components/CopyToClipboard/index.js

@@ -1,9 +1,10 @@
+import { Box, Text } from "theme-ui"
 import React, { useState } from "react"
-import { Flex, Box, Text } from "theme-ui"
+
 import Clipboard from '../icons/clipboard'
 import ReactTooltip from "react-tooltip"
-import styled from "@emotion/styled"
 import copy from 'copy-to-clipboard'
+import styled from "@emotion/styled"
 
 const StyledTooltip = ({id, text}) => {
   const StyledTooltip = styled(ReactTooltip)`

www/reference/src/components/icons/github.js

@@ -5,11 +5,11 @@ import React from "react"
 import { useColorMode } from 'theme-ui'
 
 const GitHub = () => {
-  const [colorMode, setColorMode] = useColorMode()
+  const [colorMode,] = useColorMode()
 
   return (
     <Image
-      src={colorMode == 'light' ? Logo : LogoLight}
+      src={colorMode === 'light' ? Logo : LogoLight}
       sx={{
         height: "24px",
       }}

www/reference/src/components/side-bar/index.js

@@ -3,7 +3,6 @@ import React, { useEffect, useState } from "react"
 
 import Logo from "../../assets/logo.svg"
 import LogoDark from "../../assets/logo-dark.svg"
-import LogoMuted from "../../assets/logo-muted.svg"
 import SideBarItem from "./sidebar-item"
 import SideBarSelector from "./sidebar-selector"
 import { navigate } from "gatsby"
@@ -28,7 +27,7 @@ const SideBarFade = styled(Box)`
 
 const Sidebar = ({ data, api }) => {
   const [scrollPos, setScrollPos] = useState(0)
-  const [colorMode, setColorMode] = useColorMode()
+  const [colorMode,] = useColorMode()
 
   useEffect(() => {
     const nav = document.querySelector("#nav")
@@ -68,7 +67,7 @@ const Sidebar = ({ data, api }) => {
       >
         <Flex>
           <Image
-            src={colorMode == 'light' ? Logo : LogoDark}
+            src={colorMode === 'light' ? Logo : LogoDark}
             alt="Medusa logo"
             onClick={() => navigate("/")}
             sx={{
@@ -100,9 +99,6 @@ const Sidebar = ({ data, api }) => {
           return <SideBarItem item={s} key={i} />
         })}
       </Flex>
-      <Flex sx={{ py: 4, px: 4, borderTop: "1px solid var(--theme-ui-colors-separator)" }}>
-        <Image src={LogoMuted} alt="Medusa Type" sx={{ height: "10px" }} />
-      </Flex>
     </SideBarContainer>
   )
 }

www/reference/src/templates/reference-page.js

@@ -9,7 +9,7 @@ import { convertToKebabCase } from "../utils/convert-to-kebab-case"
 export default function ReferencePage({
   pageContext: { data, api, title, description, to },
 }) {
-  const { setApi, goTo, metadata, currentSection, currentSectionObj } = useContext(NavigationContext)
+  const { setApi, goTo, metadata, currentSectionObj } = useContext(NavigationContext)
   const [siteData, setSiteData] = useState({
     title: title,
     description: description,