removed social links from navbar to footer, cleaned up navbar on mobile
This commit is contained in:
@@ -33,7 +33,6 @@ export const renderNavigationItems = (mobile = false): JSX.Element => (
|
||||
<NavbarDropdownLink to="/in_english" text="In English" exploded={mobile} />
|
||||
</>
|
||||
);
|
||||
|
||||
const Nav = styled.div`
|
||||
flex: 1 0 auto;
|
||||
display: flex;
|
||||
@@ -57,6 +56,11 @@ const Nav = styled.div`
|
||||
@media screen and (max-width: ${breakpoints.mobile}) {
|
||||
justify-content: center;
|
||||
margin-left: 0;
|
||||
/* line 59 */
|
||||
border-top: 2px solid ${colors.lightBlue}; /* Add line above */
|
||||
padding-top: 0.5rem; /* Add some spacing */
|
||||
padding-bottom: 0.5rem; /* Add some spacing */
|
||||
cursor: pointer; /* Make entire nav clickable */
|
||||
}
|
||||
|
||||
svg {
|
||||
@@ -78,22 +82,12 @@ const DesktopContainer = styled.div`
|
||||
}
|
||||
`;
|
||||
|
||||
const SomeContainer = styled.div`
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
|
||||
a {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: center;
|
||||
margin: 1rem;
|
||||
}
|
||||
`;
|
||||
|
||||
const MobileMenu = styled.div`
|
||||
display: flex;
|
||||
margin: 0 1rem;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
padding: 0 50%; /* Large clickable area horizontally cheeze */
|
||||
|
||||
span {
|
||||
display: flex;
|
||||
@@ -103,9 +97,6 @@ const MobileMenu = styled.div`
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media screen and (max-width: ${breakpoints.mobile}) {
|
||||
margin-left: 3rem;
|
||||
}
|
||||
`;
|
||||
|
||||
interface NavigationProps {
|
||||
@@ -119,13 +110,8 @@ const Navigation: React.FC<NavigationProps> = ({ onMobileMenuOpen }) => {
|
||||
<DesktopContainer>
|
||||
{desktopItems}
|
||||
</DesktopContainer>
|
||||
<SomeContainer>
|
||||
<Icon name={IconType.Facebook} link="https://www.facebook.com/AaltoYliopistonSIK/" />
|
||||
<Icon name={IconType.Instagram} link="https://www.instagram.com/sahkoinsinoorikilta/" />
|
||||
<Icon name={IconType.LinkedIn} link="https://www.linkedin.com/groups/8103057/" />
|
||||
</SomeContainer>
|
||||
<MobileMenu>
|
||||
<Icon name={IconType.HamburgerMenu} onClick={onMobileMenuOpen} />
|
||||
<MobileMenu onClick={onMobileMenuOpen}>
|
||||
<Icon name={IconType.HamburgerMenu} />
|
||||
</MobileMenu>
|
||||
</Nav>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user