fix: resolve remaining design system type issues

components/DelegatingWidget/Footnote.tsx

@@ -4,7 +4,7 @@ const Footnote = ({ children }) => {
   return (
     <Box
       css={{
-        pt: "$3",
+        paddingTop: "$3",
         color: "gray",
         textAlign: "center",
         fontSize: "$1",

components/Drawer/index.tsx

@@ -6,8 +6,8 @@ import Router, { useRouter } from "next/router";
 import { useEffect } from "react";
 
 import Account from "../Account";
-import Logo from "../Logo";
 import LlamaswapModal from "../LlamaswapModal";
+import Logo from "../Logo";
 
 const Index = ({
   items = [],

components/Hamburger/index.tsx

@@ -7,17 +7,29 @@ const Index = ({ ...props }) => {
         cursor: "pointer",
         flexDirection: "column",
         justifyContent: "center",
-        mr: "$3",
+        marginRight: "$3",
       }}
       {...props}
     >
       <Box
-        css={{ mb: "5px", bc: "$hiContrast", height: "1px", width: "20px" }}
+        css={{
+          marginBottom: "5px",
+          backgroundColor: "$hiContrast",
+          height: "1px",
+          width: "20px",
+        }}
       />
       <Box
-        css={{ mb: "5px", bc: "$hiContrast", height: "1px", width: "16px" }}
+        css={{
+          marginBottom: "5px",
+          backgroundColor: "$hiContrast",
+          height: "1px",
+          width: "16px",
+        }}
+      />
+      <Box
+        css={{ backgroundColor: "$hiContrast", height: "1px", width: "20px" }}
       />
-      <Box css={{ bc: "$hiContrast", height: "1px", width: "20px" }} />
     </Flex>
   );
 };

components/URLVerificationBanner/index.tsx

@@ -1,4 +1,3 @@
-import React from "react";
 import {
   Box,
   Button,
@@ -8,6 +7,7 @@ import {
   Flex,
   Text,
 } from "@livepeer/design-system";
+import React from "react";
 import { FiAlertTriangle, FiX } from "react-icons/fi";
 
 type URLVerificationBannerProps = {

layouts/main.tsx

@@ -8,11 +8,11 @@ import Logo from "@components/Logo";
 import PopoverLink from "@components/PopoverLink";
 import ProgressBar from "@components/ProgressBar";
 import RegisterToVote from "@components/RegisterToVote";
-import URLVerificationBanner from "@components/URLVerificationBanner";
 import Search from "@components/Search";
 import TxConfirmedDialog from "@components/TxConfirmedDialog";
 import TxStartedDialog from "@components/TxStartedDialog";
 import TxSummaryDialog from "@components/TxSummaryDialog";
+import URLVerificationBanner from "@components/URLVerificationBanner";
 import { IS_L2 } from "@lib/chains";
 import { globalStyles } from "@lib/globalStyles";
 import { EMPTY_ADDRESS } from "@lib/utils";
@@ -50,13 +50,13 @@ import Link from "next/link";
 import Router, { useRouter } from "next/router";
 import { ThemeProvider } from "next-themes";
 import React, {
+  ReactNode,
   useCallback,
   useEffect,
   useLayoutEffect,
   useMemo,
   useRef,
   useState,
-  ReactNode,
 } from "react";
 import { isMobile } from "react-device-detect";
 import ReactGA from "react-ga";
@@ -298,7 +298,8 @@ const Layout = ({ children, title = "Livepeer Explorer" }) => {
           JSON.stringify([...storage, uniqueBannerID])
         );
       }
-    } catch (_err) {
+    } catch (error) {
+      console.error(error);
       window.localStorage.setItem(
         `bannersDismissed`,
         JSON.stringify([uniqueBannerID])

package.json

@@ -8,6 +8,7 @@
     "build": "next build",
     "start": "next start",
     "lint": "eslint . --max-warnings 0",
+    "typecheck": "tsc --noEmit --incremental false",
     "format": "prettier . --write",
     "format:check": "prettier . --check"
   },

pages/_error.tsx

@@ -13,14 +13,14 @@ function Error({ statusCode }) {
         width: "100%",
         alignItems: "center",
         justifyContent: "center",
-        bc: "$loContrast",
+        backgroundColor: "$loContrast",
       }}
     >
       <Box
         css={{
           fontSize: "$5",
-          pr: "$4",
-          mr: "$4",
+          paddingRight: "$4",
+          marginRight: "$4",
           borderRight: "1px solid",
           borderColor: "$hiContrast",
         }}