style fixes and active color for nav btns

pull/3843/head
lianahus 1 year ago committed by yann300
parent 9ee3929e50
commit af60adc381
  1. 36
      apps/etherscan/src/app/components/HeaderWithSettings.tsx
  2. 27
      apps/etherscan/src/app/routes.tsx
  3. 1
      apps/etherscan/src/app/views/HomeView.tsx
  4. 2
      libs/remix-ui/plugin-manager/src/lib/components/rootView.tsx

@ -16,21 +16,22 @@ interface IconProps {
const HomeIcon: React.FC<IconProps> = ({ from }: IconProps) => {
return (
<NavLink
data-id="home"
to={{
pathname: "/"
}}
state={ from }
<NavLink
data-id="home"
to={{
pathname: "/"
}}
className={({ isActive }) => isActive ? "btn p-0 m-0" : "btn text-dark p-0 m-0"}
state={ from }
>
<CustomTooltip
tooltipText='Home'
tooltipId='etherscan-nav-home'
placement='bottom'
>
<CustomTooltip
tooltipText='Home'
tooltipId='etherscan-nav-home'
placement='bottom'
>
<i className="fas fa-home"></i>
</CustomTooltip>
</NavLink>
<i className="fas fa-home"></i>
</CustomTooltip>
</NavLink>
)
}
@ -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} />

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

@ -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 }) => {

@ -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) => {

Loading…
Cancel
Save