fix(modal and dialogues): fixes as per specifications (#3438)

Co-authored-by: Alireza <ar.sedghi@gmail.com>

extensions/measurement-tracking/src/_shared/createReportDialogPrompt.tsx

@@ -38,7 +38,7 @@ export default function createReportDialogPrompt(uiDialogService) {
       useLastPosition: false,
       showOverlay: true,
       contentProps: {
-        title: 'Provide a name for your report',
+        title: 'Create Report',
         value: { label: '' },
         noCloseButton: true,
         onClose: _handleClose,
@@ -60,12 +60,13 @@ export default function createReportDialogPrompt(uiDialogService) {
             }
           };
           return (
-            <div className="p-4 bg-primary-dark">
+            <div className="">
               <Input
+                label="Enter the report name"
+                labelClassName="text-white grow leading-[1.2] text-[14px]"
                 autoFocus
-                className="mt-2 bg-black border-primary-main"
+                className="bg-black border-primary-main grow"
                 type="text"
-                containerClassName="mr-2"
                 value={value.label}
                 onChange={onChangeHandler}
                 onKeyPress={onKeyPressHandler}

extensions/measurement-tracking/src/panels/PanelMeasurementTableTracking/index.tsx

@@ -188,7 +188,7 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
       showOverlay: true,
       content: Dialog,
       contentProps: {
-        title: 'Enter your annotation',
+        title: 'Annotation',
         noCloseButton: true,
         value: { label: measurement.label || '' },
         body: ({ value, setValue }) => {
@@ -203,18 +203,17 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
             }
           };
           return (
-            <div className="p-4 bg-primary-dark">
-              <Input
-                autoFocus
-                id="annotation"
-                className="mt-2 bg-black border-primary-main"
-                type="text"
-                containerClassName="mr-2"
-                value={value.label}
-                onChange={onChangeHandler}
-                onKeyPress={onKeyPressHandler}
-              />
-            </div>
+            <Input
+              label="Enter your annotation"
+              labelClassName="text-white grow text-[14px] leading-[1.2]"
+              autoFocus
+              id="annotation"
+              className="bg-black border-primary-main"
+              type="text"
+              value={value.label}
+              onChange={onChangeHandler}
+              onKeyPress={onKeyPressHandler}
+            />
           );
         },
         actions: [