fix(dropdown): Fix dropdown styles

pull/16890/head
Stuart Taylor 2018-03-13 21:03:47 +00:00
parent 86b19031e9
commit d67d02a344
3 changed files with 36 additions and 19 deletions

View File

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import Media from 'react-media'; import Media from 'react-media';
import { Col, Navbar, Row } from 'react-bootstrap'; import { Navbar, Row } from 'react-bootstrap';
import FCCSearchBar from 'react-freecodecamp-search'; import FCCSearchBar from 'react-freecodecamp-search';
import { NavLogo, BinButtons, NavLinks } from './components'; import { NavLogo, BinButtons, NavLinks } from './components';
@ -30,15 +30,13 @@ function MediumNav({ clickOnLogo, clickOnMap, shouldShowMapButton, panes }) {
</div> </div>
</Navbar.Header> </Navbar.Header>
</Row> </Row>
<Row> <Row className='collapse-row'>
<Col xs={ 12 }>
<Navbar.Collapse> <Navbar.Collapse>
<NavLinks <NavLinks
clickOnMap={ clickOnMap } clickOnMap={ clickOnMap }
shouldShowMapButton={ shouldShowMapButton } shouldShowMapButton={ shouldShowMapButton }
/> />
</Navbar.Collapse> </Navbar.Collapse>
</Col>
</Row> </Row>
</div> </div>
) )

View File

@ -1,6 +1,6 @@
import React from 'react'; import React from 'react';
import Media from 'react-media'; import Media from 'react-media';
import { Col, Navbar, Row } from 'react-bootstrap'; import { Navbar, Row } from 'react-bootstrap';
import FCCSearchBar from 'react-freecodecamp-search'; import FCCSearchBar from 'react-freecodecamp-search';
import { NavLogo, BinButtons, NavLinks } from './components'; import { NavLogo, BinButtons, NavLinks } from './components';
@ -25,8 +25,7 @@ function SmallNav({ clickOnLogo, clickOnMap, shouldShowMapButton, panes }) {
</div> </div>
</Navbar.Header> </Navbar.Header>
</Row> </Row>
<Row> <Row className='collapse-row'>
<Col xs={ 12 }>
<Navbar.Collapse> <Navbar.Collapse>
<NavLinks <NavLinks
clickOnMap={ clickOnMap } clickOnMap={ clickOnMap }
@ -39,7 +38,6 @@ function SmallNav({ clickOnLogo, clickOnMap, shouldShowMapButton, panes }) {
/> />
</NavLinks> </NavLinks>
</Navbar.Collapse> </Navbar.Collapse>
</Col>
</Row> </Row>
</div> </div>
) )

View File

@ -310,3 +310,24 @@ li.nav-avatar {
} }
} }
.collapse-row {
background-color: @brand-primary;
.dropdown-menu {
li a {
display: flex;
justify-content: center;
background-color: #eeeeee;
color: @brand-primary !important;
&:hover {
background-color: @brand-primary !important;
color: #eeeeee !important;
}
}
}
}