Add Balcony Radio page

src/App.js

@@ -15,6 +15,7 @@ import WifiPrototype from './Pages/Software/Projects/WifiPrototype';
 
 import Radio from './Pages/Radio/Radio';
 import Components from './Pages/Radio/Components';
+import Balkon from './Pages/Radio/Balkon';
 
 import Linux from './Pages/Linux/Linux';
 import Footer from './UI/Footer';
@@ -34,6 +35,7 @@ function App() {
             <Route exact path='/pages/software/wifi-prototype' element={<WifiPrototype />}></Route>
             <Route exact path='/pages/radio' element={<Radio />}></Route>
             <Route exact path='/pages/radio/components' element={<Components />}></Route>
+            <Route exact path='/pages/radio/balcony' element={<Balkon />}></Route>
             <Route exact path='/pages/linux' element={<Linux />}></Route>
         </Routes>
 

src/Pages/Radio/Balkon.js

@@ -0,0 +1,33 @@
+import React from 'react';
+
+const Balkon = () => {
+    return (        
+        <div className='row'>
+            <div className="sidebar col-3 position-fixed">
+                <div id="list-example" className="list-group">
+                    <a className="list-group-item list-group-item-action list-group-item-primary" href="#list-intro">intro</a>
+                    <a className="list-group-item list-group-item-action list-group-item-primary" href="#list-dipole">dipole</a>
+                </div>
+            </div>
+
+            <div className="scrollspy-example col-6 offset-3" data-bs-spy="scroll" data-bs-target="#list-example" data-bs-smooth-scroll="true" tabIndex="0">
+                <section className="content-section">
+                    <div id="list-intro" className='content-item'>
+                        <h1 className="text-primary">Balcony antenna</h1>
+                        <p>Living in an appartment brings great challenges for a radio amateur home setup.</p>
+                        <p>This page describes my findings and improvements that I made to create a working balcony setup.</p>                                                
+                    </div>
+                </section>
+
+                <section className="content-section">
+                    <div id="list-dipole" className='content-item'>
+                        <h3 className="text-primary">Dipole</h3>
+                        <p>A dipole with a 1:1 Balun was the first HF antenna I attempted to try out.</p>                                              
+                    </div>
+                </section>
+            </div>
+        </div>
+    )
+}
+
+export default Balkon;

src/UI/Navigation.js

@@ -34,6 +34,11 @@ const Navigation = (props) => {
                         <Link reloadDocument to="/pages/radio/components" className={`nav-link ${chapter === "components" ? "active" : ""}`}>Components</Link>
                     </li>
                     }
+                    {section === 'radio' &&
+                    <li className="nav-item">
+                        <Link reloadDocument to="/pages/radio/balcony" className={`nav-link ${chapter === "balcony" ? "active" : ""}`}>Balcony</Link>
+                    </li>
+                    }
                 </ul>
                 {/* <form className="d-flex" role="search">
                     <input className="form-control me-2" type="search" placeholder="Search" aria-label="Search"/>