Ensure components are full width

cybernetisk · Oct 28, 2024 · 88ea9dd · 88ea9dd
1 parent af18eb2
commit 88ea9dd
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 1 deletion.
diff --git a/app/components/input/CustomNumberInput.js b/app/components/input/CustomNumberInput.js
@@ -15,6 +15,7 @@ export default class CustomNumberInput extends Component {
         value={value}
         error={error}
         onFocus={(e) => e.target.select()}
+        fullWidth
         onBlur={(e) => {
           let value = check(e.target.value) ? 0 : e.target.value;
           if (value === "") value = 0;

diff --git a/app/pages/main/volunteering/logs/workLogInput.js b/app/pages/main/volunteering/logs/workLogInput.js
@@ -145,6 +145,7 @@ export default function workLogInput(
             <DateTimePicker
               className="endDateTime"
               sx={{ display: "none" }}
+              slotProps={{ textField: { fullWidth: true } }}
               label="End of work"
               value={endDateTime} // Replacing defaultValue to make it synced with the actual value
               ampm={false}
@@ -172,7 +173,10 @@ export default function workLogInput(
               className="endInputMethodChangeButton"
               size="small"
               color="primary"
-              style={{ marginLeft: "10px" }}
+              style={{
+                marginLeft: "10px",
+                padding: "10px",
+               }}
               onClick={() => {switchEndInputMethod();}}
             >
               { shouldInputHours ? <PunchClock /> : <CalendarToday /> }