[#452] UI/update event extend mode (#454)

* Update event modal extend mode UI consistency

- Fix label font-size and fontWeight in extended mode to match normal mode
- Replace Lock icon with LockOutline icon for visibility toggle buttons
- Add displayEmpty prop to notification select to show default value

* Replace video icon with outlined variant for consistency

- Update VideocamIcon to VideocamOutlinedIcon in event form fields
- Update VideocamIcon to VideocamOutlinedIcon in event preview modal

src/components/Event/EventFormFields.tsx

@@ -17,12 +17,12 @@ import {
 import {
   Description as DescriptionIcon,
   Public as PublicIcon,
-  Lock as LockIcon,
-  CameraAlt as VideocamIcon,
+  VideocamOutlined as VideocamOutlinedIcon,
   ContentCopy as CopyIcon,
   Close as DeleteIcon,
 } from "@mui/icons-material";
 import iconCamera from "../../static/images/icon-camera.svg";
+import LockOutlineIcon from "@mui/icons-material/LockOutline";
 import AttendeeSelector from "../Attendees/AttendeeSearch";
 import RepeatEvent from "./EventRepeat";
 import { RepetitionObject } from "../../features/Events/EventsTypes";
@@ -652,6 +652,7 @@ export default function EventFormFields({
               <Select
                 labelId="notification"
                 value={alarm}
+                displayEmpty
                 onChange={(e: SelectChangeEvent) => setAlarm(e.target.value)}
               >
                 <MenuItem value="">{t("event.form.notifications.")}</MenuItem>
@@ -732,7 +733,7 @@ export default function EventFormFields({
                 {t("event.form.visibleAll")}
               </ToggleButton>
               <ToggleButton value="PRIVATE" sx={{ minWidth: "160px" }}>
-                <LockIcon sx={{ mr: 1 }} />
+                <LockOutlineIcon sx={{ mr: 1 }} />
                 {t("event.form.visibleParticipants")}
               </ToggleButton>
             </ToggleButtonGroup>

src/components/Event/components/FieldWithLabel.tsx

@@ -46,6 +46,8 @@ export const FieldWithLabel = React.memo(
             minWidth: "115px",
             marginRight: "12px",
             flexShrink: 0,
+            fontSize: "0.875rem",
+            fontWeight: 500,
           }}
         >
           {label}