Move clone button to the left

frontend/src/Indexer/Info/IndexerInfoModalContent.css

@@ -40,3 +40,16 @@
 .tabContent {
   margin-top: 20px;
 }
+
+.modalFooter {
+  composes: modalFooter from '~Components/Modal/ModalFooter.css';
+
+  justify-content: space-between;
+}
+
+@media only screen and (max-width: $breakpointExtraSmall) {
+  .modalFooter {
+    flex-direction: column;
+    gap: 10px;
+  }
+}

frontend/src/Indexer/Info/IndexerInfoModalContent.css.d.ts

@@ -3,6 +3,7 @@
 interface CssExports {
   'deleteButton': string;
   'description': string;
+  'modalFooter': string;
   'selectedTab': string;
   'tab': string;
   'tabContent': string;

frontend/src/Indexer/Info/IndexerInfoModalContent.tsx

@@ -348,19 +348,23 @@ function IndexerInfoModalContent(props: IndexerInfoModalContentProps) {
           </TabPanel>
         </Tabs>
       </ModalBody>
-      <ModalFooter>
-        <Button
-          className={styles.deleteButton}
-          kind={kinds.DANGER}
-          onPress={onDeleteIndexerPress}
-        >
-          {translate('Delete')}
-        </Button>
-        <Button onPress={onCloneIndexerPressWrapper}>
-          {translate('Clone')}
-        </Button>
-        <Button onPress={onEditIndexerPress}>{translate('Edit')}</Button>
-        <Button onPress={onModalClose}>{translate('Close')}</Button>
+      <ModalFooter className={styles.modalFooter}>
+        <div>
+          <Button
+            className={styles.deleteButton}
+            kind={kinds.DANGER}
+            onPress={onDeleteIndexerPress}
+          >
+            {translate('Delete')}
+          </Button>
+          <Button onPress={onCloneIndexerPressWrapper}>
+            {translate('Clone')}
+          </Button>
+        </div>
+        <div>
+          <Button onPress={onEditIndexerPress}>{translate('Edit')}</Button>
+          <Button onPress={onModalClose}>{translate('Close')}</Button>
+        </div>
       </ModalFooter>
 
       <EditIndexerModalConnector