diff --git a/client/src/components/App.css b/client/src/components/App.css index 2e0d618..cda2d42 100644 --- a/client/src/components/App.css +++ b/client/src/components/App.css @@ -125,8 +125,45 @@ li button { box-shadow: inset 3px 0 6px -3px rgba(0, 0, 0, 0.3); } -/* make buttons bigger on smartphones */ +/* make it usable on smartphones */ @media only screen and (max-width: 600px) { + #header { + position: fixed; + top: 0; + left: 0; + background-color: white; + z-index: 5; + width: 100%; + } + #inputs { + position: fixed; + top: 8rem; + left: 0; + background-color: white; + z-index: 10; + width: 100%; + height: 65px; + max-height: 65px !important; + } + #container { + margin-top: 12rem; + border-top-left-radius: 0; + border-top-right-radius: 0; + margin-bottom: 3rem; + } + #filters { + position: fixed; + left: 0; + bottom: 0; + width: 100%; + max-height: 3rem !important; + opacity: 1 !important; + background-color: white; + } + #filters button { + height: 3rem !important; + padding: 0 1.5rem !important; + } li button { padding: 0 1.5rem !important; } diff --git a/client/src/components/Container.css b/client/src/components/Container.css index 10c68fe..4fc663a 100644 --- a/client/src/components/Container.css +++ b/client/src/components/Container.css @@ -22,6 +22,9 @@ body { } @media only screen and (max-width: 600px) { + #root { + margin: 0; + } #container { max-width: 100%; } diff --git a/client/src/components/user/EditForm.js b/client/src/components/user/EditForm.js index d1054a1..8da0383 100644 --- a/client/src/components/user/EditForm.js +++ b/client/src/components/user/EditForm.js @@ -31,7 +31,6 @@ function EditForm({ if (!user.user) { history.push('/'); } - console.log(user); if (user.user && user.editSuccess) { reset(); history.push('/'); @@ -41,9 +40,9 @@ function EditForm({