space return

libs/remix-ui/solidity-compiler/src/lib/compiler-container.tsx

@@ -732,6 +732,7 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
     setToggleExpander(!toggleExpander)
   }
 
+
   return (
     <section>
       <article>
@@ -944,20 +945,26 @@ export const CompilerContainer = (props: CompilerContainerProps) => {
                   {(configFilePath === '' && state.useFileConfiguration) && <div> No config file selected</div>}
                 </div>}
             >
-              <span>
+              <div className="d-flex align-items-center">
-                { <i ref={compileIcon} className="fas fa-sync remixui_iconbtn" aria-hidden="true"></i> }
+                { <i ref={compileIcon} className="fas fa-sync remixui_iconbtn ml-4" aria-hidden="true"></i> }
-                <FormattedMessage id='solidity.compile' defaultMessage='Compile' />
+                <div className="d-flex justify-content-between align-items-center">
-                {typeof state.compiledFileName === 'string'
+                  <span>
-                  ? extractNameFromKey(state.compiledFileName) ||
+                    <FormattedMessage id='solidity.compile' defaultMessage='Compile' />
-                    `<${intl.formatMessage({
+                  </span>
-                      id: 'solidity.noFileSelected',
+                  <span className="ml-2">
-                      defaultMessage: 'no file selected',
+                    {typeof state.compiledFileName === 'string'
-                    })}>`
+                      ? extractNameFromKey(state.compiledFileName) ||
-                  : `<${intl.formatMessage({
+                        `<${intl.formatMessage({
-                      id: 'solidity.noFileSelected',
+                          id: 'solidity.noFileSelected',
-                      defaultMessage: 'no file selected',
+                          defaultMessage: 'no file selected',
-                    })}>`}
+                        })}>`
-              </span>
+                      : `<${intl.formatMessage({
+                          id: 'solidity.noFileSelected',
+                          defaultMessage: 'no file selected',
+                        })}>`}
+                  </span>
+                </div>
+              </div>
             </CustomTooltip>
           </button>
           <div className='d-flex align-items-center'>