Short description for settings -> general section

apps/remix-ide/src/app/tabs/locales/en/settings.json

@@ -1,16 +1,18 @@
 {
   "settings.displayName": "Settings",
   "settings.reset": "Reset to Default settings",
-  "settings.general": "General settings",
-  "settings.generateContractMetadataText": "Generate contract metadata. Generate a JSON file in the contract folder. Allows to specify library addresses the contract depends on. If nothing is specified, Remix deploys libraries automatically.",
+  "settings.general": "General",
+  "settings.generateContractMetadataText": "Generate contract metadata",
+  "settings.generateContractMetadataTooltip": "Generate a JSON file in the contract folder. Allows to specify library addresses the contract depends on. If nothing is specified, Remix deploys libraries automatically.",
   "settings.ethereunVMText": "Always use the Remix VM at load",
   "settings.wordWrapText": "Word wrap in editor",
-  "settings.useAutoCompleteText": "Enable code completion in editor.",
-  "settings.useShowGasInEditorText": "Display gas estimates in editor.",
-  "settings.displayErrorsText": "Display errors in editor while typing.",
-  "settings.matomoAnalytics": "Enable Matomo Analytics. We do not collect personally identifiable information (PII). The info is used to improve the site’s UX & UI. See more about ",
-  "settings.enablePersonalModeText": " Enable Personal Mode for web3 provider. Transaction sent over Web3 will use the web3.personal API.\n",
-  "settings.warnText": "Be sure the endpoint is opened before enabling it.  This mode allows a user to provide a passphrase in the Remix interface without having to unlock the account. Although this is very convenient, you should completely trust the backend you are connected to (Geth, Parity, ...). Remix never persists any passphrase",
+  "settings.useAutoCompleteText": "Enable code completion in editor",
+  "settings.useShowGasInEditorText": "Display gas estimates in editor",
+  "settings.displayErrorsText": "Display errors in editor while typing",
+  "settings.matomoAnalytics": "Enable Matomo Analytics. See",
+  "settings.matomoAnalyticsTooltip": "We do not collect personally identifiable information (PII). The info is used to improve the site’s UX & UI.",
+  "settings.enablePersonalModeText": " Enable Personal Mode for web3 provider",
+  "settings.enablePersonalModeTooltip": "Transaction sent over Web3 will use the web3.personal API. Be sure the endpoint is opened before enabling it.  This mode allows a user to provide a passphrase in the Remix interface without having to unlock the account. Although this is very convenient, you should completely trust the backend you are connected to (Geth, Parity, ...). Remix never persists any passphrase",
   "settings.gitAccessTokenTitle": "Github Credentials",
   "settings.gitAccessTokenText": "The access token is used to publish a Gist and retrieve GitHub contents. You may need to input username/email.",
   "settings.gitAccessTokenText2":"Go to github token page (link below) to create a new token and save it in Remix. Make sure this token has only 'create gist' permission",

libs/remix-ui/settings/src/lib/remix-ui-settings.tsx

@@ -249,6 +249,13 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
               htmlFor="generatecontractmetadata"
             >
               <FormattedMessage id="settings.generateContractMetadataText" />
+              <CustomTooltip
+                placement="auto"
+                tooltipId="settings-tooltip-metadata"
+                tooltipText={intl.formatMessage({ id: 'settings.generateContractMetadataTooltip' })}
+              >
+                <i className="ml-1 far fa-info-circle"></i>
+              </CustomTooltip>
             </label>
           </div>
           <div className="mt-2 custom-control custom-checkbox mb-1">
@@ -296,11 +303,14 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
           <div className="custom-control custom-checkbox mb-1">
             <input onChange={onchangePersonal} id="personal" type="checkbox" className="custom-control-input" checked={isPersonalChecked} />
             <label className={`form-check-label custom-control-label align-middle ${getTextClass('settings/personal-mode')}`} htmlFor="personal">
-              <i className="fas fa-exclamation-triangle text-warning" aria-hidden="true"></i> <span> </span>
-              <span> </span>
               <FormattedMessage id="settings.enablePersonalModeText" />
-              &nbsp;
-              <FormattedMessage id="settings.warnText" />
+              <CustomTooltip
+                placement="auto"
+                tooltipId="settings-tooltip-personalMode"
+                tooltipText={intl.formatMessage({ id: 'settings.enablePersonalModeTooltip' })}
+              >
+                <i className="ml-1 fas fa-exclamation-triangle text-warning" aria-hidden="true"></i>
+              </CustomTooltip>
             </label>
           </div>
           <div className="custom-control custom-checkbox mb-1">
@@ -309,14 +319,21 @@ export const RemixUiSettings = (props: RemixUiSettingsProps) => {
               <span>
                 <FormattedMessage id="settings.matomoAnalytics" />
               </span>
-              <a href="https://medium.com/p/66ef69e14931/" target="_blank">
+              <a href="https://medium.com/remix-ide/help-us-improve-remix-ide-66ef69e14931" target="_blank">
                 {' '}
                 <FormattedMessage id="settings.analyticsInRemix" />
               </a>{' '}
               <span>&</span>{' '}
               <a target="_blank" href="https://matomo.org/free-software">
                 Matomo
               </a>
+              <CustomTooltip
+                placement="auto"
+                tooltipId="settings-tooltip-matomo"
+                tooltipText={intl.formatMessage({ id: 'settings.matomoAnalyticsTooltip' })}
+              >
+                <i className="ml-1 far fa-info-circle"></i>
+              </CustomTooltip>
             </label>
           </div>
           <div className="custom-control custom-checkbox mb-1">