style fixes and active color for nav btns

apps/etherscan/src/app/components/HeaderWithSettings.tsx

@@ -21,6 +21,7 @@ const HomeIcon: React.FC<IconProps> = ({ from }: IconProps) => {
       to={{
         pathname: "/"
       }}
+      className={({ isActive }) => isActive ? "btn p-0 m-0" : "btn text-dark p-0 m-0"}
       state={ from }
     >
       <CustomTooltip
@@ -41,8 +42,8 @@ const ReceiptsIcon: React.FC<IconProps> = ({ from }: IconProps) => {
         to={{
           pathname: "/receipts"
         }}
+        className={({ isActive }) => isActive ? "btn p-0 m-0 mx-2" : "btn text-dark p-0 m-0 mx-2"}
         state={ from }
-        className="mx-2"
       >
         <CustomTooltip
           tooltipText='Receipts'
@@ -62,6 +63,7 @@ const SettingsIcon: React.FC<IconProps> = ({ from }: IconProps) => {
       to={{
         pathname: "/settings"
       }}
+      className={({ isActive }) => isActive ? "btn p-0 m-0" : "btn text-dark p-0 m-0"}
       state= {from}
     >
       <CustomTooltip
@@ -83,9 +85,9 @@ export const HeaderWithSettings: React.FC<Props> = ({
   return (
     <AppContext.Consumer>
       {() => (
-        <div>
+        <div className="d-flex justify-content-between">
           <h6 className="d-inline">{title}</h6>
-          <div style={{ float: "right" }}>
+          <div>
             <HomeIcon from={from} />
             <ReceiptsIcon from={from} />
             <SettingsIcon from={from} />

apps/etherscan/src/app/routes.tsx

@@ -31,21 +31,30 @@ export const DisplayRoutes = () => (
     <Routes>    
       <Route
         path="/"
-        element={<DefaultLayout from="/" title="Verify Smart Contracts">
+        element={
+          <DefaultLayout from="/" title="Verify Smart Contracts">
             <HomeView />
-                </DefaultLayout>} />
+          </DefaultLayout>
+        }
+      />
       <Route path="/error"
       element={<ErrorView />} />
       <Route
         path="/receipts"
-        element={<DefaultLayout from="/receipts" title="Check Receipt GUID Status">
+        element={
+          <DefaultLayout from="/receipts" title="Check Receipt GUID Status">
             <ReceiptsView />
-                </DefaultLayout>} />
+          </DefaultLayout>
+        }
+      />
       <Route
         path="/settings"
-        element={<DefaultLayout from="/settings" title="Set Explorer API Key">
+        element={
+          <DefaultLayout from="/settings" title="Set Explorer API Key">
             <CaptureKeyView />
-                </DefaultLayout>} />
+          </DefaultLayout>
+        }
+      />
     </Routes>
   </Router>
 )

apps/etherscan/src/app/views/HomeView.tsx

@@ -8,7 +8,6 @@ import { Receipt } from "../types"
 import { VerifyView } from "./VerifyView"
 
 export const HomeView: React.FC = () => {
-  // const [hasError, setHasError] = useState(false)
   return (
     <AppContext.Consumer>
       {({ apiKey, clientInstance, setReceipts, receipts, contracts }) => {

libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx

@@ -36,7 +36,7 @@ function RootView ({ pluginComponent, children }: RootViewProps) {
   return (
     <Fragment>
       <div id="pluginManager" data-id="pluginManagerComponentPluginManager">
-        <header className="form-group remixui_pluginSearch plugins-header py-3 px-4 border-bottom" data-id="pluginManagerComponentPluginManagerHeader">
+        <header className="form-group remixui_pluginSearch plugins-header pt-3 pb-0 px-4 border-bottom" data-id="pluginManagerComponentPluginManagerHeader">
           <input
             type="text"
             onChange={(event) => {