Fix shifted label; Removed unused stuff

Author: Minnowo

ui/src/common/DateTimeSelector.tsx

@@ -9,11 +9,10 @@ interface DateTimeSelectorProps {
     showDate: boolean;
     label: string;
     popoverOpen?: (open: boolean) => void;
-    style?: object;
 }
 
 export const DateTimeSelector: React.FC<DateTimeSelectorProps> = React.memo(
-    ({selectedDate, onSelectDate, showDate, label, popoverOpen = () => {}, style = null}) => {
+    ({selectedDate, onSelectDate, showDate, label, popoverOpen = () => {}}) => {
         const [open, setOpen] = React.useState(false);
         const localeData = moment.localeData();
         const time = localeData.longDateFormat('LT').replace('A', 'a');
@@ -23,10 +22,11 @@ export const DateTimeSelector: React.FC<DateTimeSelectorProps> = React.memo(
 
         return (
             <KeyboardDateTimePicker
+                className="time-picker"
                 variant="dialog"
                 InputProps={{disableUnderline: true}}
                 title={selectedDate.format()}
-                style={{minWidth: width, maxWidth: width, ...style}}
+                style={{width: width}}
                 PopoverProps={{
                     onEntered: () => {
                         popoverOpen(true);

ui/src/common/TagChip.tsx

@@ -15,7 +15,6 @@ export const TagChip = ({color, label}: {label: string; color: string}) => {
                 color: textColor,
                 cursor: 'text',
                 minHeight: '32px',
-                height: 'auto',
                 whiteSpace: 'normal',
                 wordBreak: 'break-word',
             }}

ui/src/global.css

@@ -10,25 +10,26 @@ html {
 }
 
 /* The wrapping box around the input and icon for the datetime picker */
-.MuiInputBase-root.MuiInput-root.MuiInputBase-formControl.MuiInput-formControl.MuiInputBase-adornedEnd {
+.time-picker .MuiInputBase-root.MuiInput-root.MuiInputBase-formControl.MuiInput-formControl.MuiInputBase-adornedEnd {
     margin-top: 0;
 }
 
 /* The calendar icon for the datetime picker */
-.MuiInputBase-root.MuiInputBase-formControl.MuiInputBase-adornedEnd
+.time-picker
+    .MuiInputBase-root.MuiInputBase-formControl.MuiInputBase-adornedEnd
     .MuiInputAdornment-root.MuiInputAdornment-positionEnd
     .MuiButtonBase-root.MuiIconButton-root {
     position: absolute;
     left: 0;
 }
 
 /* The label for the datetime picker */
-.MuiFormControl-root.MuiTextField-root .MuiFormLabel-root.MuiInputLabel-root.MuiInputLabel-formControl {
+.time-picker.MuiFormControl-root.MuiTextField-root .MuiFormLabel-root.MuiInputLabel-root.MuiInputLabel-formControl {
     margin-left: 48px;
 }
 
 /* The input box for the datetime picker */
-.MuiFormControl-root.MuiTextField-root .MuiInputBase-input.MuiInput-input.MuiInputBase-inputAdornedEnd {
+.time-picker.MuiFormControl-root.MuiTextField-root .MuiInputBase-input.MuiInput-input.MuiInputBase-inputAdornedEnd {
     margin-left: 48px;
     /* margin-top: 8px; */
     margin-top: 12px;