Gray out and hide some options during export

res/css/views/dialogs/_ExportDialog.scss

@@ -9,8 +9,32 @@
         margin-bottom: 12px;
     }
 
-    &.mx_ExportDialog_Exporting .mx_ExportDialog_options {
-        pointer-events: none;
+    &.mx_ExportDialog_Exporting {
+        .mx_ExportDialog_options {
+            pointer-events: none;
+        }
+
+        .mx_RadioButton input[type="radio"]:checked + div > div {
+            background: gray;
+        }
+
+        .mx_Field_valid.mx_Field label,
+        .mx_Field_valid.mx_Field:focus-within label {
+            color: unset;
+        }
+
+        .mx_Field_valid.mx_Field,
+        .mx_Field_valid.mx_Field:focus-within {
+            border-color: unset;
+        }
+
+        .mx_Checkbox
+            input[type="checkbox"]:checked
+            + label
+            > .mx_Checkbox_background {
+            background: gray;
+            border-color: gray;
+        }
     }
 
     .mx_ExportDialog_progress {
@@ -26,7 +50,7 @@
             width: 24px;
             height: 24px;
             & .mx_ExportDialog_spinner_path {
-                stroke: #0dbd8b;
+                stroke: $accent-color;
                 stroke-linecap: round;
                 animation: mx_dash 1.5s ease-in-out infinite;
             }

src/components/views/dialogs/ExportDialog.tsx

@@ -284,18 +284,18 @@ const ExportDialog: React.FC<IProps> = ({ room, onFinished }) => {
         // Display export settings
         return (
             <BaseDialog
-                title={_t("Export Chat")}
+                title={isExporting ? _t("Exporting your data") : _t("Export Chat")}
                 className={`mx_ExportDialog ${isExporting && "mx_ExportDialog_Exporting"}`}
                 contentId="mx_Dialog_content"
                 hasCancel={true}
                 onFinished={onFinished}
                 fixedWidth={true}
             >
-                <p>
+                { !isExporting ? <p>
                     { _t(
                         "Select from the options below to export chats from your timeline",
                     ) }
-                </p>
+                </p> : null}
 
                 <span className="mx_ExportDialog_subheading">
                     { _t("Format") }

src/i18n/strings/en_EN.json

@@ -2300,6 +2300,7 @@
     "Your messages were successfully exported": "Your messages were successfully exported",
     "Are you sure you want to stop exporting your data? If you do, you'll need to start over.": "Are you sure you want to stop exporting your data? If you do, you'll need to start over.",
     "Stop": "Stop",
+    "Exporting your data": "Exporting your data",
     "Export Chat": "Export Chat",
     "Select from the options below to export chats from your timeline": "Select from the options below to export chats from your timeline",
     "Format": "Format",