diff --git a/frontend/src/component/InputTime.js b/frontend/src/component/InputTime.js index 03b58b0..314deae 100644 --- a/frontend/src/component/InputTime.js +++ b/frontend/src/component/InputTime.js @@ -49,6 +49,7 @@ const Overlay = styled.div` top: 100%; left: 0; right: 0; + z-index: 2; ${props => (props.hide ? `display: none;` : null)}; `; diff --git a/frontend/src/component/TimeEntryForm.js b/frontend/src/component/TimeEntryForm.js index fde7f9e..f02134b 100644 --- a/frontend/src/component/TimeEntryForm.js +++ b/frontend/src/component/TimeEntryForm.js @@ -4,11 +4,20 @@ import styled from 'styled-components'; export const TimeEntryForm = styled(Form)` display: flex; - margin-bottom: 40px; + margin-bottom: 32px; align-items: flex-end; + + @media (max-width: 400px) { + flex-direction: column; + align-items: stretch; + } `; export const TimeEntryFormField = styled(FormField)` flex: ${props => props.size || 0}; - margin: 0 8px; + margin: 0 8px 8px 8px; + + @media (max-width: 400px) { + ${props => props.center && `align-self: center`} + } `; diff --git a/frontend/src/container/TimeEntry.js b/frontend/src/container/TimeEntry.js index f2c9cef..1ab2e55 100644 --- a/frontend/src/container/TimeEntry.js +++ b/frontend/src/container/TimeEntry.js @@ -2,7 +2,7 @@ import PropTypes from 'prop-types'; import React, { Component } from 'react'; import { observer } from 'mobx-react'; import { action } from 'mobx'; -import { orderBy, sortBy } from 'lodash'; +import { sortBy } from 'lodash'; import moment from 'moment'; import InputText from '../component/InputText'; import InputTime, { InputTimeButton } from '../component/InputTime'; @@ -111,7 +111,7 @@ export default class TimeEntry extends Component { } return ( - + );