Skip to content

Commit

Permalink
Add hover effect on nav elements, fixes Hyperfoil#826
Browse files Browse the repository at this point in the history
  • Loading branch information
@shivam-sharma7
shivam-sharma7 committed Nov 11, 2023
1 parent f389d9d commit 54347ea
Showing 1 changed file with 71 additions and 97 deletions.
168 changes: 71 additions & 97 deletions horreum-web/src/App.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,8 @@ import { Component } from "react"
import "@patternfly/patternfly/patternfly.css" //have to use this import to customize scss-variables.scss

import { Nav, NavItem, NavList, Page, PageHeader, PageHeaderTools } from "@patternfly/react-core"
import {Router, NavLink } from "react-router-dom"

import { Router, NavLink } from "react-router-dom"

import { Provider, useSelector } from "react-redux"
import { Route, Switch } from "react-router"
Expand Down Expand Up @@ -55,103 +55,77 @@ function Main() {
const isAdmin = useSelector(isAdminSelector)
return (
<Provider store={store}>
<Router history={history}>
<Banner />
<Page
header={
<PageHeader
topNav={
<Nav aria-label="Nav" variant="horizontal">
<NavList>
<NavItem itemId={-1}>
<NavLink to="/">
<img width="24" height="24" src="/logo.png" alt="Horreum Logo" />
</NavLink>
</NavItem>
{/* TODO: fix links colors properly */}
<NavItem itemId={0}>
<NavLink
to="/test"
style={{ color: "var(--pf-c-nav--m-horizontal__link--Color)" }}
>
Tests
</NavLink>
</NavItem>
<NavItem itemId={1}>
<NavLink
to="/schema"
style={{ color: "var(--pf-c-nav--m-horizontal__link--Color)" }}
>
Schema
</NavLink>
</NavItem>
<NavItem itemId={2}>
<NavLink
to="/changes"
style={{ color: "var(--pf-c-nav--m-horizontal__link--Color)" }}
>
Changes
</NavLink>
</NavItem>
<NavItem itemId={3}>
<NavLink
to="/reports"
style={{ color: "var(--pf-c-nav--m-horizontal__link--Color)" }}
>
Reports
</NavLink>
</NavItem>
{isAdmin && (
<NavItem itemId={4}>
<NavLink
to="/admin"
style={{ color: "var(--pf-c-nav--m-horizontal__link--Color)" }}
>
Administration
<Router history={history}>
<Banner />
<Page
header={
<PageHeader
topNav={
<Nav aria-label="Nav" variant="horizontal">
<NavList>
<NavItem itemId={-1}>
<NavLink to="/">
<img width="24" height="24" src="/logo.png" alt="Horreum Logo" />
</NavLink>
</NavItem>
)}
</NavList>
</Nav>
}
headerTools={
<PageHeaderTools>
<UserProfileLink />
<LoginLogout />
<About />
</PageHeaderTools>
}
/>
}
>
<Alerts />
<Switch>
<Route exact path="/" component={AllTests} />
<Route exact path="/test" component={AllTests} />
<Route exact path="/test/:testId" component={Test} />

<Route exact path="/run/list/:testId" component={TestRuns} />
<Route exact path="/run/dataset/list/:testId" component={TestDatasets} />
<Route exact path="/run/:id" component={Run} />
<Route exact path="/dataset/comparison" component={DatasetComparison} />

<Route exact path="/schema" component={AllSchema} />
<Route path="/schema/:schemaId" component={Schema} />

<Route exact path="/changes" component={Changes} />

<Route exact path="/reports" component={Reports} />
<Route exact path="/reports/table/config/:configId" component={TableReportConfigPage} />
<Route exact path="/reports/table/:id" component={TableReportPage} />

<Route exact path="/admin" component={Admin} />
<Route exact path="/usersettings" component={UserSettings} />
<Route component={NotFound} />
</Switch>
</Page>
{/* <ContextHelp /> */}
</Router>
</Provider>
<NavItem itemId={0}>
<NavLink to="/test">Tests</NavLink>
</NavItem>
<NavItem itemId={1}>
<NavLink to="/schema">Schema</NavLink>
</NavItem>
<NavItem itemId={2}>
<NavLink to="/changes">Changes</NavLink>
</NavItem>
<NavItem itemId={3}>
<NavLink to="/reports">Reports</NavLink>
</NavItem>
{isAdmin && (
<NavItem itemId={4}>
<NavLink to="/admin">Administration</NavLink>
</NavItem>
)}
</NavList>
</Nav>
}
headerTools={
<PageHeaderTools>
<UserProfileLink />
<LoginLogout />
<About />
</PageHeaderTools>
}
/>
}
>
<Alerts />
<Switch>
<Route exact path="/" component={AllTests} />
<Route exact path="/test" component={AllTests} />
<Route exact path="/test/:testId" component={Test} />

<Route exact path="/run/list/:testId" component={TestRuns} />
<Route exact path="/run/dataset/list/:testId" component={TestDatasets} />
<Route exact path="/run/:id" component={Run} />
<Route exact path="/dataset/comparison" component={DatasetComparison} />

<Route exact path="/schema" component={AllSchema} />
<Route path="/schema/:schemaId" component={Schema} />

<Route exact path="/changes" component={Changes} />

<Route exact path="/reports" component={Reports} />
<Route exact path="/reports/table/config/:configId" component={TableReportConfigPage} />
<Route exact path="/reports/table/:id" component={TableReportPage} />

<Route exact path="/admin" component={Admin} />
<Route exact path="/usersettings" component={UserSettings} />
<Route component={NotFound} />
</Switch>
</Page>
{/* <ContextHelp /> */}
</Router>
</Provider>
)
}

Expand Down

0 comments on commit 54347ea

Please sign in to comment.