relocate the git fetch button. format code.

libs/remix-ui/git/src/components/github/repositoryselect.tsx

@@ -64,7 +64,7 @@ const RepositorySelect = (props: RepositorySelectProps) => {
   };
 
   return (
-    <><button data-id='fetch-repositories' onClick={fetchRepositories} className="w-100 mt-1 btn btn-secondary">
+    <><button data-id='fetch-repositories' onClick={fetchRepositories} className="w-100 mt-1 btn btn-secondary mb-2">
       <i className="fab fa-github mr-1"></i>Fetch Repositories from GitHub
     </button>
     {

libs/remix-ui/git/src/components/github/selectandclonerepositories.tsx

@@ -44,15 +44,15 @@ export const SelectAndCloneRepositories = (props: RepositoriesProps) => {
 
   return (
     <>
-      <TokenWarning plugin={props.plugin} />
       <RepositorySelect select={selectRepo} />
+      <TokenWarning plugin={props.plugin} />
 
-      {repo &&<BranchSelect select={selectRemoteBranch} />}
+      { repo && <BranchSelect select={selectRemoteBranch} /> }
 
-      {repo && branch && branch.name && branch.name !== '0' ?
+      { repo && branch && branch.name && branch.name !== '0' ?
         <button data-id={`clonebtn-${repo.full_name}-${branch.name}`} className='btn btn-primary mt-1 w-100' onClick={async () => {
           await clone()
-        }}>clone {repo.full_name}:{branch.name}</button> : null}
+        }}>clone {repo.full_name}:{branch.name}</button> : null }
 
     </>
   )

libs/remix-ui/git/src/components/panels/clone.tsx

@@ -68,6 +68,8 @@ export const Clone = ({ plugin }: CloneProps) => {
   return (
     <>
       <div data-id="clone-panel-content" className="px-3 py-2">
+        <SelectAndCloneRepositories cloneAllBranches={cloneAllBranches} cloneDepth={cloneDepth} plugin={plugin} />
+        <hr />
         <InputGroup className="mb-2 pb-1">
           <FormControl data-id="clone-url" id="cloneulr" placeholder="url" name='cloneurl' value={cloneUrl} onChange={e => onGitHubCloneUrlChange(e.target.value)} aria-describedby="urlprepend" />
         </InputGroup>
@@ -77,8 +79,6 @@ export const Clone = ({ plugin }: CloneProps) => {
           clone()
         }}>clone</GitUIButton>
         <hr />
-        <SelectAndCloneRepositories cloneAllBranches={cloneAllBranches} cloneDepth={cloneDepth} plugin={plugin} />
-        <hr />
         <label>Options</label>
         <InputGroup className="mt-1 mb-1">
           <InputGroup.Prepend className="bg-secondary">

libs/remix-ui/git/src/components/panels/tokenWarning.tsx

@@ -9,11 +9,11 @@ export const TokenWarning = (props: TokenWarningProps) => {
   const context = React.useContext(gitPluginContext)
   return (<>
     {(context.gitHubUser && context.gitHubUser.login) ? null :
-      <li className="text-warning list-group-item text-left">
-        <span>Generate and add a Git token to use this plugin. Tokens are found in </span><span className=" text-decoration-line-through messageTip" onClick={async () => {
+      <span className="text-warning text-left">
+        <span>Generate and add a Git token to use this plugin. Tokens are added in </span><span className=" text-decoration-line-through messageTip" onClick={async () => {
           await props.plugin.call('menuicons', 'select', 'settings')
         }}>settings</span><span> of the IDE.</span>
-      </li>
+      </span>
     }
   </>
   )