Neshweb-Sites/main-site
Neshweb-Sites/main-site
1
0
Fork 0
Code Issues2 Pull requests Releases11 Packages1 Activity Actions

Moved ThemeSelector to NavBar

Browse source 
Added NavWrap so the ThemeSelector can be placed in a corner
This commit is contained in:
Neshura 2022-12-15 21:36:15 +01:00
parent 8ecf388122
commit e15a0c16b8
No known key found for this signature in database
GPG key ID: ACDF5B6EBECF6B0A
4 changed files with 25 additions and 15 deletions

9
components/styles/navbar.tsx
View file

@ -5,11 +5,18 @@ interface ActivePropType {
active?: false | true;
}
export const NavWrap = styled.div`
display: flex;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
border-bottom: 1px solid ${({ theme }) => theme.colors.primary};
`
export const NavBar = styled.nav`
display: flex;
flex: 1;
padding: 2rem 0;
border-bottom: 1px solid ${({ theme }) => theme.colors.primary};
flex-wrap: nowrap;
justify-content: center;
align-items: center;

5
components/styles/themedropdown.tsx
View file

@ -9,6 +9,7 @@ interface ActivePropType {
}
export const ThemeDropDown = styled.div`
margin-left: 1%;
min-width: 180px;
color: ${({ theme }) => theme.colors.primary}
display: flex;
@ -16,7 +17,7 @@ export const ThemeDropDown = styled.div`
`
export const ThemeDropDownButton = styled.button`
width: 100%;
width: 90%;
border: 1px solid;
background-color: ${({ theme }) => theme.colors.background};
padding: 0.2rem 0.5rem;
@ -32,7 +33,7 @@ export const ThemeDropDownButton = styled.button`
`
export const ThemeDropDownOptions = styled.div<DisplayPropType>`
position: absolute;
color: ${({ theme }) => theme.colors.primary};
background-color: ${({ theme }) => theme.colors.background};
display: ${ props => props.show ? "flex" : "none" };