Fixed: Import list exclusion display overflow

Fixes #1140

frontend/src/Settings/ImportLists/ImportListExclusions/ImportListExclusion.css

@@ -7,12 +7,12 @@
   line-height: 30px;
 }
 
-.authorName {
+.name {
-  flex: 0 0 300px;
+  flex: 1 0 300px;
 }
 
 .foreignId {
-  flex: 0 0 400px;
+  flex: 0 0 200px;
 }
 
 .actions {

frontend/src/Settings/ImportLists/ImportListExclusions/ImportListExclusion.js

@@ -65,8 +65,8 @@ class ImportListExclusion extends Component {
           styles.importListExclusion
         )}
       >
-        <div className={styles.authorName}>{authorName}</div>
         <div className={styles.foreignId}>{foreignId}</div>
+        <div className={styles.name}>{authorName}</div>
 
         <div className={styles.actions}>
           <Link

frontend/src/Settings/ImportLists/ImportListExclusions/ImportListExclusions.css

@@ -4,12 +4,12 @@
   font-weight: bold;
 }
 
-.host {
+.foreignId {
-  flex: 0 0 300px;
+  flex: 0 0 200px;
 }
 
-.path {
+.name {
-  flex: 0 0 400px;
+  flex: 1 0 300px;
 }
 
 .addImportListExclusion {

frontend/src/Settings/ImportLists/ImportListExclusions/ImportListExclusions.js

@@ -51,8 +51,8 @@ class ImportListExclusions extends Component {
           {...otherProps}
         >
           <div className={styles.importListExclusionsHeader}>
-            <div className={styles.host}>Name</div>
+            <div className={styles.foreignId}>Foreign Id</div>
-            <div className={styles.path}>Foreign Id</div>
+            <div className={styles.name}>Name</div>
           </div>
 
           <div>