pomp/pompy.dev
1
0
Fork 0
Code Issues 8 Pull requests Activity Actions

added read progress background

Browse source
This commit is contained in:
Kim, Jimin 2022-01-22 10:42:23 +09:00
parent 767f031751
commit 3bb45c3b10
1 changed files with 10 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

12
source/src/components/Navbar.tsx
View file

@ -66,9 +66,13 @@ const StyledLink = styled(Link)`
margin: 0 0.2rem 0 0.2rem;
`
const StyledReadProgress = styled.div`
const StyledReadProgressBackground = styled.div`
height: 2px;
background-color: darkslategray;
`
const StyledReadProgress = styled.div`
height: 100%;
background-color: ${(props) =>
theming.theme(props.theme.currentTheme, {
light: theming.light.color1,
@ -111,7 +115,11 @@ const ReadProgress = () => {
}, 100)
}, [location])
return <StyledReadProgress style={{ width: `${scroll}%` }} />
return (
<StyledReadProgressBackground>
<StyledReadProgress style={{ width: `${scroll}%` }} />
</StyledReadProgressBackground>
)
}
const Navbar = () => {