Style Extensions page

Signed-off-by: Alex Andreev <alex.andreev.email@gmail.com>

src/renderer/components/+extensions/extensions.scss

@@ -19,21 +19,6 @@
  * CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  */
 
-.PageLayout.Extensions {
-  $spacing: $padding * 2;
-  width: 100%;
-
-  .contentRegion {
-    .content {
-      max-width: 740px;
-
-      > section {
-        height: 100%;
-      }
-    }
-  }
-}
-
 .InstallingExtensionNotification {
   .remove-folder-warning {
     font-size: $font-size-small;

src/renderer/components/+extensions/extensions.tsx

@@ -512,9 +512,9 @@ export class Extensions extends React.Component<Props> {
 
     return (
       <DropFileInput onDropFiles={installOnDrop}>
-        <SettingLayout className="Extensions">
+        <SettingLayout>
           <section>
-            <h1>Extensions</h1>
+            <h2>Extensions</h2>
 
             <Notice className="mb-14 mt-3">
               <p>
@@ -532,7 +532,7 @@ export class Extensions extends React.Component<Props> {
               installPath={this.installPath}
             />
 
-            {extensions.length > 0 && <hr/>}
+            {extensions.length > 0 && <hr className="mb-12"/>}
 
             <InstalledExtensions
               extensions={extensions}

src/renderer/components/+extensions/install.tsx

@@ -55,7 +55,7 @@ export const Install = observer((props: Props) => {
   const { installPath, supportedFormats, onChange, installFromInput, installFromSelectFileDialog } = props;
 
   return (
-    <section className="mt-2">
+    <section className="mt-2 mb-12">
       <SubTitle title={`Name or file path or URL to an extension package (${supportedFormats.join(", ")})`}/>
       <div className="flex">
         <div className="flex-1">

src/renderer/components/+extensions/installed-extensions.tsx

@@ -167,7 +167,7 @@ export const InstalledExtensions = observer(({ extensions, uninstall, enable, di
   return (
     <section data-testid="extensions-table">
       <List
-        title={<h2 className={styles.title}>Installed extensions</h2>}
+        title={<h2 className={styles.title}>Installed</h2>}
         columns={columns}
         data={data}
         items={extensions}