From 1810d810d85204d916565776f065a5d9a82cbbbb Mon Sep 17 00:00:00 2001
From: Aditya Toshniwal <aditya.toshniwal14@gmail.com>
Date: Thu, 29 Jul 2021 18:30:20 +0530
Subject: [PATCH] Few more UI changes for Note.

---
 web/pgadmin/static/js/SchemaView/MappedControl.jsx  |  2 +-
 web/pgadmin/static/js/components/FormComponents.jsx | 12 +++++++-----
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/web/pgadmin/static/js/SchemaView/MappedControl.jsx b/web/pgadmin/static/js/SchemaView/MappedControl.jsx
index 269e65161..021535d0f 100644
--- a/web/pgadmin/static/js/SchemaView/MappedControl.jsx
+++ b/web/pgadmin/static/js/SchemaView/MappedControl.jsx
@@ -92,7 +92,7 @@ function MappedFormControlBase({type, value, id, onChange, className, visible, i
   case 'sql':
     return <FormInputSQL name={name} value={value} onChange={onSqlChange} className={className} noLabel={noLabel} {...props} />;
   case 'note':
-    return <FormNote {...props}/>;
+    return <FormNote className={className} {...props}/>;
   default:
     return <span>{value}</span>;
   }
diff --git a/web/pgadmin/static/js/components/FormComponents.jsx b/web/pgadmin/static/js/components/FormComponents.jsx
index 2646add45..e0a9be7c5 100644
--- a/web/pgadmin/static/js/components/FormComponents.jsx
+++ b/web/pgadmin/static/js/components/FormComponents.jsx
@@ -823,13 +823,15 @@ FormInputColor.propTypes = {
   testcid: PropTypes.string,
 };
 
-export function FormNote({text}) {
+export function FormNote({text, className}) {
   const classes = useStyles();
   return (
-    <Paper elevation={0} className={classes.noteRoot}>
-      <Box paddingRight="0.25rem"><DescriptionIcon fontSize="small" /></Box>
-      <Box>{HTMLReactParse(text)}</Box>
-    </Paper>
+    <Box className={className}>
+      <Paper elevation={0} className={classes.noteRoot}>
+        <Box paddingRight="0.25rem"><DescriptionIcon fontSize="small" /></Box>
+        <Box>{HTMLReactParse(text)}</Box>
+      </Paper>
+    </Box>
   );
 }
 FormNote.propTypes = {