Leahnaya/sendou.ink
1
0
Fork 0
mirror of https://github.com/Sendouc/sendou.ink.git synced 2026-07-17 01:05:21 -05:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

titles for icons

Browse Source
This commit is contained in:
Kalle (Sendou) 2020-09-28 01:35:48 +03:00
parent 3bf4bd1cb8
commit bc669164db
1 changed files with 15 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
frontend-react/src/components/root/IconNavBar.tsx
View File

@ -92,13 +92,16 @@ export const navIcons: {
const IconNavBar = () => {
const { t } = useTranslation()
const { darkerBgColor, textColor, themeColorWithShade } = useContext(
MyThemeContext
)
const {
darkerBgColor,
textColor,
themeColorWithShade,
grayWithShade,
} = useContext(MyThemeContext)
const location = useLocation()
return (
<Flex bg={darkerBgColor} justifyContent="center" py={2} flexWrap="wrap">
<Flex bg={darkerBgColor} py={2} justifyContent="center" flexWrap="wrap">
<Suspense fallback={null}>
{navIcons.map(({ displayName, code, menuItems }) => {
const codesTogether =
@ -109,28 +112,19 @@ const IconNavBar = () => {
<Flex
flexDirection="column"
alignItems="center"
mx={2}
justifyContent="center"
m="5px 15px"
color={textColor}
>
{location.pathname !== "/" &&
codesTogether.includes(location.pathname) ? (
<Box
h="5px"
w="5px"
mb={1}
bgColor={themeColorWithShade}
borderRadius="50%"
lineHeight="0.5rem"
/>
<Box color={themeColorWithShade} fontSize="0.75em">
{displayName}
</Box>
) : (
<Box
h="5px"
w="5px"
mb={1}
bgColor={darkerBgColor}
borderRadius="50%"
lineHeight="0.5rem"
/>
<Box color={grayWithShade} fontSize="0.75em">
{displayName}
</Box>
)}
<Image
src={`${process.env.PUBLIC_URL}/navIcons/${code}.png`}