firmware/bootloaderInstructions: Refactor.

- Use steps for the connection procedure
- Use categories (To do: consider making numbering consecutive)
- Show hub bootloader device name explicitly
- List official app to use for recovery (make V2/V3 explicit)
- Copy edit

Also fix the layout (class) of the installation panel to make it consistent with the style of the recovery panel.

src/firmware/installPybricksDialog/InstallPybricksDialog.tsx

@@ -400,15 +400,11 @@ const BootloaderModePanel: React.VoidFunctionComponent<BootloaderModePanelProps>
     const i18n = useI18n();
 
     return (
-        <div className={dialogBody}>
-            <BootloaderInstructions hubType={hubType} />
-            <p>
-                {i18n.translate('bootloaderPanel.instruction2', {
-                    flashFirmware: (
-                        <strong>{i18n.translate('flashFirmwareButton.label')}</strong>
-                    ),
-                })}
-            </p>
+        <div className={classNames(Classes.DIALOG_BODY, Classes.RUNNING_TEXT)}>
+            <BootloaderInstructions
+                hubType={hubType}
+                flashButtonText={i18n.translate('flashFirmwareButton.label')}
+            />
         </div>
     );
 };