summaryrefslogtreecommitdiff
path: root/web/source/settings/admin/federation
diff options
context:
space:
mode:
Diffstat (limited to 'web/source/settings/admin/federation')
-rw-r--r--web/source/settings/admin/federation/import-export/export-format-table.jsx42
-rw-r--r--web/source/settings/admin/federation/import-export/form.jsx12
-rw-r--r--web/source/settings/admin/federation/import-export/process.jsx37
3 files changed, 52 insertions, 39 deletions
diff --git a/web/source/settings/admin/federation/import-export/export-format-table.jsx b/web/source/settings/admin/federation/import-export/export-format-table.jsx
index 72b2db04f..54092944a 100644
--- a/web/source/settings/admin/federation/import-export/export-format-table.jsx
+++ b/web/source/settings/admin/federation/import-export/export-format-table.jsx
@@ -22,26 +22,28 @@ const React = require("react");
module.exports = function ExportFormatTable() {
return (
- <table className="export-format-table">
- <thead>
- <tr>
- <th rowSpan={2} />
- <th colSpan={2}>Includes</th>
- <th colSpan={2}>Importable by</th>
- </tr>
- <tr>
- <th>Domain</th>
- <th>Public comment</th>
- <th>GoToSocial</th>
- <th>Mastodon</th>
- </tr>
- </thead>
- <tbody>
- <Format name="Text" info={[true, false, true, false]} />
- <Format name="JSON" info={[true, true, true, false]} />
- <Format name="CSV" info={[true, true, true, true]} />
- </tbody>
- </table>
+ <div className="export-format-table-wrapper without-border">
+ <table className="export-format-table">
+ <thead>
+ <tr>
+ <th rowSpan={2} />
+ <th colSpan={2}>Includes</th>
+ <th colSpan={2}>Importable by</th>
+ </tr>
+ <tr>
+ <th>Domain</th>
+ <th>Public comment</th>
+ <th>GoToSocial</th>
+ <th>Mastodon</th>
+ </tr>
+ </thead>
+ <tbody>
+ <Format name="Text" info={[true, false, true, false]} />
+ <Format name="JSON" info={[true, true, true, false]} />
+ <Format name="CSV" info={[true, true, true, true]} />
+ </tbody>
+ </table>
+ </div>
);
};
diff --git a/web/source/settings/admin/federation/import-export/form.jsx b/web/source/settings/admin/federation/import-export/form.jsx
index 7b6ad9206..0176b73a2 100644
--- a/web/source/settings/admin/federation/import-export/form.jsx
+++ b/web/source/settings/admin/federation/import-export/form.jsx
@@ -77,7 +77,8 @@ module.exports = function ImportExportForm({ form, submitParse, parseResult }) {
result={parseResult}
showError={false}
/>
- <label className="button">
+ <label className="button with-icon">
+ <i class="fa fa-fw " aria-hidden="true" />
Import file
<input
type="file"
@@ -93,7 +94,14 @@ module.exports = function ImportExportForm({ form, submitParse, parseResult }) {
onClick={() => submitExport("export")}
result={exportResult} showError={false}
/>
- <MutationButton label="Export to file" type="button" onClick={() => submitExport("export-file")} result={exportResult} showError={false} />
+ <MutationButton
+ label="Export to file"
+ wrapperClassName="export-file-button"
+ type="button"
+ onClick={() => submitExport("export-file")}
+ result={exportResult}
+ showError={false}
+ />
<div className="export-file">
<span>
as
diff --git a/web/source/settings/admin/federation/import-export/process.jsx b/web/source/settings/admin/federation/import-export/process.jsx
index 6b9d98f01..feb3631e1 100644
--- a/web/source/settings/admin/federation/import-export/process.jsx
+++ b/web/source/settings/admin/federation/import-export/process.jsx
@@ -127,11 +127,13 @@ function ImportList({ list, data: blockedInstances }) {
} />
}
- <DomainCheckList
- field={form.domains}
- blockedInstances={blockedInstances}
- commentType={showComment.value}
- />
+ <div className="checkbox-list-wrapper">
+ <DomainCheckList
+ field={form.domains}
+ blockedInstances={blockedInstances}
+ commentType={showComment.value}
+ />
+ </div>
<TextArea
field={form.privateComment}
@@ -182,7 +184,6 @@ function DomainCheckList({ field, blockedInstances, commentType }) {
field={field}
header={<>
<b>Domain</b>
- <b></b>
<b>
{commentType == "public_comment" && "Public comment"}
{commentType == "private_comment" && "Private comment"}
@@ -287,16 +288,18 @@ function DomainEntry({ entry, onChange, extraProps: { alreadyExists, comment } }
return (
<>
- <TextInput
- field={domainField}
- onChange={(e) => {
- domainField.onChange(e);
- onChange({ domain: e.target.value, checked: true });
- }}
- />
- <span id="icon" onClick={clickIcon}>
- <DomainEntryIcon alreadyExists={alreadyExists} suggestion={entry.suggest} onChange={onChange} />
- </span>
+ <div className="domain-input">
+ <TextInput
+ field={domainField}
+ onChange={(e) => {
+ domainField.onChange(e);
+ onChange({ domain: e.target.value, checked: true });
+ }}
+ />
+ <span id="icon" onClick={clickIcon}>
+ <DomainEntryIcon alreadyExists={alreadyExists} suggestion={entry.suggest} onChange={onChange} />
+ </span>
+ </div>
<p>{comment}</p>
</>
);
@@ -320,7 +323,7 @@ function DomainEntryIcon({ alreadyExists, suggestion }) {
return (
<>
- <i className={`fa ${icon}`} aria-hidden="true" title={text}></i>
+ <i className={`fa fa-fw ${icon}`} aria-hidden="true" title={text}></i>
<span className="sr-only">{text}</span>
</>
);