chroe: add ids for header elements (#1374)

* chroe: add id for header elements

* fix order of id and class
This commit is contained in:
Zeng1998 2023-03-18 20:19:13 +08:00 committed by GitHub
parent 70e32637b0
commit eb835948b7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23

View file

@ -53,6 +53,7 @@ const Header = () => {
<>
<NavLink
to="/"
id="header-home"
className={({ isActive }) =>
`${
isActive && "bg-white dark:bg-zinc-700 shadow"
@ -65,6 +66,7 @@ const Header = () => {
</NavLink>
<NavLink
to="/review"
id="header-review"
className={({ isActive }) =>
`${
isActive && "bg-white dark:bg-zinc-700 shadow"
@ -77,6 +79,7 @@ const Header = () => {
</NavLink>
<NavLink
to="/resources"
id="header-resources"
className={({ isActive }) =>
`${
isActive && "bg-white dark:bg-zinc-700 shadow"
@ -91,6 +94,7 @@ const Header = () => {
)}
<NavLink
to="/explore"
id="header-explore"
className={({ isActive }) =>
`${
isActive && "bg-white dark:bg-zinc-700 shadow"
@ -104,18 +108,21 @@ const Header = () => {
{!isVisitorMode && (
<>
<button
id="header-ask-ai"
className="px-4 pr-5 py-2 rounded-lg flex flex-row items-center text-lg dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
onClick={() => showAskAIDialog()}
>
<Icon.Bot className="mr-4 w-6 h-auto opacity-80" /> Ask AI
</button>
<button
id="header-archived-memo"
className="px-4 pr-5 py-2 rounded-lg flex flex-row items-center text-lg dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
onClick={() => showArchivedMemoDialog()}
>
<Icon.Archive className="mr-4 w-6 h-auto opacity-80" /> {t("common.archived")}
</button>
<button
id="header-settings"
className="px-4 pr-5 py-2 rounded-lg flex flex-row items-center text-lg dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
onClick={() => showSettingDialog()}
>
@ -127,6 +134,7 @@ const Header = () => {
<>
<NavLink
to="/auth"
id="header-auth"
className={({ isActive }) =>
`${
isActive && "bg-white dark:bg-zinc-700 shadow"
@ -138,6 +146,7 @@ const Header = () => {
</>
</NavLink>
<button
id="header-about"
className="px-4 pr-5 py-2 rounded-lg flex flex-row items-center text-lg dark:text-gray-200 hover:bg-white hover:shadow dark:hover:bg-zinc-700"
onClick={() => showAboutSiteDialog()}
>