Preseving contrast with light menu instead of always-inverted menu.

This commit is contained in:
Roland 2023-04-06 11:16:45 -06:00
parent d00c722a75
commit 6057d83eae
No known key found for this signature in database
GPG key ID: 9D6DBD3ACF11AB93
2 changed files with 6 additions and 6 deletions

View file

@ -1,5 +1,5 @@
import React, {useContext, useEffect, useState} from "react";
import {Card, Container, IconGroup, Input, Modal, Pagination, Icon as SIcon} from 'semantic-ui-react';
import {Card, Container, IconGroup, Input, Modal, Pagination} from 'semantic-ui-react';
import {Link, NavLink, useNavigate} from "react-router-dom";
import Message from "semantic-ui-react/dist/commonjs/collections/Message";
import {useDirectories, useDownloads, useHotspot, useSettings, useThrottle} from "../hooks/customHooks";
@ -779,8 +779,7 @@ export function DarkModeToggle() {
iconName = 'sun';
}
return <SIcon
inverted
return <Icon
name={iconName}
onClick={cycleSavedTheme}
style={{cursor: 'pointer'}}

View file

@ -53,11 +53,12 @@ function NavIcon(props) {
}
export function NavBar() {
const {status} = useContext(StatusContext);
const {status} = React.useContext(StatusContext);
const wrol_mode = status ? status['wrol_mode'] : null;
const wrolpiIcon = <img src='/icon.svg' height='32px' width='32px' alt='WROLPi Home Icon'/>;
const name = NAME || wrolpiIcon;
const topNavText = wrol_mode ? <>{name}&nbsp; <Icon name='lock'/></> : name;
const {i} = React.useContext(ThemeContext);
const homeLink = <NavLink className='item' to='/' style={{paddingTop: 0, paddingBottom: 0}}>
{topNavText}
@ -69,7 +70,7 @@ export function NavBar() {
return <>
<Media at='mobile'>
<Menu attached='top' inverted color='violet'>
<Menu {...i} attached='top' color='violet'>
{homeLink}
<Menu.Menu position='right'>
{icons}
@ -82,7 +83,7 @@ export function NavBar() {
</Menu>
</Media>
<Media greaterThanOrEqual='tablet'>
<Menu attached='top' inverted color='violet'>
<Menu {...i} attached='top' color='violet'>
{homeLink}
{links.map(i => <MenuLink link={i} key={i.key}/>)}