Commit 73011f63 authored by Aron Fiechter's avatar Aron Fiechter
Browse files

Fix height on mobile

No scrolling should happen.
parent fdf3061a
......@@ -22,7 +22,7 @@ const App = () => {
if (isMobile) {
return (
<div className="App vh-100 min-vh-100">
<div className="App">
<Mobile />
</div>
);
......
......@@ -3,7 +3,9 @@ import logo from '../../logo.svg';
import Card from 'react-bootstrap/Card';
export default function About(props) {
const { message } = props;
const { message, isMobile } = props;
const footerStyle = isMobile ? { position: 'fixed', bottom: 0, width: '100%' } : {};
return (
<>
<Card.Img variant="top" src={logo} style={{ padding: '50px 70px' }} />
......@@ -11,8 +13,12 @@ export default function About(props) {
<Card.Title>Mímir // A Visual Browser for the Federal Archives</Card.Title>
<Card.Text>{message}</Card.Text>
</Card.Body>
<Card.Footer>
Developed with ❤️ at the{' '}
<Card.Footer style={footerStyle}>
Developed with{' '}
<span role="img" aria-label="heart">
❤️
</span>{' '}
at the{' '}
<a href="https://si.usi.ch/" target="_blank" rel="noopener noreferrer">
Software Institute
</a>
......
......@@ -18,7 +18,7 @@ export default function AboutModal(props) {
<Modal.Title>About Mímir</Modal.Title>
</Modal.Header>
<Modal.Body className="p-sm-0">
<About />
<About isMobile={false} />
</Modal.Body>
<Modal.Footer>
<Button variant="secondary" onClick={handleClose}>
......
......@@ -4,8 +4,13 @@ import About from '../about/About';
export default function Mobile() {
return (
<Card className="vh-100 min-vh-100 border-0">
<About message={'Mímir is not yet optimized for mobile devices. Please come back using your desktop computer.'} />
<Card className="border-bottom-0">
<About
isMobile={true}
message={
'Mímir is not yet optimized for mobile devices. Please come back using your desktop computer.'
}
/>
</Card>
);
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment