task, task-deadline-form: Readjust stylings for btn and label

worknenjoy · Jan 9, 2025 · a9b914f · a9b914f
1 parent 1c26c85
commit a9b914f
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 8 deletions.
diff --git a/frontend/src/components/task/task-deadline-form.js b/frontend/src/components/task/task-deadline-form.js
@@ -2,6 +2,7 @@ import React, { Component } from 'react'
 import PropTypes from 'prop-types'
 import { injectIntl, defineMessages, FormattedMessage } from 'react-intl'
 import MomentComponent from 'moment'
+import { withStyles } from '@material-ui/core/styles'
 
 import {
   CardMedia,
@@ -37,6 +38,19 @@ const messages = defineMessages({
   },
 })
 
+const styles = theme => ({
+  btnClearDeadline: {
+    float: 'left',
+    marginTop: 10,
+    color: theme.palette.error.main,
+    borderColor: theme.palette.error.main
+  },
+  dayLabel: {
+    marginTop: 0,
+    marginLeft: '2em'
+  }
+})
+
 class TaskDeadlineForm extends Component {
   constructor(props) {
     super(props)
@@ -142,7 +156,7 @@ class TaskDeadlineForm extends Component {
               <FormControl fullWidth>
                 <FormattedMessage id='task.status.deadline.day.label' defaultMessage='Day'>
                   {(msg) => (
-                    <InputLabel htmlFor='adornment-date'>{msg}</InputLabel>
+                    <InputLabel htmlFor='adornment-date' className={classes.dayLabel}>{msg}</InputLabel>
                   )}
                 </FormattedMessage>
                 <FormattedMessage id='task.status.deadline.day.insert.label' defaultMessage='Choose a date'>
@@ -193,4 +207,4 @@ TaskDeadlineForm.propTypes = {
   task: PropTypes.object
 }
 
-export default injectIntl(TaskDeadlineForm)
+export default injectIntl(withStyles(styles)(TaskDeadlineForm))
diff --git a/frontend/src/components/task/task.js b/frontend/src/components/task/task.js
@@ -133,12 +133,6 @@ const styles = theme => ({
     marginTop: 10,
     color: 'white'
   },
-  btnClearDeadline: {
-    float: 'left',
-    marginTop: 10,
-    color: theme.palette.error.main,
-    borderColor: theme.palette.error.main
-  },
   avatar: {
     width: 40,
     height: 40,