kevin/portfolio
1
0
Fork 0
Code

Fix horizontal scrollbar by using proper container and fix footer.

Browse Source
This commit is contained in:
PA4KEV 2024-02-12 22:38:08 +01:00
parent 1e98be02d6
commit d2298b6333
2 changed files with 8 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/App.js
View File

@ -136,7 +136,7 @@ function App() {
return ( return (
<Router> <Router>
<div className='row'> <div className='container'>
<Navigation language={language} /> <Navigation language={language} />
<Routes> <Routes>
<Route exact path='/' element={<Home language={"en"} />}></Route> <Route exact path='/' element={<Home language={"en"} />}></Route>
@ -170,9 +170,8 @@ function App() {
<Route exact path='/japanMap' element={<Japan />}></Route> <Route exact path='/japanMap' element={<Japan />}></Route>
</Routes> </Routes>
<Footer />
</div> </div>
<Footer />
</Router> </Router>
); );
} }

8
src/UI/Footer.js
View File

@ -10,8 +10,12 @@ const Footer = () => {
return ( return (
<footer className={`bg-${theme} text-center text-lg-start text-${theme}`}> <footer className={`bg-${theme} text-center text-lg-start text-${theme}`}>
<p className="small">{getString(language, 'footer_madewith')}: <a className={`link-${theme}`} href="https://reactjs.org/" target="_blank" rel="noopener noreferrer">React</a>, <a className={`link-${theme}`} href="https://fsharp.org/" target="_blank" rel="noopener noreferrer">F#</a>, <a className={`link-${theme}`} href="https://github.com/giraffe-fsharp/Giraffe" target="_blank" rel="noopener noreferrer">Giraffe</a>, <a className={`link-${theme}`} href="https://getbootstrap.com/" target="_blank" rel="noopener noreferrer">Bootstrap</a>, <a className={`link-${theme}`} href="https://www.nginx.com/" target="_blank" rel="noopener noreferrer">Nginx</a> {getString(language, 'and')} <a className={`link-${theme}`} href="https://www.docker.com/" target="_blank" rel="noopener noreferrer">Docker</a> {getString(language, 'on')} <a className={`link-${theme}`} href="https://www.digitalocean.com/" target="_blank" rel="noopener noreferrer">DigitalOcean</a> cloud droplets.</p> <div className="container-fluid">
<p className="small">{getString(language, 'footer_contentparsed')}: <a className={`link-${theme}`} href="https://github.com/quantizor/markdown-to-jsx" target="_blank" rel="noopener noreferrer">markdown-to-jsx</a></p> <span className="small">{getString(language, 'footer_madewith')}: <a className={`link-${theme}`} href="https://reactjs.org/" target="_blank" rel="noopener noreferrer">React</a>, <a className={`link-${theme}`} href="https://fsharp.org/" target="_blank" rel="noopener noreferrer">F#</a>, <a className={`link-${theme}`} href="https://github.com/giraffe-fsharp/Giraffe" target="_blank" rel="noopener noreferrer">Giraffe</a>, <a className={`link-${theme}`} href="https://getbootstrap.com/" target="_blank" rel="noopener noreferrer">Bootstrap</a>, <a className={`link-${theme}`} href="https://www.nginx.com/" target="_blank" rel="noopener noreferrer">Nginx</a> {getString(language, 'and')} <a className={`link-${theme}`} href="https://www.docker.com/" target="_blank" rel="noopener noreferrer">Docker</a> {getString(language, 'on')} <a className={`link-${theme}`} href="https://www.digitalocean.com/" target="_blank" rel="noopener noreferrer">DigitalOcean</a> cloud droplets.</span>
<br />
<span className="small">{getString(language, 'footer_contentparsed')}: <a className={`link-${theme}`} href="https://github.com/quantizor/markdown-to-jsx" target="_blank" rel="noopener noreferrer">markdown-to-jsx</a></span>
<br /><br />
</div>
</footer> </footer>
) )
} }