Skip to content

Commit 3b1a8b7

Browse files
bravogeorgebravogeorge
authored
docs: update navbar examples (react-bootstrap#5766)
* update navbar container * Update remaining Navbar examples * update collapsible.js
1 parent 3a62952 commit 3b1a8b7

File tree

6 files changed

+56
-34
lines changed

6 files changed

+56
-34
lines changed

‎www/src/examples/Navbar/Basic.js

Lines changed: 17 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
11
<Navbar bg="light" expand="lg">
2-
<Navbar.Brand href="#home">React-Bootstrap</Navbar.Brand>
3-
<Navbar.Toggle aria-controls="basic-navbar-nav" />
4-
<Navbar.Collapse id="basic-navbar-nav">
5-
<Nav className="me-auto">
6-
<Nav.Link href="#home">Home</Nav.Link>
7-
<Nav.Link href="#link">Link</Nav.Link>
8-
<NavDropdown title="Dropdown" id="basic-nav-dropdown">
9-
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
10-
<NavDropdown.Item href="#action/3.2">Another action</NavDropdown.Item>
11-
<NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
12-
<NavDropdown.Divider />
13-
<NavDropdown.Item href="#action/3.4">Separated link</NavDropdown.Item>
14-
</NavDropdown>
15-
</Nav>
16-
</Navbar.Collapse>
2+
<Container>
3+
<Navbar.Brand href="#home">React-Bootstrap</Navbar.Brand>
4+
<Navbar.Toggle aria-controls="basic-navbar-nav" />
5+
<Navbar.Collapse id="basic-navbar-nav">
6+
<Nav className="me-auto">
7+
<Nav.Link href="#home">Home</Nav.Link>
8+
<Nav.Link href="#link">Link</Nav.Link>
9+
<NavDropdown title="Dropdown" id="basic-nav-dropdown">
10+
<NavDropdown.Item href="#action/3.1">Action</NavDropdown.Item>
11+
<NavDropdown.Item href="#action/3.2">Another action</NavDropdown.Item>
12+
<NavDropdown.Item href="#action/3.3">Something</NavDropdown.Item>
13+
<NavDropdown.Divider />
14+
<NavDropdown.Item href="#action/3.4">Separated link</NavDropdown.Item>
15+
</NavDropdown>
16+
</Nav>
17+
</Navbar.Collapse>
18+
</Container>
1719
</Navbar>;

‎www/src/examples/Navbar/Brand.js

Lines changed: 19 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,18 @@
11
<>
22
<Navbar bg="light">
3-
<Navbar.Brand href="#home">Brand link</Navbar.Brand>
3+
<Container>
4+
<Navbar.Brand href="#home">Brand link</Navbar.Brand>
5+
</Container>
46
</Navbar>
57
<br />
68
<Navbar bg="light">
7-
<Navbar.Brand>Brand text</Navbar.Brand>
9+
<Container>
10+
<Navbar.Brand>Brand text</Navbar.Brand>
11+
</Container>
812
</Navbar>
913
<br />
1014
<Navbar bg="dark">
15+
<Container>
1116
<Navbar.Brand href="#home">
1217
<img
1318
src="/logo.svg"
@@ -17,18 +22,21 @@
1722
alt="React Bootstrap logo"
1823
/>
1924
</Navbar.Brand>
25+
</Container>
2026
</Navbar>
2127
<br />
2228
<Navbar bg="dark" variant="dark">
23-
<Navbar.Brand href="#home">
24-
<img
25-
alt=""
26-
src="/logo.svg"
27-
width="30"
28-
height="30"
29-
className="d-inline-block align-top"
30-
/>{' '}
29+
<Container>
30+
<Navbar.Brand href="#home">
31+
<img
32+
alt=""
33+
src="/logo.svg"
34+
width="30"
35+
height="30"
36+
className="d-inline-block align-top"
37+
/>{' '}
3138
React Bootstrap
32-
</Navbar.Brand>
39+
</Navbar.Brand>
40+
</Container>
3341
</Navbar>
3442
</>;

‎www/src/examples/Navbar/Collapsible.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
<Navbar collapseOnSelect expand="lg" bg="dark" variant="dark">
2+
<Container>
23
<Navbar.Brand href="#home">React-Bootstrap</Navbar.Brand>
34
<Navbar.Toggle aria-controls="responsive-navbar-nav" />
45
<Navbar.Collapse id="responsive-navbar-nav">
@@ -20,4 +21,5 @@
2021
</Nav.Link>
2122
</Nav>
2223
</Navbar.Collapse>
24+
</Container>
2325
</Navbar>;

‎www/src/examples/Navbar/ColorSchemes.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,35 @@
11
<>
22
<Navbar bg="dark" variant="dark">
3+
<Container>
34
<Navbar.Brand href="#home">Navbar</Navbar.Brand>
45
<Nav className="me-auto">
56
<Nav.Link href="#home">Home</Nav.Link>
67
<Nav.Link href="#features">Features</Nav.Link>
78
<Nav.Link href="#pricing">Pricing</Nav.Link>
89
</Nav>
10+
</Container>
911
</Navbar>
1012
<br />
1113
<Navbar bg="primary" variant="dark">
14+
<Container>
1215
<Navbar.Brand href="#home">Navbar</Navbar.Brand>
1316
<Nav className="me-auto">
1417
<Nav.Link href="#home">Home</Nav.Link>
1518
<Nav.Link href="#features">Features</Nav.Link>
1619
<Nav.Link href="#pricing">Pricing</Nav.Link>
1720
</Nav>
21+
</Container>
1822
</Navbar>
1923

2024
<br />
2125
<Navbar bg="light" variant="light">
26+
<Container>
2227
<Navbar.Brand href="#home">Navbar</Navbar.Brand>
2328
<Nav className="me-auto">
2429
<Nav.Link href="#home">Home</Nav.Link>
2530
<Nav.Link href="#features">Features</Nav.Link>
2631
<Nav.Link href="#pricing">Pricing</Nav.Link>
2732
</Nav>
33+
</Container>
2834
</Navbar>
2935
</>;

‎www/src/examples/Navbar/ContainerOutside.js

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
<Container>
22
<Navbar expand="lg" variant="light" bg="light">
3-
<Navbar.Brand href="#">Navbar</Navbar.Brand>
3+
<Container>
4+
<Navbar.Brand href="#">Navbar</Navbar.Brand>
5+
</Container>
46
</Navbar>
57
</Container>;

‎www/src/examples/Navbar/TextLink.js

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,11 @@
11
<Navbar>
2-
<Navbar.Brand href="#home">Navbar with text</Navbar.Brand>
3-
<Navbar.Toggle />
4-
<Navbar.Collapse className="justify-content-end">
5-
<Navbar.Text>
6-
Signed in as: <a href="#login">Mark Otto</a>
7-
</Navbar.Text>
8-
</Navbar.Collapse>
2+
<Container>
3+
<Navbar.Brand href="#home">Navbar with text</Navbar.Brand>
4+
<Navbar.Toggle />
5+
<Navbar.Collapse className="justify-content-end">
6+
<Navbar.Text>
7+
Signed in as: <a href="#login">Mark Otto</a>
8+
</Navbar.Text>
9+
</Navbar.Collapse>
10+
</Container>
911
</Navbar>;

0 commit comments

Comments
 (0)